17783
How-to Читать 13 минут

Как создать внутренний поиск на сайте

Как реализовать поиск по сайту
ЧЕК-ЛИСТ: ТЕХНИЧЕСКАЯ ЧАСТЬ — УДОБСТВО
Инструкцию одобрил
Tech Head of SEO в TRINET.Group
Пользователи приходят на сайт за определенным контентом. Чтобы обеспечить удобный доступ ко всем материалам ресурса, необходимо добавить на сайт функцию поиска. Реализовать поиск текста на сайте можно с помощью готовых программных решений.

Использование расширенного поиска на сайтах

Большинство систем управления контентом (CMS) поддерживает встроенные решения для поиска, однако они не всегда обладают всем необходимым функционалом. Поэтому многие владельцы предпочитают добавлять на сайт «живой поиск» с выпадающими подсказками, с помощью которого пользователи сразу видят рядом со своим запросом подходящие результаты:
Расширенный поиск на сайте
Пример живого поиска на сайте
Также можно реализовать рабочий поиск с учетом дополнительных фильтров по категории, размеру, цвету, модели и прочим параметрам:
Поиск по товарам и категориям в интернет-магазине
Пример реализации поиска с уточнением категории товара
Использование поиска по сайту можно анализировать с помощью Google Analytics и применять эти данные для улучшения SEO. Благодаря анализу данных можно узнать, что находят/не находят пользователи и создавать посадочные страницы, изменять навигацию, переименовывать категории и т.д.

Чтобы включить сбор данных о поиске на сайте нужно узнать, какой используется параметр для этой функции. Увидеть его можно в строке URL-адреса при поиске на сайте. Например, может использоваться параметр /search/?search="запрос пользователя" либо search.php?s="поисковый запрос":
Параметры поиска в URL-адресе
Параметры поиска в строке браузера
Затем перейдем в раздел «Администратор» Google Analytics и выберем нужное представление. В настройках включим отслеживание поиска по сайту:
Отслеживание поиска по сайту в Google Analytics
Включение отслеживания поиска по сайту в Google Analytics
После этого добавим параметры поиска и, при необходимости, категории, используемые на сайте:
Параметры запроса и категории внутреннего поиска в Google Analytics
Указание параметров запроса для отслеживания поиска по сайту
Параметр категории также можно узнать из адресной строки при расширенном поиске в конкретной категории. После внесения параметров нажмем «Сохранить».

Просмотреть поисковые запросы посетителей можно в разделе «Поведение» — «Поиск по сайту»:
Анализ внутреннего поиска и запросов пользователей в Google Analytics
Статистика поиска по сайту

Как добавить поиск Google на сайт

На сайт можно добавить поиск Гугл. В начале необходимо получить идентификатор поисковой системы:
Система пользовательского поиска Google
Добавление поиска Google на сайт
Данный метод можно применять, чтобы добавить поиск Google на любые сайты вне зависимости от используемой CMS.

Заполним поля, указав адрес своего сайта, нужный язык и название поисковой системы. После этого нажмем «Создать»:
Как создать систему пользовательского поиска Google
Добавление поиска Google на сайт
Затем нужно получить html-код для размещения на сайте:
Код системы пользовательского поиска Google для сайта
Получение кода поиска Google для сайта
Скопируем полученный код на сайт:
Получение кода системы пользовательского поиска Google
Код системы пользовательского поиска Google

Как добавить поиск Яндекса на сайт

Как альтернативу поиску с помощью Google, на любой сайт можно также установить поиск с помощью Яндекса:
Яндекс.Поиск для сайта
Поиск Яндекс для сайта
Преимущества поиска с помощью Яндекса:

  • Яндекс поиск будет учитывать различные варианты написания слов, в том числе и неправильные — с использованием другой раскладки и грамматическими ошибками;

  • можно задавать настройки синонимов на сайте: например, пользователь, который введет запрос «шторы голубого цвета», найдет на ресурсе страницу с товаром «шторы лазурного цвета»;

  • можно менять дизайн и цветовую схему, чтобы настроить красивый вариант формы поиска;

  • можно использовать стандартные поисковые подсказки и сделать дополнительные: при вводе определенных слов пользователь будет видеть предложенные варианты запросов;

  • можно уточнять критерии поиска, указав временной период публикации, категорию, формат и другие параметры;

  • в отчете по статистике доступны все запросы пользователей за интересующий период, отображается количество показов и кликов.

Чтобы добавить поиск Яндекса на собственный проект, нужно перейти в раздел установки и следовать инструкциям. Для добавления поиска должны быть подтверждены права на сайт в панели Яндекс.Вебмастер.

Поиск по сайту от Яндекс и Google работает по страницам попавшим в индекс поисковых систем, соответственно, если страницы нет в индексе, то она и не попадет в поиск по сайту, рекомендуем учитывать данный фактор.

