Всем привет! Сегодняшний пост посвящен такой финтифлюшке как HelloBar. HelloBar — это красивая информационная панель (как она работает можно посмотреть на сайте разработчика), которая размещается в самом верху страницы, и в которой можно разместить рекламное сообщение и задать кнопке любой текст. Панель эта фиксируется вверху, видна постоянно и если посетитель пожелает, то ее можно свернуть.
HelloBar – регистрация и тарифы
Увидев впервые HelloBar в действии, он мне очень понравился. Просто, красиво и изящно. Как настроить и установить данный скрипт, читайте дальше.
Также как и в случае с плагином Scrolling Social Sharebar здесь я — первый. Про HelloBar в рунете еще не писал никто (по-крайней мере Google и Yandex ничего мне не выдали в ответ на запрос «HelloBar»). Ну да ладно. Действие скрипта вы уже оценили. Приступаем к настройке и установке.
Пройдите на официальный сайт разработчика. Далее промотайте страницу вниз до «Pricing & Plans» (Цены и Тарифы).
Здесь кроется самый главный с точки зрения нас с вами, уважаемый читатель, минус: скрипт 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.
На E-Mail будет выслан пароль, а также ссылка для входа в админку и логин (он же ваш E-Mail):
Пройдите по ссылке https://www.hellobar.com/login и введите логин и пароль.
Создаем новую панель
Чтобы создать панель, необходимо кликнуть по ссылке «Create new».
Настройка скрипта HelloBar
Перейдем к настройкам, нажав на «Settings».
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 (Ссылка). Сама ссылка.
Пример.
Вы наверняка заметили блок «Appearance». Этот блок настроек отвечает за внешнее оформление панели HelloBar. Во вкладке «Themes» можно задать шрифт («Font Style») и одну из 4-х стандартных цветовых схем («Default Themes»).
Вкладка «Custom» предоставляет пользователю более гибкие возможности по настройке внешнего вида панели. Так, пользователь может самостоятельно задать цвет фона панели с помощью «Bar Color», цвет текста сообщения с помощью «Text Color», цвет ссылки с помощью «Link Color», текстуру фона с помощью «Texture», наличие нижней границы панели с помощью «Border» и ее цвет через «Border Color»:
После того как панель будет полностью готова, жмите «Save». Вам предложат скопировать код, который затем нужно будет вставить в тег <body> (для этого откройте файл шаблона header.php):
Теперь обновите файл на сервере и пройдите на свой сайт/блог. Скрипт HelloBar должен работать.
Управление и Статистика
Чтобы изменить настройки, необходимо перейти во вкладку «Manage», а для того, чтобы посмотреть статистику — во вкладку «Stats»:
Во вкладке «Manage» отображаются все созданные панели, которые можно включать/выключать, получить код, удалять:
Опция A/B Testing позволяет сравнить эффективность нескольких вариантов сообщений и цветовых схем. Например, что эффективнее использовать: ссылку в виде кнопки или в виде гиперссылки. И все в этом духе. Весьма и весьма полезная опция.
Если нажать по названию панели (в нашем случае это «Новый HelloBar»), то вы попадете опять же в настройки (о чем говорилось выше).
Во вкладке «Stats», как уже было сказано, можно посмотреть статистику, а именно посмотреть количество показов («Visits»), количество кликов («Clicks») и CTR («Clockthrough Rate»).
Причем статистику можно посмотреть за любой день — для этого жмем по черной стрелке рядом с «1 day» и выбираем «others», а затем точную дату. «7 days» — статистика за последние 7 дней. «30 days» — статистика за последние 30 дней. «Date range» — статистика за определенный период времени, например, с 1 по 15 июля.
Процент использованных кликов можно также посмотреть в верхнем правом углу:
На этом все. Вроде бы написал обо всем.