TechBlogSD - Все для WordPress и WEB разработки
WEB и WordPress инструкции, новости, обзоры тем и плагинов

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

90

WordPress имеет границы для разработчиков плагинов и тем. Это помогает не путать функции темы с функциями плагина. При изменении темы это очень помогает, так как влияет только на внешний вид, а не на функции. Тем не менее, многие популярные темы используют значки социальных сетей и обмена как часть шаблонов тем. Также имеет смысл не устанавливать дополнительный социальный плагин для повышения скорости и конфиденциальности. Наконец, WordPress включил виджет социальных иконок как часть редактора Gutenberg, начиная с версии 5.4. В этой статье давайте рассмотрим, как вставлять значки социальных сетей на сайт WordPress.

По теме: Как вставлять и настраивать значки социальных сетей в Weebly?

Социальный обмен и значки подписки

Иконки социальных сетей имеют две функции: одна позволяет пользователям делиться страницей, а другая позволяет пользователям следить за вашими профилями в социальных сетях. Иконки соцсетей просты и содержат статический URL-адрес профиля. Тем не менее, для значков общего доступа требуется какой-то скрипт для включения URL-адреса текущей страницы, когда пользователь нажимает на нее для совместного использования. Ему также необходимо выбрать изображение и описание, чтобы создать виджет для совместного использования (например, открытый график в карточках Facebook или Twitter ).

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

Вставьте социальные иконки в WordPress

WordPress представил виджет социальных иконок в версии 5.4. Однако название «Социальные иконки» может вас сбить с толку. Это простой блок социальных подписчиков, которые вы можете вставить в любое место в своем сообщении или на странице и добавить URL-адреса своего социального профиля.

  • Во-первых, обязательно обновите версию WordPress до 5.4 или новее и используйте редактор или плагин Gutenberg.
  • Когда вы находитесь в редакторе Гутенберга, щелкните значок «Добавить блок» +.
  • Введите «социальные сети» и найдите блок «Социальные иконки» в разделе «Виджеты».
  • Нажмите на блок «Социальные иконки», чтобы вставить его в свой контент.

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

Вставьте социальные иконки в WordPress

Настройка виджетов социальных иконок в Gutenberg

По умолчанию в блоке «Социальные значки» сначала отображается несколько значков со значком WordPress.

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

Блок социальных иконок в Гутенберге

Вы можете настроить значки так же, как и любые другие блоки Гутенберга.

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

Настройка блока социальных иконок в WordPress

  • Щелкните значок, чтобы добавить ссылку на свой профиль в социальной сети для этого значка.
  • Вы можете изменить метку на боковой панели настроек «Блокировать». Ярлык полезен людям с ослабленным зрением для использования в программе чтения с экрана.
  • Вы можете добавить собственный класс CSS в разделе «Дополнительно».
  • Переместите стрелку в блоке, чтобы переместить выбранный значок влево или вправо. Таким образом, вы можете настроить положение значков по своему усмотрению.

Когда вы щелкаете за пределами блока, будут видны только значки с URL-адресом. Вы можете добавить дополнительные значки, нажав кнопку + в блоках значков социальных сетей. Он работает как блок внутри блока (как блок столбцов). Он также позволяет искать значок социальной сети среди доступных значков.

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

Поиск в социальных блоках

Кроме того, вы также можете вставлять собственные ссылки с помощью блока «Ссылка». Поскольку каждый значок представляет собой блок, вы можете удалить из виджета неиспользуемые значки социальных сетей. Мы рекомендуем вам удалить неиспользуемые значки, чтобы сохранить внутренний код в чистоте.

Изменение дисплея

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

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

Изменить стиль социальных иконок

Текущий виджет социальных иконок имеет три стиля:

  • По умолчанию – значок внутри закрашенного кружка
  • Только логотипы – показывает только логотип бренда без заполнения.
  • Форма таблетки – измените стиль на овальную таблетку со значками и заливкой.

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

Повторное использование социальных иконок

Самое приятное то, что вы можете щелкнуть настройки с тремя точками и включить значки социальных сетей, чтобы включить их в «Многоразовые блоки».

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

Добавить в блоки многократного использования

Вы можете вставить блок многоразовых социальных иконок в любое место на вашем сайте, без необходимости каждый раз воссоздавать.

Ошибка при просмотре HTML-кода

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

  • Щелкните значок настроек с тремя точками в блоке социальных значков и выберите «Редактировать как HTML».
  • Снова нажмите кнопку с тремя точками и выберите «Редактировать визуально», чтобы визуально вернуть значки обратно.

К сожалению, в блоке есть некоторая ошибка, и он покажет вам ошибку недопустимого содержимого при переключении HTML и визуального режима.

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

Ошибка блокировки социальных иконок

Мы также не видим возможности исправить ошибку и вернуть блок обратно.

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

Ошибка при переключении HTML и визуального кода

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

Вставка значков социального обмена

WordPress не имеет параметров по умолчанию для вставки значков социальных сетей на ваш сайт. Если ваша тема не имеет встроенных значков общего доступа, единственный способ – это поискать сторонние плагины, и у вас есть много бесплатных, а также премиум-версий. Одна из наших фаворитов – удобные кнопки обмена в социальных сетях премиум-класса, которые можно купить за 22 доллара. Если вы хотите установить бесплатный плагин, просмотрите этот список бесплатных плагинов для социальных сетей, чтобы найти подходящий для вас.

Как уже упоминалось, не имеет смысла иметь блок обмена в социальных сетях в Gutenberg, поскольку вставлять значки в каждый пост неудобно.

Источник записи: www.webnots.com

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