X
    Categories: Оптимизация

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

Сайт дня (как попасть): Промышленная очистка воды

Регулярно думаю над тем, как сделать блог Shakin.ru более удобным для посетителей. Месяц назад поставил выпадающие теги - отличное решение, на мой взгляд, места по сравнению с обычным облаком тегов занимает в разы меньше. Опять отвлекаюсь, сегодня не об этом 🙂 .

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

1. Результаты поиска ранжируются по дате постов, самый свежий материал будет вверху. Это очень плохо, так как результаты поиска должны сортироваться по релевантности.

2. Искомые слова в дефолтном поиске WordPress не подсвечиваются на страницах результатов. Это неудобно, так как посетителю труднее искать нужную информацию.

3. На страницах поиска будет столько результатов, сколько указано в настройках блога. Например, если у меня в настройках поставлено отображать по 4 поста на каждой странице, в результатах поиска по блогу будет точно также.

4. В стандартном поиске WordPress не учитывается морфология запросов.

Конечно, наверняка есть решения в виде хаков и плагинов для того, чтобы исправить эти недостатки дефолтного поиска WordPress.

Но нужно ли все это, когда есть возможность установить поиск Google по своему сайту? Я пришел к выводу, что лучшее решение для того, чтобы сделать поиск по своему сайту удобным и чтобы пользователи могли быстро находить нужную информацию - это поставить поиск Google на свой сайт. Самое замечательное, что поиск Google можно поставить на сайт на любом движке.

Итак, приступим. Поиск Google для своего сайта можно установить двумя путями.

Первый - через аккаунт Google Adsense. Второй - через Систему пользовательского поиска Google. Я выбрал первый, так как он показался мне более удобным. И в том, и другом варианте можно сделать так, чтобы в результатах поиска по Вашему сайту показывались ваши контекстные объявления Google Adsense, с которых будет идти пусть и небольшой, но дополнительный доход.

Я уже чувствую, как ваше желание поставить поиск Google на свой сайт укрепилось, можем начинать 🙂 .

Заходим в свой аккаунт Google Adsense и жмем на вкладку Настройка Adsense:

Далее выбираем пункт Adsense для поиска:

На следующей странице советую выбрать опцию Одностраничный мастер - так будет удобнее работать:

Далее в первом пункте ставим Только выбранные мною сайты:

В следующем пункте Выбранные сайты в пустом поле вписываем свой домен:

🔥 Кстати! Я планирую выпустить платный курс по продвижению англоязычных сайтов. Можете подать заявку в ранний список через эту форму, чтобы первыми узнать о выходе курса и получить специальную скидку.

Приглашаю вас подписаться на мои каналы в Telegram:

@shakinru - продвижение в рунете.
@burzhunet - англоязычное SEO.

Указываем дополнительные ключевые слова, которые нужны для настройки результатов и объявлений системы поиска, разделяя их пробелами. Я указал такие:

Затем следует язык - русский. Следующий пункт - кодировка, у моего блога это Юникод (UTF-8).

Страна нужна для определения домена Google, который будет использоваться для результатов поиска. У меня это Российская Федерация.

Следующий пункт - Клиентский канал. Я оставляю настройки по умолчанию - в этом случае автоматически будет создан новый канал отчетов для объявлений:

Далее идет пункт SafeSearch («Безопасный поиск»). Я оставил галочку.

Теперь можно выбрать параметры окна поиска. Обожаю такие вещи - можно задать окну поиска по сайту желаемый вид 🙂 . Можно выбрать положение логотипа Google - в поисковом окне, справа от окна и под ним. Я выбрал первый вариант. У двух других можно выбрать белый, серый или черный цвет заднего фона. Поиграйте с радиокнопками и выберите желаемый внешний вид.

Длина поля текста - так как я поместил окно поиска по своему блогу в боковую колонку, то мне подходит длина 20 символов. Поэкспериментируйте и выберите оптимальную длину поля текста для своего сайта.

