Плагин Speed Contact Bar

 

---

Всем привет. Сегодня поговорим о весьма полезном плагине Speed Contact Bar. Он прекрасно подойдёт как для простеньких, так и для функциональных шаблонов с недостающей одной функцией — вывод контактов вверху или внизу сайта. Также рекомендую прочесть статью «Плагин Disable All WordPress Updates».

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

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

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

Установка плагина

Сперва нужно установить и активировать плагин Speed Contact Bar:

Далее,в пункте «Настройки» кликните по пункту «Speed Contact Bar»:

После перехода на страницу настроек плагина внимательно ознакомитесь со всеми опциями. Откровенно говоря, для такого простого плагина реализовано весьма много настроек. Это большой плюс.

к оглавлению ↑

Настройка плагина

Далее, рассмотрим некоторые настройки плагина Speed Contact Bar.

Headline (Заголовок)

В этой опции вы можете указать заголовок контактной формы, например, свяжитесь с нами.

E-Mail Address (электронная почта)

В этом поле укажите электронный адрес для связи.

Phone Number (телефонный номер)

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

Maximal viewport width to hide the bar

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

Position of the bar

Здесь вы можете указать одно из двух расположений панели: вверху или внизу.

Enable fixed position

Эта опция отвечает за фиксацию блока контактов. Если фиксации нет, то блок будет исчезать при скроллинге вниз. Опция не работает на мобильных устройствах.

Height readjustment for fixed position

Эта опция работает в связке с фиксированной позицией, и отвечает за расстояние от панели контактов до содержимого сайта.

Vertical Padding

Отступ по вертикали внутри блока от содержания. Чем больше отступ, тем шире будет панель.

Background Color

Цвет фона панели контактов.

Background Color Opacity

Прозрачность фона панели контактов.

Text Alignment

Выравнивание содержимого блока.

Font Size

Размер шрифта.

Text Color

Цвет шрифта.

Link Color

Цвет ссылки

Icon Size

Размер иконки, например, иконка телефона.

Icon Brightness

Тон иконки: светлый или тёмный.

По окончании настроек не забывайте сохраниться.

В итоге у меня получилась вот такая панель, цвета корой соответствуют цветам темы Spacious (Просторный вариант):

Я провёл опрос через один сервис, с целью исследовать реакцию пользователей на блок с контактами. В опросе приняло участие 50 человек. Большинство из них заявило, что блок бросается в глаза, откуда формируется мнение, о владельце сайта, для которого важно поддерживать связь с каждым посетителем. И также люди говорят, что весьма удобно, когда, например, на продающих площадках выделена контактная информация. Это побуждает, в случае возникновения вопроса, связаться по предоставленным контактам, для получения ответа.

Вот так мои дорогие друзья, немного функционального маркетинга. Если понравилась статья о плагине Speed Contact Bar, то делитесь с друзьями полезной информацией и оставляйте свои комментарии. А на этом всё, до следующих статей.