Как добавить значки социальных сетей в меню WordPress

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

Основным преимуществом добавления иконок в меню является возможность изменять порядок их отображения с помощью простого drag-and-drop интерфейса. Вы также сможете вывести их в любом месте, как например в сайдбаре или в другом меню.

Добавляем иконки соц.сетей в меню WordPress с помощью плагина

Первым делом вам необходимо установить и активировать плагин Menu Social Icons. После активации переходим в раздел Внешний вид » Меню для того, чтобы начать добавлять иконки соц.сетей.

Прежде, чем вы начнете добавлять ссылки, вам нужно будет создать новое меню, кликнув на ссылку создания нового меню. Ему можно дать соответствующее название вроде Social Menu.

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

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

Если же у вас нет области для меню, то всегда можно будет вывести соц.иконки в сайдбар WordPress.

Добавляем иконки соц.сетей в сайдбар

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

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

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

Использование иконок FontAwesome в меню WordPress

Лучшей особенностью плагина Menu Social Icons является то, что он использует красивую библиотеку FontAwesome для добавления иконок соц.сетей. В плагине содержится полная библиотека FontAwesome, но он загружает только выбранные иконки в ваше меню.

Если вы захотите использовать другие иконки из FontAwesome, то это можно будет сделать.

Для начала переходим в библиотеку FontAwesome и выбираем нужную нам иконку. Например, мы добавим иконку RSS наряду с социальными. После выбора значка, вам понадобиться добавить следующий код в файл functions.php вашей темы или в плагин для сайта WordPress:

add_filter( 'storm_social_icons_networks', 'storm_social_icons_networks');
function storm_social_icons_networks( $networks ) {

    $extra_icons = array (
        '/feed' => array(                  // Включаем эту иконку для любой ссылки, содержащей такой текст
            'name' => 'RSS',               // Метка элемента меню по-умолчанию
            'class' => 'rss',              // Произвольный класс
            'icon' => 'icon-rss',          // Класс FontAwesome
            'icon-sign' => 'icon-rss-sign' // Может оказаться недоступной. Проверить в FontAwesome.
        ),
    );

    $extra_icons = array_merge( $networks, $extra_icons );
    return $extra_icons;

}

Для добавления других иконок вам понадобится заменить /feed на ссылку социальной сети, которую вы пытаетесь добавить. Также измените rss на название нужной иконки.

Добавляем свои собственные иконки соц.сетей в меню WordPress

Плагин Menu social icons использует иконки FontAwesome в меню WordPress, но что, если понадобится использовать собственные картинки иконок. Это возможно. Ниже описан способ добавления любого произвольного изображения для значков в меню WordPress.

Первым делом вам необходимо установить и активировать плагин Menu Image. После активации понадобится перейти на страницу Внешний вид » Меню, где вы заметите кнопки изображений для меню под каждым элементов. Просто загрузите туда свою картинку.

Мы надеемся, что эта статья помогла вам научиться добавлять значки социальных сетей в меню WordPress.

По всем вопросам и отзывам просьба писать в комментарии ниже.

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