Как внедрить поиск на сайт с помощью модулей

Добавить быстрый расширенный поиск можно с помощью соответствующих модулей для своей CMS. Рассмотрим примеры бесплатных расширений, которые можно быстро установить на сайт.

Живой ajax-поиск для сайтов на OpenCart

[Free] Ajax live search — бесплатный плагин живого ajax-поиска для интернет-магазинов на OpenCart.
Плагин ajax-поиска для интернет-магазинов на OpenCart
Модуль ajax-поиска для OpenCart
Модуль совместим с OpenCart 2-3 версий, поддерживает мультиязычность, быстро и просто устанавливается, не изменяя исходный код ресурса.

Чтобы установить модуль, скачаем архив для нужной версии OpenCart:
Скачивание модуля Ajax live search для OpenCart
Выбор модуля нужной версии OpenCart
В загруженном архиве необходимо поменять расширение: .zip на .xml:
Смена расширения модуля для OpenCart
Изменение расширения модуля поиска
После этого нужно загрузить данный файл через административную панель сайта. Перейдем в «Установщик дополнений» и нажмем «Загрузить».
Установщик дополнений OpenCart
Загрузка модуля
После установки либо удаления модулей OpenCart необходимо обновлять кэш модификаторов, иначе изменения не отобразятся на сайте. Перейдем в раздел «Менеджер дополнений» и нажмем «Обновить»:
Менеджер дополнений OpenCart
Обновление кэша после загрузки модуля
После этого перейдем в «Дополнения», установим там модуль «Ajax Live Search» и перейдем к его редактированию:
Установка модуля Ajax live search для OpenCart
Редактирование модуля поиска
Здесь можно настроить работу модуля в соответствии с собственными предпочтениями. После этого поменяем статус модуля, выбрав «Включено»:
Редактирование модуля Ajax live search для OpenCart
Включение модуля Ajax live search
Затем можно проверить работу поиска на сайте:
Поиск товаров на CMS OpenCart
Проверка работы модуля на сайте
Модуль установлен корректно, на сайте работает улучшенный поиск.

Поиск Google для сайтов на WordPress

В магазине дополнений WordPress можно найти различные варианты плагинов поиска. Рассмотрим установку плагина WP Google Search, позволяющего добавить форму поиска Google на собственный сайт:
Плагин WP Google Search
Плагин поиска WP Google Search
Данный плагин позволит тонко настроить стиль оформления окна поиска, добавить автозаполнение, использовать журналы со статистикой запросов посетителей сайта.

Перейдем в раздел «Плагины» и выберем «Добавить новый». Затем найдем плагин по названию и нажмем «Установить»:
Установка плагина WP Google Search
Установка плагина поиска
После установки жмем «Активировать». После этого нужно настроить поиск, перейдя в появившийся раздел «WP Google Search»:
Активация плагина WP Google Search
Активация плагина поиска WP Google Search
Для работы плагина понадобится настроить поиск Google, как это было описано ранее в пункте 2.

После этого вернемся в админку WordPress и перейдем в «Редактор».
Редактор страниц в админ-панели WordPress
Редактор в админке WordPress
Затем нужно отредактировать и обновить шаблон страницы page.php, добавив в нужное место строку поиска с помощью скопированного кода:
Редактирование кода page.php в WordPress
Добавление кода поиска в page.php
Последний пункт действий — вернуться в настройки пользовательского поиска Google и скопировать идентификатор поисковой системы:
Идентификатор поисковой системы Google
Идентификатор поиска Google
Этот код внесем в админку сайта:
Настройка плагина WP Google Search
Настройка плагина поиска WP Google Search
После этих действий на всех страницах сайта, кроме главной, появится поиск Google:
Поиск Google для сайта на WordPress
Пример поиска Google на сайте
Проверив работу поиска, увидим, что он корректно отображает страницы сайта после рекламных результатов:
Внутренний поиск Google для CMS WordPress
Поиск Google на сайте WordPress
Для добавления поиска на главную страницу нужно отдельно править шаблон front-page.php и добавлять в него код поиска.

Как сделать поиск по сайту на HTML своими руками

Если вы владеете навыками программирования и готовы написать код для поиска самостоятельно, то можно создать форму поиска с помощью HTML и CSS своими руками. Для этого добавьте в нужное место сайта строку поиска с помощью такого кода:
<div class="mysearch">
<input type="text" placeholder="Поиск по сайту">
</div>

/* После этого добавьте стили CSS, например, задайте внешний вид окна поиска таким образом:*/