Сейчас начинается самое интересное - задаем стиль результатов поиска. Открытие страницы результатов поиска. Идем по пунктам.

1. Открывать результаты поиска в том же окне:

Скажу сразу, я в итоге выбрал именно этот вариант.

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

3. Открывать результаты поиска на моем сайте. Третий вариант интересен, так как можно сделать так, чтобы пользователь, введя слово, получил результаты поиска на вашем же сайте. Для этого в новом окне браузера заходим в админку своего сайта и создаем страницу, например, http://site.ru/search, и вписываем ее адрес в указанном поле:

Затем идет поле ширины области результатов поиска. Именно из-за этого момента я отказался от третьего варианта. В нем все хорошо, но дело в том, что на самом деле ширину меньше 795 пикселей указать нельзя, а такая ширина портит дизайн и не подходит для моего блога - мне нужна ширина 540 пикселей.

Если вы выбрали первый вариант, то можно поместить логотип своего сайта на страницу результатов поиска, чтобы пользователи при желании могли вернуться на главную страницу вашего сайта. Требования к логотипу - он должен быть не более 50 пикселей в высоту:

В окне ниже нужно указать полный путь к логотипу на вашем сайте, а также ссылку для него:

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

Можете взглянуть на страницу поиска по блогу Shakin.ru по запросу "увеличение посещаемости".

Узнать цвета шрифтов и элементов вашего сайта можно, изучив файл стилей (у WordPress это файл style.css), либо установив плагины для Firefox (если у вас этот браузер) ColorZilla или Firebug.

Далее отмечаете галочку, что вы согласны с условиями использования (можете их почитать), и называете свою систему поиска, я назвал "Поиск на Shakin.ru".

В следующем окне копируете предлагаемый код. Если вы выбрали первый или второй варианты, то просто заменяете код окна поиска на вашем сайте предлагаемым кодом. Например, на моем блоге дефолтный код окна поиска был такой (в зависимости от темы вашего блога код окна поиска может быть в файле sidebar.php или в searchform.php):

<form id="searchform" method="get" action="<?php bloginfo('home'); ?>">
<div>
<input type="text" name="s" id="s" size="20" /><br />
<input type="submit">
</div>
</form> 

Такой код нужно заменить предлагаемым кодом в Google Adsense. Осталось немного доработать внешний вид окна поиска, чтобы оно хорошо сочеталось с дизайном вашего сайта.

Если вы выбрали третий вариант, то вам будет предложено два кода. Один - для окна поиска, доугой - для той страницы, которую вы указывали ранее (помните, когда я писал про создание страницы http://site.ru/search? 🙂 ).

Приведу итоговый вариант кода окна для поиска на своем блоге:

<form action="http://www.google.ru/cse" id="cse-search-box" style="background-color:#323232;">
<div align="center" style="background-color:#323232;">
<input type="hidden" name="cx">
<input type="hidden" name="ie">
<input type="text" name="q" size="20" />
<input type="submit" name="sa">
</div>
</form>

Мне нужен был цвет заднего фона #323232, выравнивание окна поиска и кнопки по центру, а также надпись на кнопке «Поиск по Shakin.ru». Вы можете сделать изменения по своему вкусу. Естественно, что код нужно брать из аккаунта Google Adsense, и уже потом дорабатывать оформление.

Вы также можете попробовать другой путь и встроить пользовательский поиск Google по этой статье: Встраиваем поиск Google в свой блог на WordPress.

Желаю вам успехов!

Глобатор

Постовой: Комнатные растения, продажа цветов и ландшафтный дизайн.

Огромное количество информации на спортивном сайте sportbox.ru.

Хотите испытать удачу? Попробуйте интернет игровые автоматы - Остров Сокровищ.

Десерт - видео о том, как карапуз ловко танцует брейк-дэнс:

Глобатор :
Disqus Comments Loading...