HelloBar — настройка и установка скрипта

Всем привет! Сегодняшний пост посвящен такой финтифлюшке как HelloBar. HelloBar — это красивая информационная панель (как она работает можно посмотреть на сайте разработчика), которая размещается в самом верху страницы, и в которой можно разместить рекламное сообщение и задать кнопке любой текст. Панель эта фиксируется вверху, видна постоянно и если посетитель пожелает, то ее можно свернуть.

HelloBar – регистрация и тарифы

Увидев впервые HelloBar в действии, он мне очень понравился. Просто, красиво и изящно. Как настроить и установить данный скрипт, читайте дальше.

Также как и в случае с плагином Scrolling Social Sharebar здесь я — первый. Про HelloBar в рунете еще не писал никто (по-крайней мере Google и Yandex ничего мне не выдали в ответ на запрос «HelloBar»). Ну да ладно. Действие скрипта вы уже оценили. Приступаем к настройке и установке.

Пройдите на официальный сайт разработчика. Далее промотайте страницу вниз до «Pricing & Plans» (Цены и Тарифы).

HelloBar выбор тарифного плана

Здесь кроется самый главный с точки зрения нас с вами, уважаемый читатель, минус: скрипт HelloBar платный. Можно купить от 100 до 7500 кликов по цене от 4,95 до 49,95 долларов в месяц + к этому прилагается дополнительный функционал: «RSS & Twitter Feeds» — фиды RSS и твиттер; «Save Your Themes» — возможность сохранять цветовые палитры для повторного использования; «Unbranded» — возможность убрать ссылку на сайт разработчика в виде буквы «Н» в левом углу панели; «SLL Support» — возможность размещать панель на защищенных страницах.

Бесплатный вариант предполагает 25 кликов, возможность тестировать несколько вариантов сообщений и цветовых схем, 4 стандартные цветовые схемы и статистику — для того, чтобы оценить скрипт этого будет достаточно. Попробуйте! Если вдруг понравится и если будут средства и если вы сочтете необходимым, то купите скрипт.

Итак, жмем «Choose plan» под «25 Free» (указано стрелкой на картинке выше) и вводим свой e-mail.

HelloBar вводим E-Mail

На E-Mail будет выслан пароль, а также ссылка для входа в админку и логин (он же ваш E-Mail):

письмо от HelloBar

Пройдите по ссылке https://www.hellobar.com/login и введите логин и пароль.

Создаем новую панель

Чтобы создать панель, необходимо кликнуть по ссылке «Create new».

Создать новый HelloBar

Настройка скрипта HelloBar

Перейдем к настройкам, нажав на «Settings».

Настройки HelloBar

1. Title (Название). Задайте название панели.

2. Positioning (Позиционирование):

  • Remains at the top of the page when scrolling? (Фиксировать ли панель наверху при прокрутке страницы?)
  • Pushes the page down when opening?

3. Show (Когда показывать?). Можно задать настройки таким образом, что панель будет появляться сразу же («Immediatly»), либо же через некоторое время (от 5 секунд до одной минуты).

4. Hide (Когда прятать?). Можно задать промежуток времени, через который панель будет скрываться автоматически (от 5 секунд до одной минуты). Возможен такой вариант, когда панель не сворачивается автоматически, а сворачивается посетителем, нажатием на стрелку на панели. В таком случае, в выпадающем списке выбирайте «Never».

5. Open link in (Открывать ссылку в). Если вы хотите, чтобы ссылка открывалась в новом окне, то выбирайте «A new window». Если в том же, то «Same window».

6. Show on Link Page (Показывать панель на ведомой странице). Постараюсь объяснить. Панель HelloBar будет отображаться на всех страницах вашего сайта, и в том числе на той, ссылка на которую располагается в панели. А опция «Show on Link Page» нужна как раз для того, чтобы панель не показывалась на той странице, на которую ведет ссылка. То есть человек уже находится на рекламируемой странице, и смысла показывать ссылку нет. Как-то так.

7. Closeable (Сворачиваемость). Данная опция задает возможность посетителя скрыть панель.

8. Wiggle Effect — Пардоньте, для чего это нужно, я так и не въехал.

9. Link display (Отображение ссылки). Ссылку можно отобразить кнопкой, тогда выбирается «Display as a button» (кнопка смотрится лучше). Или в виде гиперссылки, тогда выбирайте «Display as a hyperlink».

За изменением настроек можно следить с помощью предварительного просмотра «Preview», который доступен сразу же после настроек. Ниже идут следующие поля:

  • Message (Сообщение). Это небольшая рекламная строчка, рекомендованная длина которой должна находиться в пределах 85 символов.
  • Link Text (Текст ссылки). Анкор ссылки.
  • Link URL (Ссылка). Сама ссылка.

Пример.

HelloBar пример готовой панели

Вы наверняка заметили блок «Appearance». Этот блок настроек отвечает за внешнее оформление панели HelloBar. Во вкладке «Themes» можно задать шрифт («Font Style») и одну из 4-х стандартных цветовых схем («Default Themes»).

Вкладка «Custom» предоставляет пользователю более гибкие возможности по настройке внешнего вида панели. Так, пользователь может самостоятельно задать цвет фона панели с помощью «Bar Color», цвет текста сообщения с помощью «Text Color», цвет ссылки с помощью «Link Color», текстуру фона с помощью «Texture», наличие нижней границы панели с помощью «Border» и ее цвет через «Border Color»:

HelloBar настройка внешнего вида

После того как панель будет полностью готова, жмите «Save». Вам предложат скопировать код, который затем нужно будет вставить в тег <body> (для этого откройте файл шаблона header.php):

Скопировать код панели HelloBar

Теперь обновите файл на сервере и пройдите на свой сайт/блог. Скрипт HelloBar должен работать.

Управление и Статистика

Чтобы изменить настройки, необходимо перейти во вкладку «Manage», а для того, чтобы посмотреть статистику — во вкладку «Stats»:

HelloBar - управление и статистика

Во вкладке «Manage» отображаются все созданные панели, которые можно включать/выключать, получить код, удалять:

Управление HelloBar

Опция A/B Testing позволяет сравнить эффективность нескольких вариантов сообщений и цветовых схем. Например, что эффективнее использовать: ссылку в виде кнопки или в виде гиперссылки. И все в этом духе. Весьма и весьма полезная опция.

Если нажать по названию панели (в нашем случае это «Новый HelloBar»), то вы попадете опять же в настройки (о чем говорилось выше).

Во вкладке «Stats», как уже было сказано, можно посмотреть статистику, а именно посмотреть количество показов («Visits»), количество кликов («Clicks») и CTR («Clockthrough Rate»).
Статистика HelloBar
Причем статистику можно посмотреть за любой день — для этого жмем по черной стрелке рядом с «1 day» и выбираем «others», а затем точную дату. «7 days» — статистика за последние 7 дней. «30 days» — статистика за последние 30 дней. «Date range» — статистика за определенный период времени, например, с 1 по 15 июля.

Процент использованных кликов можно также посмотреть в верхнем правом углу:

На этом все. Вроде бы написал обо всем.

Вам будет интересно

Получайте обновления в реальном времени прямо на вашем устройстве, подпишитесь сейчас.

Так же обязательно прочитайте:

Оставьте ответ

Ваш электронный адрес не будет опубликован.