Как добавить социальные кнопки на WordPress-блог?

В современном интернете трудно представить ресурс, на котором бы не находились кнопки для расшаривания контента в социальных сетях. Чаще всего такие кнопки можно встретить на блогах, где они размещаются до или после каждого поста. Многие темы WordPress уже включают функционал для отображения данных кнопок. Кроме того, есть и универсальные решения, которые позволяют интегрировать кнопки, не зависимо от используемого шаблона. Рассмотрим несколько таких вариантов.

Темы, подобные Root, уже имеют встроенные функции для публикации кнопок социальных сетей с настраиваемыми параметрами.

1. Плагины для социальных кнопок: Существует множество плагинов, таких как AddToAny или Ultimate Social Media Icons, которые позволяют легко добавлять кнопки для расшаривания и настраивать их внешний вид и расположение.

2. Встраивание с помощью кода: Если вы хотите больше контроля над тем, как будут выглядеть кнопки, вы можете вручную добавить HTML и JavaScript код на свой сайт. Большинство социальных сетей предоставляют инструкции по созданию кнопок.

3. Проверка работоспособности: После установки кнопок обязательно протестируйте их работу. Убедитесь, что они правильно расшаривают ссылки и открываются в нужных социальных сетях.

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

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

Как вывести соц. кнопки на сайте WordPress?

Плагин Share Buttons от AddThis

Данный плагин бесплатен.

Чтобы добавить панель кнопок, необходимо нажать на кнопку Add New и затем выбрать место, где она будет отображаться на сайте.

Выбор места расположения соц. кнопок в плагине Share Buttons от AddThis

Здесь нужно выбрать раздел Inline и нажать кнопку Select. В результате откроется страница с настройками для вашего блока социальных кнопок.

Настройка социального блока в плагине Share Buttons от AddThis

В первой строке задается название для вашего блока. Затем в разделе General вы можете определить количество социальных кнопок или выбрать, какие именно будут отображаться. Выберите пункт Select Your Own и добавьте нужные кнопки, нажав на “плюс”.

Настройка количества выводимых кнопок в плагине Share Buttons от AddThis

Следующим шагом необходимо указать, где именно будут расположены социальные кнопки. Мы разместим их как до, так и после контента в записях. Для этого в разделе Position отмечаем Above Blog Post и Below Blog Post.

Выбор позиции блока социальных кнопок в плагине Share Buttons от AddThis

В последнем разделе, Design, можно настраивать внешний вид кнопок, включая стиль и размер.

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

Теперь, когда вы перейдете к любой записи, сможете увидеть, как кнопки работают.

Страница записи на сайте

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

  • Shareaholic — мощный плагин, который предлагает не только кнопки для шаринга, но и аналитику.
  • AddToAny — простой в использовании сервис с множеством настроек и поддержкой различных платформ.
  • Social Warfare — известный плагин с простыми настраиваемыми кнопками и встроенной аналитикой.

Настройка дизайна и функциональности кнопок

Выбор подходящего стиля для элементов обмена информацией должен основываться на общем дизайне сайта. Используются готовые шаблоны или можно модифицировать CSS-код на вашем ресурсе. Пример стиля:


.button {
background-color: #0073AA;
color: white;
border-radius: 5px;
padding: 10px 15px;
text-decoration: none;
}
.button:hover {
background-color: #005177;
}

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

Функциональные возможности также играют ключевую роль. Рекомендуется добавить возможность отслеживания переходов на ваши ресурсы через Google Analytics. Это осуществляется с помощью добавления определённых параметров к URL:


Поделиться

Внимание! Обязательно протестируйте работу всех элементов на разных устройствах. Согласованность в отображении окажет положительное влияние на пользовательский опыт.

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

Оставьте комментарий