.mysearch input[type=text] {
float: left; /* Выравниваем строку поиска по левому краю, а все остальные элементы обтекают ее по правому краю.*/
background: #e0d1d1; /* Устанавливаем цвет фона */
padding: 10px;/* Задаем поля вокруг текста */
border: 2px solid black; /* Устанавливаем рамку */
margin-top: 15px; /* Задаем отступ сверху */
margin-right: 12px; /* Задаем отступ справа */
font-size: 14px; /* Указываем размер шрифта */
}

Как добавить голосовой поиск на сайт

В последнее время приобрел большую популярность голосовой поиск, который доступен на подавляющем большинстве мобильных устройств. Чтобы улучшить юзабилити сайта и привлечь на него дополнительную аудиторию, добавьте голосовой поиск на свой проект.

Для добавления голосового поиска на сайт можно использовать Web Speech API — бесплатную технологию движка Chromium, которая позволяет преобразовывать голос в текст с помощью добавления на свой ресурс определенного кода JavaScript. Такое распознавание голоса можно внедрять в поиск любого веб-сайта или онлайн-магазина.

Также для добавления голосового поиска можно использовать плагины и модули нужной CMS, например, Voice Search или Universal Voice Search для сайтов на WordPress.
Плагины голосового поиска для сайтов WordPress
Плагины для голосового поиска WordPress
Сергей Кокшаров «Как получать больше трафика из голосового поиска»

Заключение

Удобный поиск на сайте важен для любого крупного ресурса. Организовать расширенный поиск на сайте можно, используя специальные модули либо готовые решения от поисковых систем.

Поиск с помощью Google или Яндекс на сайте позволяет кастомизировать и настраивать интерфейс, использовать дополнительные параметры и быстро получать подробную статистику запросов посетителей сайта.

FAQ

Как работает система поиска на сайте?

Поиск на сайте работает на основе скрипта, который обрабатывает текст, введенный пользователем в форму поиска. Скрипт поиска может быть встроен в CMS, добавлен с помощью кода, предлагаемого поисковыми системами, или написан самостоятельно на PHP и других языках программирования.

Как сделать поиск по сайту?

Поиск на сайте можно добавить с помощью плагинов и модулей CMS, например, установив модуль Ajax live search для интернет-магазина на OpenCart. Для сайтов WordPress подойдет плагин WP Google Search, который позволяет внедрить на ресурс поиск Google.

Как добавить строку поиска Google на сайт?

Google позволяет создать систему пользовательского поиска. Для этого нужно указать адрес своего сайта и получить идентификатор, после чего будет сгенерирован код для добавления на ресурс. После внедрения HTML-кода на сайте будет отображаться строка поиска Google.

Как добавить Яндекс поиск на сайт?

Чтобы добавить Яндекс.Поиск на свой сайт, подтвердите на него права в Яндекс.Вебмастере. Затем перейдите в раздел установки Яндекс.Поиска и следуйте инструкциям. Учитывайте, что пользовательский поиск на сайте будет осуществляться только по страницам, которые находятся в индексе Яндекса.

Как включить голосовой поиск на сайте?

Для включения голосового поиска на сайте можно использовать плагины и модули, например, плагин WordPress Universal Voice Search. Также для включения голосового поиска на любых сайтах подойдет Web Speech API — бесплатная технология движка Chromium, осуществляющая распознавание голоса в текст.

Эта статья — часть модуля «Список задач» в Serpstat
«Список задач» в Serpstat
«Список задач» — готовый to-do лист, который поможет вести учет
о выполнении работ по конкретному проекту. Инструмент содержит готовые шаблоны с обширным списком параметров по развитию проекта, к которым также можно добавлять собственные пункты.
Начать работу со «Списком задач»

Сэкономьте время на изучении Serpstat

Хотите получить персональную демонстрацию сервиса, тестовый период или эффективные кейсы использования Serpstat?

Оставьте заявку и мы свяжемся с вами ;)

Оцените статью по 5-бальной шкале

4.8 из 5 на основе 5 оценок
Нашли ошибку? Выделите её и нажмите Ctrl + Enter, чтобы сообщить нам.

Поделитесь статьей с вашими друзьями

Вы уверены?

Знакомство с Serpstat

Узнайте об основных возможностях сервиса удобным способом!

Отправьте заявку и наш специалист предложит вам варианты обучения: персональную демонстрацию, пробный период или материалы для самостоятельного изучения и повышения экспертизы. Все для комфортного начала работы с Serpstat.

Имя

Email

Телефон

Будем рады вашему комментарию
Я принимаю условия Политики конфиденциальности.

Спасибо, мы сохранили ваши новые настройки рассылок.

Сообщить об ошибке

Отменить

Мы используем файлы cookie для обеспечения работоспособности сервиса, улучшения навигации и маркетинговых активностей Serpstat. Нажимая "Принять и продолжить", вы соглашаетесь с нашей Политика конфиденциальности

Открыть чат технической поддержки
mail pocket flipboard Messenger telegramm