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

Регистрация доменов
Домен RU - 99 руб
Домен РФ - 99 руб
www.

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

Так же поиск даёт ещё одну замечательную возможность - дополнительный заработок. Дело в том, что форма поиска по сайту от Google и Яндекс имеет возможность подключения рекламы в результаты поиска. То есть, мы делаем форму поиска Google и подключаем к ней наш Adsense аккаунт. В результате мы получаем примерно следующее, когда человек начинает что-то искать на нашем сайте:

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

В Яндексе можно сделать нечто подобное, но в Google всё проще. И на сколько я помню, в РСЯ не добавить просто так рекламу в поиск, нужно определённое количество посетителей, который постоянно пользуются поиском. Но так или иначе я перешёл на Google, так как в Google Adsense заработки на контекстной рекламе у меня значительно больше.

Но суть этой статьи не в том, как добавить форму поиска на сайт, а как сделать ей фиксированной. Для чего это нужно?

Тут есть целых два важных момента:

1. Заработок на контекстной рекламе.

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

поиск для сайта adsense

Как видите, каждый третий пользовавшийся поиском кликнул по рекламе, в то время при обычных посещениях это сделал один из 50 посетителей.

2. Поведенческие факторы.

Пользуясь поиском посетитель задерживается на сайте, находит другие ваши статьи, а это улучшает поведенческие факторы и вашему сайту от этого огромный плюс.

Но как видно из предыдущей картинки, поиском по сайту пользуется не так много людей, по крайней мере у меня. Может в этом виновата специфика сайта, может мои статьи чаще всего дают ответ на нужный вопрос. Человек получил ответ и уходит...

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

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

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

Для начала нам нужно получить форму поиска по сайту. Для этого идём СЮДА и создаём свою форму поиска, и настраиваем её на свой цвет и вкус.

форма поиска для сайта

Не буду подробно всё объяснять, как и что делать, так как подобных мануалов в сети уже полно. Да и все тут слишком индивидуально, благо всё по русски, разобраться не так сложно. Главное не забудьте включить пункт ПОЛУЧЕНИЕ ДОХОДА:)

заработок на поиске

В результате на дадут примерно такой код:

<script>// <![CDATA[
// < ![CDATA[
// < ![CDATA[ (function() { var cx = '0112:xc3kpmbof5i'; var gcse = document.createElement('script'); gcse.type = 'text/javascript'; gcse.async = true; gcse.src = (document.location.protocol == 'https:' ? 'https:' : 'http:') + '//www.google.com/cse/cse.js?cx=' + cx; var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(gcse, s); })();
// ]]></script>

Я буду далее рассказывать, как всё сделать в WordPress. Если у вас другая система, то делайте по аналогии, только так, как будет работать у вас.

Для начала открываем файл header.php в папке с шаблоном сайта и вписываем туда такой скрипт:

<script type="text/javascript">// <![CDATA[
// < ![CDATA[
// < ![CDATA[ $(function() { $(window).scroll(function(){ var distanceTop = 1500; // Тут укажи нужное расстояние после прокрутки которого будет показано окно. if ($(window).scrollTop() > distanceTop)
 $('#fixer').show(500);
 else
 if ($(window).scrollTop() < distanceTop) $('#fixer').hide(500); }); $('.close').bind('click',function(){ $(this).parent().remove(); }); });
// ]]></script>

Этот скрипт будет делать простую вещь: форма поиска будет появляться только после прокрутки страницы вниз. С какого момента форма поиска должна появляться можно задать в этом месте

var distanceTop = 1500;

Теперь сюда же вписываем код самой формы поиска и окружаем её вот таким кодом:

<div class="fixfooter">
<div id="fixer" style="display: none;">
ТУТ ВПИСЫВАЕТСЯ КОД ФОРМЫ ПОИСКА ПО САЙТУ
</div
</div>

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

форма поиска фиксированная

Единственным минусом является то, что злополучный adblock режет эту форму поиска. Но это уже другая история, и решения у неё пока нет. Если вам что то непонятно, то напишите в комментариях, возможно, я чем то смогу вам помочь:) P.S. Три часа промучился, так как оказалось, что в этой теме не подключена библиотека Решение оказалось до боли простым: нужно просто в шаблон сайта, в header.php, добавить между тегами <head> такой код:

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>

Теперь все работает как надо, и даже заработал фиксированный виджет в сайдбаре:)

После этого я ещё долго мучился настраивая форму поиска, вернее ей стили. Шаблон этого сайта больно мудрёная (адаптивная) не смотря на внешнюю простоту. Даже форма поиска, в частности кнопка, отображается как то коряво. Надеюсь, что со временем разберусь с этим.


Понравилась ИГРА? Возьми КОД, поставь себе на сайт и улучши поведенческие факторы!


5 комментариев
  1. На этом сайте я переместил весь код в footer.php, тоже работает, но будет загружаться не сразу, а в последнюю очередь, что в принципе правильнее:)

  2. Убрал пока это фиксированное поле поиска, по двум причинам:

    1. Adblock почему то блокирует окно поиска полностью, в обычном случае - нет.

    2. Почему то на этом сайте окно поиска полупрозрачное и на него заезжает контент - не могу понять почему, на другом сайте такого нет.

    А вообще был хороший эксперимент, потом может пригодится:)

  3. А вообще, поиск гугла на этом сайте работает ужасно, нужно будет поставить поиск от Яндекса.

Написать комментарий

Опубликовано © Блокнот вебмастера

СОВЕТ ВЕБМАСТЕРУ: Умение зарабатывать в интернете - это только пол дела, вторая половина - это умение ВЫГОДНО обналичивать электронные деньги. Вот список офшорных банковских карт, на которые можно выводить средства и потом снимать с них хрустящие купюры:

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

2. AdvCash - Офшорный банк находится в Белизе, можно открыть счет в долларах, евро, фунтах и рублях.

3. OkPay - Офшорная компания зарегистрирована на Британских Виргинских островах, можно открыть счет в долларах, евро и рублях.

4. Payeer - Штаб квартира этой платежной системы находится в Грузии, тут так же можно открыть счет в долларах, евро и рублях.

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