Как создать внутренний поиск на сайте
ЧЕК-ЛИСТ: ТЕХНИЧЕСКАЯ ЧАСТЬ — УДОБСТВО
Инструкцию одобрил
Tech Head of SEO в TRINET.Group
Tech Head of SEO в TRINET.Group
Пользователи приходят на сайт за определенным контентом. Чтобы обеспечить удобный доступ ко всем материалам ресурса, необходимо добавить на сайт функцию поиска. Реализовать поиск текста на сайте можно с помощью готовых программных решений.
Содержание
- Использование расширенного поиска на сайтах
- Как добавить поиск Google на сайт
- Как добавить поиск Яндекса на сайт
- Как внедрить поиск на сайт с помощью модулей
5.1. Живой ajax-поиск для сайтов на OpenCart
5.2. Поиск Google для сайтов на WordPress - Как сделать поиск по сайту на HTML своими руками
- Как добавить голосовой поиск на сайт
- Заключение
- FAQ
Использование расширенного поиска на сайтах
Большинство систем управления контентом (CMS) поддерживает встроенные решения для поиска, однако они не всегда обладают всем необходимым функционалом. Поэтому многие владельцы предпочитают добавлять на сайт «живой поиск» с выпадающими подсказками, с помощью которого пользователи сразу видят рядом со своим запросом подходящие результаты:
Пример живого поиска на сайте
Также можно реализовать рабочий поиск с учетом дополнительных фильтров по категории, размеру, цвету, модели и прочим параметрам:
Пример реализации поиска с уточнением категории товара
Использование поиска по сайту можно анализировать с помощью Google Analytics и применять эти данные для улучшения SEO. Благодаря анализу данных можно узнать, что находят/не находят пользователи и создавать посадочные страницы, изменять навигацию, переименовывать категории и т.д.
Чтобы включить сбор данных о поиске на сайте нужно узнать, какой используется параметр для этой функции. Увидеть его можно в строке URL-адреса при поиске на сайте. Например, может использоваться параметр /search/?search="запрос пользователя" либо search.php?s="поисковый запрос":
Чтобы включить сбор данных о поиске на сайте нужно узнать, какой используется параметр для этой функции. Увидеть его можно в строке URL-адреса при поиске на сайте. Например, может использоваться параметр /search/?search="запрос пользователя" либо search.php?s="поисковый запрос":
Параметры поиска в строке браузера
Затем перейдем в раздел «Администратор» Google Analytics и выберем нужное представление. В настройках включим отслеживание поиска по сайту:
Включение отслеживания поиска по сайту в Google Analytics
После этого добавим параметры поиска и, при необходимости, категории, используемые на сайте:
Указание параметров запроса для отслеживания поиска по сайту
Параметр категории также можно узнать из адресной строки при расширенном поиске в конкретной категории. После внесения параметров нажмем «Сохранить».
Просмотреть поисковые запросы посетителей можно в разделе «Поведение» — «Поиск по сайту»:
Просмотреть поисковые запросы посетителей можно в разделе «Поведение» — «Поиск по сайту»:
Статистика поиска по сайту
Как добавить поиск Google на сайт
На сайт можно добавить поиск Гугл. В начале необходимо получить идентификатор поисковой системы:
Добавление поиска Google на сайт
Данный метод можно применять, чтобы добавить поиск Google на любые сайты вне зависимости от используемой CMS.
Заполним поля, указав адрес своего сайта, нужный язык и название поисковой системы. После этого нажмем «Создать»:
Заполним поля, указав адрес своего сайта, нужный язык и название поисковой системы. После этого нажмем «Создать»:
Добавление поиска Google на сайт
Затем нужно получить html-код для размещения на сайте:
Получение кода поиска Google для сайта
Скопируем полученный код на сайт:
Код системы пользовательского поиска Google
Как добавить поиск Яндекса на сайт
Как альтернативу поиску с помощью Google, на любой сайт можно также установить поиск с помощью Яндекса:
Поиск Яндекс для сайта
Преимущества поиска с помощью Яндекса:
Чтобы добавить поиск Яндекса на собственный проект, нужно перейти в раздел установки и следовать инструкциям. Для добавления поиска должны быть подтверждены права на сайт в панели Яндекс.Вебмастер.
Поиск по сайту от Яндекс и Google работает по страницам попавшим в индекс поисковых систем, соответственно, если страницы нет в индексе, то она и не попадет в поиск по сайту, рекомендуем учитывать данный фактор.
- Яндекс поиск будет учитывать различные варианты написания слов, в том числе и неправильные — с использованием другой раскладки и грамматическими ошибками;
- можно задавать настройки синонимов на сайте: например, пользователь, который введет запрос «шторы голубого цвета», найдет на ресурсе страницу с товаром «шторы лазурного цвета»;
- можно менять дизайн и цветовую схему, чтобы настроить красивый вариант формы поиска;
- можно использовать стандартные поисковые подсказки и сделать дополнительные: при вводе определенных слов пользователь будет видеть предложенные варианты запросов;
- можно уточнять критерии поиска, указав временной период публикации, категорию, формат и другие параметры;
- в отчете по статистике доступны все запросы пользователей за интересующий период, отображается количество показов и кликов.
Чтобы добавить поиск Яндекса на собственный проект, нужно перейти в раздел установки и следовать инструкциям. Для добавления поиска должны быть подтверждены права на сайт в панели Яндекс.Вебмастер.
Поиск по сайту от Яндекс и Google работает по страницам попавшим в индекс поисковых систем, соответственно, если страницы нет в индексе, то она и не попадет в поиск по сайту, рекомендуем учитывать данный фактор.
Как внедрить поиск на сайт с помощью модулей
Добавить быстрый расширенный поиск можно с помощью соответствующих модулей для своей CMS. Рассмотрим примеры бесплатных расширений, которые можно быстро установить на сайт.
Живой ajax-поиск для сайтов на OpenCart
[Free] Ajax live search — бесплатный плагин живого ajax-поиска для интернет-магазинов на OpenCart.
Модуль ajax-поиска для OpenCart
Модуль совместим с OpenCart 2-3 версий, поддерживает мультиязычность, быстро и просто устанавливается, не изменяя исходный код ресурса.
Чтобы установить модуль, скачаем архив для нужной версии OpenCart:
Чтобы установить модуль, скачаем архив для нужной версии OpenCart:
Выбор модуля нужной версии OpenCart
В загруженном архиве необходимо поменять расширение: .zip на .xml:
Изменение расширения модуля поиска
После этого нужно загрузить данный файл через административную панель сайта. Перейдем в «Установщик дополнений» и нажмем «Загрузить».
Загрузка модуля
После установки либо удаления модулей OpenCart необходимо обновлять кэш модификаторов, иначе изменения не отобразятся на сайте. Перейдем в раздел «Менеджер дополнений» и нажмем «Обновить»:
Обновление кэша после загрузки модуля
После этого перейдем в «Дополнения», установим там модуль «Ajax Live Search» и перейдем к его редактированию:
Редактирование модуля поиска
Здесь можно настроить работу модуля в соответствии с собственными предпочтениями. После этого поменяем статус модуля, выбрав «Включено»:
Включение модуля Ajax live search
Затем можно проверить работу поиска на сайте:
Проверка работы модуля на сайте
Модуль установлен корректно, на сайте работает улучшенный поиск.
Поиск Google для сайтов на WordPress
В магазине дополнений WordPress можно найти различные варианты плагинов поиска. Рассмотрим установку плагина WP Google Search, позволяющего добавить форму поиска Google на собственный сайт:
Плагин поиска WP Google Search
Данный плагин позволит тонко настроить стиль оформления окна поиска, добавить автозаполнение, использовать журналы со статистикой запросов посетителей сайта.
Перейдем в раздел «Плагины» и выберем «Добавить новый». Затем найдем плагин по названию и нажмем «Установить»:
Перейдем в раздел «Плагины» и выберем «Добавить новый». Затем найдем плагин по названию и нажмем «Установить»:
Установка плагина поиска
После установки жмем «Активировать». После этого нужно настроить поиск, перейдя в появившийся раздел «WP Google Search»:
Активация плагина поиска WP Google Search
Для работы плагина понадобится настроить поиск Google, как это было описано ранее в пункте 2.
После этого вернемся в админку WordPress и перейдем в «Редактор».
После этого вернемся в админку WordPress и перейдем в «Редактор».
Редактор в админке WordPress
Затем нужно отредактировать и обновить шаблон страницы page.php, добавив в нужное место строку поиска с помощью скопированного кода:
Добавление кода поиска в page.php
Последний пункт действий — вернуться в настройки пользовательского поиска Google и скопировать идентификатор поисковой системы:
Идентификатор поиска Google
Этот код внесем в админку сайта:
Настройка плагина поиска WP Google Search
После этих действий на всех страницах сайта, кроме главной, появится поиск Google:
Пример поиска Google на сайте
Проверив работу поиска, увидим, что он корректно отображает страницы сайта после рекламных результатов:
Поиск 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.
Для добавления голосового поиска на сайт можно использовать Web Speech API — бесплатную технологию движка Chromium, которая позволяет преобразовывать голос в текст с помощью добавления на свой ресурс определенного кода JavaScript. Такое распознавание голоса можно внедрять в поиск любого веб-сайта или онлайн-магазина.
Также для добавления голосового поиска можно использовать плагины и модули нужной CMS, например, Voice Search или Universal Voice Search для сайтов на WordPress.
Плагины для голосового поиска WordPress
Сергей Кокшаров «Как получать больше трафика из голосового поиска»
Заключение
Удобный поиск на сайте важен для любого крупного ресурса. Организовать расширенный поиск на сайте можно, используя специальные модули либо готовые решения от поисковых систем.
Поиск с помощью Google или Яндекс на сайте позволяет кастомизировать и настраивать интерфейс, использовать дополнительные параметры и быстро получать подробную статистику запросов посетителей сайта.
Поиск с помощью 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
«Список задач» — готовый to-do лист, который поможет вести учет
о выполнении работ по конкретному проекту. Инструмент содержит готовые шаблоны с обширным списком параметров по развитию проекта, к которым также можно добавлять собственные пункты.
о выполнении работ по конкретному проекту. Инструмент содержит готовые шаблоны с обширным списком параметров по развитию проекта, к которым также можно добавлять собственные пункты.
| Начать работу со «Списком задач» |
Сэкономьте время на изучении Serpstat
Хотите получить персональную демонстрацию сервиса, тестовый период или эффективные кейсы использования Serpstat?
Оставьте заявку и мы свяжемся с вами ;)
Нашли ошибку? Выделите её и нажмите Ctrl + Enter, чтобы сообщить нам.
Кейсы, лайфхаки, исследования и полезные статьи
Не успеваешь следить за новостями? Не беда! Наш любимый редактор Анастасия подберет материалы, которые точно помогут в работе. Присоединяйся к уютному комьюнити :)
Нажимая кнопку, ты соглашаешься с нашей политикой конфиденциальности.
Комментарии