Приспособленный AdSense для поиска

 

Здравствуйте, уважаемые читатели моего блога. В этой заметке я хотел бы остановиться на «AdSense для поиска». При этом, я не собираюсь учить вас как зарабатывать деньги. Тема данной заметки: как приспособить этот блок к дизайну Вашего сайта. Нюанс в том, что дефолтовая форма поиска меня лично не особо впечатляет, по крайней мере, своим нагромождением.

 

В начале пару слов о том, как получить этот «дефолтовый HTML-код формы». При этом, я не рассматриваю вариант, когда результат поиска открывается на вашем сайте. Просто не вижу в этом необходимости 8-)

  1. И так, вы зарегистрировали свой аккаунт в AdSense.
  2. Идем на закладку «Настройки AdSense».
  3. Кликаем ссылку в меню «Получить объявления».
  4. Выбираем «AdSense для поиска».
  5. Для удобства, кликаем по ссылке «Одностраничный мастер».
  6. Тип поиска: «Google WebSearch + SiteSearch». Помимо это, вводим URL вашего сайта, к примеру: kurilka.co.ua.
  7. «Стиль окна поиска» нас мало интересует, так что оставляем как есть.
  8. Дополнительные параметры:
    • Язык сайта, выбираем свой, к примеру: Русский
    • Кодировка вашего сайта, всё чаще это: Юникод (UTF-8)
    • Страна или территория для домена Google, как таковой только для поиска по Интернету, к примеру: Российская Федерация
  9. Далее «Стиль результата поиска», тут стоит слегка повозиться, т.к. внешнее оформление должно быть хоть немного соответствовать нашим пожеланиям. Здесь я дам только парочку, очевидных советов:
    • Граница – контур вокруг блога, его я перекрашивая под «Фон».
    • Заголовок – цвет ссылки на страницы в результате поиска, его я перекрашиваю под цвет ссылок на своем сайте.
    • Фон – он и в Африке фон, но делаю просто белым.
    • Текст – оставляю черным, думаю пояснения не нужны.
    • URL и URL, который был посещен – цвет URL’я страницы в результате поиска, делаю одинакового, зеленого цвета и то и другое.
    • «Облегченный» URL – цвет скажем так мета данных типа ссылки «Подобные страницы».
    • Фон логотипа – название говорит само за себя, но делаю под цвет «фона», т.к. не люблю выделять.
    • Далее идут «URL изображения логотипа» здесь надо заранее приготовить свой рисунок, обычно он совпадает с логотипом Вашего сайта и лежит на Вашем сервере, и «URL назначения логотипа» — т.е. URL вашего сайта.
  10. Затем идут «Дополнительные параметры»:
    • Открытие страницы результатов поиска – я выбираю «Открывать результаты поиска на Google в новом окне».
    • Поиск с учетом тематики сайта – вроде как по параметрам канала вычисляется. Соответствующий релевантный контекст для поиска по Интернету, можно добавить свой, а там разбираться.
    • Клиентский канал – выбираем или создаем свой, в основном это для удобства отслеживания статистики, но сделать надо обязательно.

Вот теперь можно копировать свой HTML-код формы поиска и начинаем выбирать то, что нам нужно, а нужно нам следующее:

    1. Первое это конечно <form method="get" action="http://www.google.ru/custom" target="google_window">
    2. <input type="hidden" name="domains" value="sitename.ru"></input>

  • Пропуская lablel’ы оставляем лишь:<input type=»text» name=»q» size=»31″ maxlength=»255″ value=»» id=»sbi»></input>
    <input type=»submit» name=»sa» value=»Поиск» id=»sbb»></input>
  • Далее идут radio для выбора «Web» и «kurilka.co.ua», я лично оставляю только поиск по своему сайту, для этого делаю вот такую переработку:<input type=»hidden» name=»sitesearch» value=»kurilka.co.ua«>т.е. прячу всю эту фигню и указываю поиск по своему сайту.
  • Затем оставляю hidden параметры, ну и </from>.

Получаем что-то вроде lite версии нашей формы, оформить которую можно с помощью CSS здесь нас интересуют: #sbi — форма ввода текста запроса для поиска и #sbb — кнопка «Поиск». Как вариант приведу небольшой примерчик:

<style>
#sbi {
font: 12px Verdana, Geneva, Arial, Helvetica, sans-serif;
color: Black;
border: 1px solid #D1D9DC;
width: 100px;
}
#sbb {
font: bold 11px Verdana, Geneva, Arial, Helvetica, sans-serif;
text-decoration: underline;
color: #0066CC;
border: 1px solid #0066CC;
background: #ffffff;
}
</style>

Получилась вот такая формочка:

В общем, как Вы видите, все достаточно просто. С учетом виджетов в новом WordPress вставить подобную форму вообще не представляет ничего сложного, достаточно использовать «Text» виджет и все – у вас есть свой релевантный поиск с AdSense, простой и чистенький. Спасибо за внимание.