Сайт

Социальные иконки для сайта: Иконки социальные сети — 33,394 бесплатных иконок

15.08.1981

Содержание

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

Наконец, WordPress включил виджет социальных иконок как часть редактора Gutenberg, начиная с версии 5.4. В этой статье давайте рассмотрим, как вставить значки социальных сетей на сайт WordPress.

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

Добавить в повторно используемые блоки

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

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

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

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

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

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

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

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

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

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

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

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

Нужны ли кнопки «Поделиться» социальных сетей на сайте?

Заканчивается 2018 год, а маркетологи до сих пор заставляют программистов пихать «поделиськи» на сайт. Разве до сих пор не понятно, что они бессмысленные и только отталкивают посетителей? Не будем многословными и проведем небольшое расследование в данном направлении и выявим необходимость убирать социальные кнопки.

Зачем нужны социальные кнопки на сайте?

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

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

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

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

Но на практике все оказалось не так лучезарно, как в теории.

Вред от социальных кнопок.

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

Шеф-редактор блога GetGoodRank, веб-аналитик, блоггер, Юлия Федотова

Интернет-магазин компании Taloon.com из Финляндии, который продает сантехнику, электричество, садоводство и т.д. провел А\В – тестирование.

Цель компании была увеличить количество кликов (конверсий) на главной странице своего продукта (CTA) на страницах своих продуктов — Добавить в корзину. Вот как выглядела оригинальная версия:

Во второй версии убрали выделенные красным социальные иконки с сайта.

Претендент зафиксировал увеличение кликов CTA («Call-to-action», «Призыв к действию») на 11,9% по сравнению с оригиналом.

Но как такое произошло? Раньше добавление соц.сетей только повышало конверсию. Есть тесты компании AMD, по внедрению социальных иконок, при котором появился рост социальной активность пользователей на 23%.

Что работает против кнопок социального обмена?

1) Отрицательное социальное доказательство.

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

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

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

«Социальное доказательство не всегда является лучшим доказательством — вы могли бы подумать, что социальное доказательство помогает повысить коэффициент конверсии, но это не всегда так, — говорит основатель QuickSprout Нил Пател в этом популярном сообщении о конверсиях.

Кнопки социальной акции с нулевыми долями действуют как негативный социальный сигнал, и теперь, когда вы это понимаете, это имеет смысл.

2) Отвлечение от основной цели

Обычно считается лучшей практикой иметь одну четко определенную цель для каждой страницы и подталкивать людей к этой цели с помощью CTA.

В то время как Taloon.com использовал видный CTA на своих страницах продукта — добавьте в корзину — кнопки социального обмена действовали как отвлечение.

«Возможно, эти кнопки для обмена были просто лишними помехами и отвлечением на очень хорошем месте», — сказал Яни Ууси-Панти.

Мнения экспертов по социальным кнопкам.

Главный редактор ресурса Information Architects Оливер Райхенстайн (Oliver Reichenstein) написал по поводу шэринговых кнопочек разгромную статью. В ней, в частности, есть такое утверждение:

Если читателям настолько лень скопировать и вставить URL ссылки на ваш материал и добавить к этому пару слов, то дело здесь вовсе не в кнопках.

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

Когда Smashing Magazine убрал социальные кнопки с сайта, трафик из социальной сети Facebook возрос. Эксперты объяснили это тем, что пользователи вместо лайков и репостов копировали ссылки и делились ими в личных аккаунтах социальных сетей.

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

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

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

Советы при использовании социальных кнопок «Поделиться»

  • Чаще всего люди делятся в социальных сетях на развлекательные статьи, видео и смешные картинки. Если ваш сайт имеет развлекательную тематику, то мы советуем добавить социальные сети в видимом месте (на изображении, под статьей, на видео).
  • Социальные кнопки работают только там, где они уместны. Под статей, картинками, видео. Понятное дело, что на странице контакты мало кто будет нажимать на социальные иконки. Вы не должны забывать, что отрицательное социальное доказательство работает против вашего сайта.
  • Количество социальных сетей тоже важно.  Нет смысла располагать все социальные сети для «шаринга». Это сбивает с толку. Чем больше у человека выбора, тем больше он сомневается. Выше мы приводили пример популярных социальных сетей в России. Достаточно использовать первые 4-5. Кроме того надо знать свою целевую аудиторию, тогда будет проще определиться с выбором социальных иконок.
  • Так же важно знать где располагать на странице социальные иконки. Нет смысла вставлять их в начало статьи, ведь посетитель еще не знает интересная эта статья или нет. А прочитав до конца он забудет, что иконки в начале. Самое удачное расположение социальных иконок «Поделиться» в конце статьи.

А как вы считаете, нужны ли кнопки социальных сетей на сайте?

  • Нет, не нужны
  • Да, нужны

Poll Options are limited because JavaScript is disabled in your browser.

Как сделать иконки для социальных сетей в фотошопе | Pixelbox.ru — Дополнения и уроки по Фотошопу

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

То, что вы будете создавать:

Создавать плоские иконки мы начнем с фона, потом добавим иконкам эффекты, чтобы придать им оригинальность, далее нарисуем длинные тени. Для повторения урока вам понадобится Photoshop CS3 или более поздняя версия.

Ресурсы:

  • Шрифт 1 – http://fontawesome.io/cheatsheet/
  • Шрифт 2 – http://fontawesome. io/

 

Шаг 1

Создайте новый файл (Ctrl + N) размером 500 × 400 пикселей.

Создайте новую группу (CTRL+G) и назовите её «Фон».

Шаг 2

Заполните фон цветом # e7e9ea с помощью инструмента Заливка (Bucket Tool).

Шаг 3

Чтобы добавить больше эффектов на задний план, мы добавим градиент. Нажмите на иконку Корректирующий слой (Adjustment Layer) и выберите Градиент (Gradient), используйте следующие настройки:

Режим наложения слоя Мягкий свет (Soft Light) | Непрозрачность: 25%

Шаг 4

Создайте новую группу и назовите её «symbols».

Шаг 5

Прежде чем начать работу, нам нужно настроить меню Линейки и Сетки (Rulers and Grids). Перейдите в меню Вид-Линейки (ViewRulers) и Вид-Показать-Сетки (ViewShowGrids). Вот мои настройки дляЛинеек и Сеток (их можно открыть, перейдя в Редактирование-Настройки (Edit-Preference):

Чтобы создать Направляющую линию, нужно просто щелкнуть и перетащить её из линейки. Для создания вертикальной направляющей перетаскивайте из вертикальной линейки и наоборот. Вот как я разделил холст (каждый значок равен 50 × 50 пикселей и расстояние между каждым значком 25 пикселей):

Шаг 6

В этом уроке мы работаем с помощью шрифта Awesome, вы можете добавить настраиваемые иконки для вашего сайта. Как правило, это делается путем размещения CSS шрифта на ваш сайт, но так как мы работаем с Photoshop, нам нужно скопировать каждый значок, который вы хотите использовать из шпаргалки. Зайдите на страницу, выберите значок, который вы хотели бы нарисовать. Я использовал иконки для следующих (социальные сети) сайтов: Twitter; facebook; Tumblr; Google+;Instagram; YouTube; Twitch; Dropbox; Deviantart; Pinterest; Skype; Feed.

Шаг 7

После того как вы нашли значок, который хотели бы использовать, скопируйте его (Выделите ее затем щелкните правой кнопкой мыши-Копировать)

Затем вернитесь в Photoshop и выберите инструмент Текст (Text Tool) на панели инструментов. Измените настройки шрифта, как показано на рисунке:

Теперь вставьте значок, который вы только что скопировали. (Щелкните правой кнопкой мыши-Вставить)

Шаг 8

Повторите предыдущий шаг, пока не вставите все значки, которые вы хотели бы использовать.

Шаг 9

Создайте новую группу и переименуйте её в «icon bg», поместите группу ниже группы «symbols».

Шаг 10

Создайте новый слой и поместите его в группу, созданную в предыдущем шаге. Я переименовал слой в «icon bg».

Шаг 11

Используя инструмент Прямоугольник с округленными углами (Rectangular Circle Shape Tool) (расположенный на панели инструментов ниже инструмента Текст (Text Tool)) я создал фон иконок,

Вот все цвета, которые я использовал:
Twitter: # 6bd1f4;
Facebook: # 5a93cb;
Tumblr: # 3c6a9c;
Google +:#e44940;
Instagram:#9bd29d;
Youtube:#f4504c;
Twitch:#a96db6;
Dropbox:#81d5ed;
Deviantart:#6e8e61;
Pinterest:#f25f5f;
Skype:#67d5f4;
Feed:#e9951d;

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

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

Шаг 12

Если вы довольны результатом на данном этапе, вы можете идти дальше, но если хотите придать живости иконкам, давайте продолжим улучшения. Начнем со стиля слоя Тень (Drop Shadow). Откройте группу «symbols», выберите одну из иконок и щелкните значок Fx–Тень (Fx-Drop Shadow). Используйте следующие параметры:

Шаг 13

Повторите предыдущий шаг с остальными значками. Для того, чтобы сделать вашу работу намного проще, щелкните правой кнопкой мыши на слое-Копировать стиль стоя (-Copy Layer Style). Затем выберите остальные слои с иконками, щелкните правой кнопкой мыши-Вставить стиль слоя (-Paste Layer Style).

Шаг 14

Теперь добавим внутреннюю тень на задний план каждого значка. Открываем группу «icons bg», выбираем слой с иконкой, нажимаем на значок Fx-Внутренняя тень (Fx-Inner Shadow). Используйте следующие параметры:

 

Шаг 15

Создайте новый слой и назовите его «Gloss Effect». Измените цвет переднего плана на #ffffff; и при помощи инструмента Прямоугольная область (Rectangular Marquee Tool) создайте несколько прямоугольников, наполовину меньше размера иконок (приблизительно 50×25 пикселей). Сделайте это для всех иконок.

Затем измените режим наложения на Мягкий свет (Soft Ligh), снизьте непрозрачность (Opacity) слоя до 20%, а заливку (Fill) до 80%.

Шаг 16

Отключите видимость слоя «Gloss Effect». Создайте новый слой и назовите его «Long Shadow». Этот шаг является немного сложнее по сравнению с остальными эффектами. Поместите новый слой ниже слоя «Gloss Effect».

Шаг 17

Возьмите инструмент Полигональное лассо (Polygonal Lasso Tool) и начните создавать прямоугольную тень, касаясь ребра иконки только с правой нижней стороны, затем сделайте диагональную линию, пока она не достигнет нижнего правого края фона значка, сделайте прямую линию, пока она не достигнет центра фона, затем соедините линии. На изображении вы можете рассмотреть более наглядно, как рисовать длинную тень.

Шаг 18

Последний шаг! Уменьшите непрозрачность (Opacity) слоя с тенью до 10%, и заливку (Fill) до 0%.

Теперь Нажмите на иконку Fx и выберите Наложение цвета (Color Overlay). Используйте следующие параметры:

Теперь выберите Наложение градиента (Gradient Overlay) и используйте эти настройки:

Плагины для социальных сетей WordPress и как добавить на сайт

Почему плагины для социальных сетей WordPress важны?

Список лучших плагинов для социальных сетей WordPress (2019)

Сравнение лучших плагинов для социальных сетей WordPress (2019)

Плагины для социальных сетей WordPress (обзор)

1. Кнопки AddToAny Share

Как установить плагин AddToAny Share Buttons на свой сайт?

2. Простые социальные иконки

Как установить плагин Simple Social Icons на свой сайт?

3. Виджет социальных сетей

Как добавить плагин виджета социальных сетей на свой сайт?

4. Sassy Social Share

Как добавить Sassy Social Share на свой сайт?

5. Перо в социальных сетях

Как добавить плагин Social Media Feather на свой сайт?

6. Шареоголик

Как добавить Shareaholic на свой сайт?

7. Значки социальных сетей и кнопки социальных сетей

Как установить «Поделиться социальными иконками» и «Поделиться социальными кнопками» на свой сайт?

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

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

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

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

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

Почему плагины для социальных сетей WordPress важны?

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

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

Список лучших плагинов для социальных сетей WordPress (2019)

  1. Кнопки AddToAny Share
  2. Виджет социальных сетей
  3. Перо социальных сетей
  4. Простые социальные иконки
  5. Sassy Social Share
  6. Шареоголик
  7. Иконки социальных сетей и кнопки социальных сетей

В спешке, спешу? Посмотрите это краткое изложение

Сравнение лучших плагинов для социальных сетей WordPress (2019)

Сравнение плагинов для социальных сетей WordPress
Плагины для социальных сетей WordPress
Кнопки AddToAny Share
Простые социальные иконки
Виджет социальных сетей
Sassy Social Share
Перо социальных сетей
Шареоголик
Иконки социальных сетей и кнопки социальных сетей

Плагины для социальных сетей WordPress (обзор)

1.

Кнопки AddToAny Share


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

Обзор функций:

  • Он предоставляет стандартные кнопки общего доступа.
  • Адаптивный дизайн для плавающих кнопок общего доступа.
  • Поддержка автоматического AMP (ускорение мобильных страниц).
  • Многоязычная поддержка.
  • Интеграция с Google Analytics.
  • Отслеживание общих ссылок.
  • Это 100% бесплатное использование.
Как установить плагин AddToAny Share Buttons на свой сайт?

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

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

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

  • К началу сообщения
  • Внизу сообщения
  • Титульная страница
  • Архивная страница
  • В ленте
  • Выдержки

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

2. Простые социальные иконки


Плагин Simple Social Icons так же прост в использовании, как и его название. «Простота – это высшая изощренность», и этот плагин является истинным примером этого. Он позволяет разместить на вашем сайте шестнадцать самых популярных иконок социальных сетей. Несмотря на то, что количество доступных значков ограничено, вы можете выбрать самые популярные из них. Вы можете отобразить значок социальной сети в любой области виджетов на своем веб-сайте.

Кратко об особенностях:

  • Вы можете настроить цвет и размер значка.
  • Выравнивание значков по своему усмотрению
    • осталось
    • центр
    • верно
  • Иконки используют векторную графику для большей доступности и удобочитаемости.
  • Параметры цвета фона и наведения.
  • Это бесплатно.
Как установить плагин Simple Social Icons на свой сайт?

Загрузите и активируйте этот плагин для социальных сетей WordPress. А затем настройте его, просто перейдя в Внешний вид → Виджеты,  как показано ниже.

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

3. Виджет социальных сетей


Плагин Social Media Widget позволяет отображать значки социальных сетей на боковой панели. Это позволяет вам отображать ссылки вашего социального профиля в областях виджетов. Однако вы не ограничены отображением значков только на боковых панелях. Сказав это, вы можете отображать их где угодно на своем веб-сайте, создав настраиваемую область виджетов в своей теме. Этот плагин WordPress поддерживает более 50 сайтов социальных сетей, а также возможность добавлять свои собственные ссылки и ссылки для обмена по электронной почте.

Обзор функций:

  • Поддержка 50+ социальных сетей.
  • На выбор доступны значки нескольких размеров.
  • Включено несколько анимаций.
    • масштаб
    • подпрыгивать
    • исчезать
    • комбо
  • 4 пакета иконок.
  • Выровняйте виджеты так, как вам нравится
    • верно
    • осталось
    • центр
Как добавить плагин виджета социальных сетей на свой сайт?

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

Этот плагин для социальных сетей WordPress предлагает три интересных пакета значков, помимо стандартных значков – вырезанных значков, значков эскизов и значков сердца. Для значков у вас есть четыре варианта стиля анимации: «Затухание», «Масштаб», «Отскок» и «Комбо». В целом этот плагин для социальных сетей WordPress может с легкостью увеличить количество подписчиков.

4. Sassy Social Share


Sassy Social Share – это один из легких и бесплатных плагинов для социальных сетей WordPress, которые у нас есть. Он позволяет вам делиться своим контентом на нескольких платформах, таких как Twitter, Google, Whatsapp, Tumblr, Pinterest, Facebook, LinkedIn и т.д. Однако он также предоставляет услуги закладок. Этот плагин для социальных сетей не требует регистрации третьих лиц или каких-либо ключей API. Это, безусловно, самый простой плагин для совместного использования в социальных сетях WordPress, который предлагает около 100 сервисов обмена в социальных сетях.

Особенности, на которые стоит обратить внимание:

  • Это соответствует GDPR.
  • 100% бесплатное использование.
  • Приблизительно 100 сервисов обмена / закладок в социальных сетях.
  • Выбор цвета фона и цвета логотипа.
  • Встроенная служба сокращения URL-адресов.
  • Полностью отзывчивый.
  • Доступны виджеты и шорткоды.
  • Совместимость для нескольких сайтов.
Как добавить Sassy Social Share на свой сайт?

Загрузите плагин и перейдите на страницу Плагины → Добавить новый → Загрузить плагин в панели администратора WordPress. Теперь нажмите «Загрузить» → «Выбрать файл», загрузите zip- архив с плагином и, наконец, нажмите кнопку «Установить сейчас», чтобы завершить процесс. Если вы используете плагин кеширования, вы можете очистить кеш.

Конечно, у Sassy Social Share есть очень простые варианты его настройки. Фактически, они предлагают своим пользователям круглосуточную поддержку клиентов без выходных.

5. Перо в социальных сетях


Social Media Feather – еще один из известных плагинов для социальных сетей WordPress, который предлагает социальные сети и кнопку подписки. Ваши читатели могут с комфортом делиться вашим контентом. А также они могут стать вашими подписчиками одним щелчком мыши. Тем не менее, это единственный плагин для совместного использования и подписки в социальных сетях, который имеет параметры разрешения значков. Вы можете использовать параметры для выбора положения кнопки «Поделиться и следовать», размера значков, расстояния между значками и, наконец, что не менее важно, выравнивания кнопок.

Кратко об особенностях:

  • Поддержка сетчатки и дисплеев с высоким разрешением.
  • Возможность выбора между услугами для каждого провайдера.
  • Вы можете включать собственные URL-адреса и заголовки.
  • Современные значки по умолчанию.
  • Эффекты выцветания и серости для социальных иконок.
  • Поддержка всех основных платформ.
Как добавить плагин Social Media Feather на свой сайт?

Когда вы активируете этот плагин WordPress, в списке виджетов создаются два типа виджетов. Сначала «Перо в социальных сетях: подписывайтесь на нас», а во-вторых, «Перо в социальных сетях: обмен». Вы можете разместить эти виджеты в области виджетов на веб-сайте. Однако правая боковая панель считается наиболее подходящей для этих виджетов. Таким образом, этот плагин действительно хорошо работает как для совместного использования, так и для подписки на кнопки социальных сетей на вашем веб-сайте.

6. Шареоголик


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

Особенности, на которые стоит обратить внимание:

  • Shareaholic поставляется с более чем 100 бесплатными социальными интеграциями, включая кнопки обмена Skype и Whatsapp.
  • Интерфейс администратора поддерживает несколько языков.
  • Shareaholic полностью оптимизирован для мобильных устройств.
  • Совместимость с дисплеем Retina.
  • Интеграция с Google Analytics.
  • Он поддерживает ленивую загрузку WordPress.
  • Бесплатное использование.
Как добавить Shareaholic на свой сайт?

Скачайте плагин и активируйте его. Теперь настройте его и сделайте настройки по своему вкусу на панели инструментов WordPress. Однако вы также можете установить этот плагин для социальных сетей WordPress вручную. Персонализировать Shareaholic в соответствии с макетом вашего сайта довольно просто. И это действительно помогает легко расширить вашу онлайн-аудиторию.

7. Значки социальных сетей и кнопки социальных сетей



Плагин Social Share Icons и Social Share Buttons довольно прост в использовании с более чем 60 000 активных установок. Никаких сложных конфигураций не имеет. Он имеет широкий спектр социальных платформ. Вы можете стилизовать свои значки с помощью 19 уникальных и красивых стилей. Интересно, что на вашем сайте может появиться всплывающее окно, чтобы побудить посетителей поделиться, поставить лайк и подписаться на ваш сайт.

Обзор функций:

  • Соответствует GDPR.
  • Показать всплывающее окно с просьбой поставить лайк.
  • Поддержка более 200 социальных сетей.
  • 16 дизайнов социальных сетей на выбор.
  • Эффекты при наведении курсора на значок
    • исчезать
    • масштаб
    • комбо
  • Оптимизирован для мобильных устройств
  • Выберите место, где будут отображаться ваши значки
    • область виджетов
    • вручную
    • плавать на странице
    • до или после постов
  • У вас могут быть разные действия, соответствующие нажатию на значок.
Как установить «Поделиться социальными иконками» и «Поделиться социальными кнопками» на свой сайт?

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

Удачного обмена в соцсетях !!

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

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

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

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

Вы также можете прочитать:

  • 10 лучших плагинов для создания форм WordPress: протестировано и сравнено (2019)
  • 5 лучших плагинов CRO WordPress для увеличения ваших продаж и потенциальных клиентов
  • 30 лучших плагинов WooCommerce для WordPress (2019)
  • 10 лучших плагинов для лайтбоксов WordPress (2019)

Источник записи: https://blog.templatetoaster.com

Как добавить иконки соцсетей на визитку?

Andriy Kozak

Обновлено

Loading…

  1. Зачем размещать информацию о соцсетях на визитке
  2. Где скачать иконки соцсетей
  3. Как добавить логотипы соцсетей на визитку
  4. Заключение

Facebook, Twitter, YouTube и Instagram превратились в мощные маркетинговые инструменты. Независимо от того, в каких соцсетях вы продвигаете бизнес, добавьте их значки на свою визитку — это поможет расширить аудиторию и увеличить продажи. В статье расскажем, где скачать иконки соцсетей и как добавить их на бизнес-карточку.  

Зачем размещать информацию о соцсетях на визитке

Чтобы заказать продукт, многие клиенты предпочитают не звонить в офис, а написать в директ Instagram или Facebook. С изменением способов связи изменился и дизайн визиток: к обязательным телефону и электронному адресу добавились ссылки на соцсети. Их можно указать рядом с контактами или зашифровать в QR-код. Выбирайте любой из способов, а мы объясним, зачем нужна информация о соцсетях на бизнес-карточке.

  1. Быть актуальным. Сегодня аккаунты в социальных сетях есть у всех — от голливудских звезд до британской королевы. В 2018 году соцсетями пользовались 2,6 миллиарда человек в мире. Ожидается, что к 2021 году эта цифра вырастет до 3,1 миллиарда. Маркетологи говорят: если вашего бизнеса нет в онлайне, значит, его не существует. Ну а если ваши соцсети не указаны на визитке, то о них не узнают потенциальные клиенты и бизнес-партнеры.
  2. Играть в долгую. Представьте, что вы участвуете в крупной выставке: презентуете продукт и вручаете посетителям визитки. 88% полученных карточек люди выбросят в течение недели. Но благодаря ссылкам в бизнес-карточках они подпишутся на аккаунты и останутся с вами на дольше. 
  3. Завоевывать доверие. Лента в Facebook или Twitter помогает лучше узнать бренд: какой контент вы публикуете, как общаетесь с аудиторией, как реагируете на вопросы. Наблюдая за вами в онлайне и читая отзывы о продуктах, подписчики превращаются в лояльных клиентов.

Где скачать иконки соцсетей

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

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

На этих сервисах вы можете найти сотни иконок и скачать их бесплатно: 

  • Ego Icons
  • Find Icons
  • Icons8
  • Mr.Icons

В качестве бонуса предлагаем несколько идей для вдохновения:

  • выделите значки не цветом, а тиснением — это смотрится просто и эффектно;
Source: by Cara Bell
  • оформите в виде нарисованных от руки значков, если это уместно для вашего бренда;
  • если карточка выполнена в ахроматической гамме (белый, серый, черный цвета), сделайте иконки цветовым акцентом наряду с лого;

Source: Pinterest
  • если карточка разноцветная, для значков лучше выбрать спокойную гамму;
  • выделите иконки, поместив их в круг или квадрат, окрашенный в цвета бренда.
Source: by BG Design

Как добавить логотипы соцсетей на визитку

Создали визитку в Logaster и хотите добавить значки соцсетей? Воспользуйтесь графическими редакторами (Adobe Photoshop, Illustrator) или Microsoft Word. Вам понадобится готовый макет визитки и сохраненные отдельными файлами иконки. Добавляйте их — и компонуйте элементы на макете. Как это сделать, смотрите на видеоинструкции .

Нужна оригинальная визитка?

Создавайте ее на Логостер. Скачивайте в векторном формате и добавляйте иконки соцсетей!

Придерживайтесь таких принципов:

  1. Количество. Помните, что визитка должна оставаться простой и лаконичной. Не переполняйте ее значками — перечислите не больше трех соцсетей, в которых вы наиболее активны (в порядке убывания).
  2. Расположение. Сортируйте иконки по приоритету. Если Facebook — ваш основной способ связи с клиентами, разместите его перед телефоном и электронным адресом.
  3. Размер. Иконки должны быть одинакового размера: к примеру, значок YouTube не может быть больше, чем LinkedIn. Все значки соцсетей должны быть меньше, чем ваш логотип.

Заключение

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

Обновлено

Posted inHow To

20 бесплатных наборов иконок для социальных сетей, которые сделают ваш сайт вирусным

Логотипы социальных сетей, таких как Twitter, Facebook или YouTube, являются одними из наиболее широко используемых дизайнов иконок на наших веб-сайтах. Сэкономьте время в своих будущих проектах с помощью этого удобного набора из более чем 20 различных пакетов, каждый из которых содержит множество популярных социальных иконок в различных стилях. Я тщательно отобрал лучшие бесплатные пакеты, которые смог найти, отсеяв все наборы, которые устарели из-за постоянно меняющегося логотипа Twitter в виде птицы.

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

Все эти бесплатные значки социальных сетей, которые мы выбрали, представляют собой идеальные до пикселя векторы. Некоторые из них разработаны в Photoshop, некоторые в Illustrator, а некоторые в Sketch, но все их можно бесплатно загрузить и использовать в личных или коммерческих проектах.

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

Pin

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

Пин-код

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

Булавка

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

Pin

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

Булавка

Этот набор может стать отличным подспорьем в вашем арсенале халявы и может пригодиться для будущих проектов. Иконки в этом наборе были созданы с чистыми цветами и плоским дизайном. Не упустите шанс получить эти 24 бесплатных плоских значка!

Пин-код

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

Pin

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

Бесплатные иконки социальных сетей

Pin

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

Пин-код

Ищете еще плоские иконки? Посмотрите на эти плоские значки социальных сетей, разработанные Designmodo, и убедитесь, что они именно те, которые вы имели в виду!

Булавка

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

Pin

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

Пин-код

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

Булавка

Этот набор содержит 60 плоских иконок с длинными тенями, разработанных Speckyboy. Определенно стоит присмотреться к этому удивительному набору, так как они могут очень пригодиться в будущем.

Pin

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

Штифт

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

Пин

Этот набор содержит наборы иконок! Да, верно, этот бесплатный набор содержит 4 типа различных версий иконок: плоский набор, удобный набор, скошенный набор, шероховатый набор, сшитый набор, причудливый набор, властный набор и теневой набор. В этой массивной коллекции вы обязательно найдете значки социальных сетей своей мечты.

Популярные социальные сети – плоский

Пин-код

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

Лучшие наборы иконок социальных сетей для вашего веб-сайта

Сегодня социальные сети занимают большую часть нашей жизни. Нам нужно создавать действительно отличный контент, чтобы заводить новые связи и привлекать клиентов. Улучшение внешнего вида вашего контента — одна из важных вещей для создания вашей целевой аудитории. Цель социальных сетей — создать больше аудитории для вашего контента. В этом вам помогут значки и логотипы социальных сетей. Используя эти значки, пользователи могут получить доступ к вашему сайту одним щелчком мыши. Здесь мы расскажем вам о лучших из них, как всегда, в нашем блоге «Лучшие наборы иконок социальных сетей для вашего веб-сайта».

1. Iconfinder

Iconfinder — это отличная платформа, на которой вы можете найти множество значков социальных сетей, которые вы ищете.

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

Одна из его лучших функций предлагает вам более 6 миллионов иконок.

Вы можете скачать иконки в форматах файлов PNG и SVG. Или, если вы хороший дизайнер, вы можете выбрать форматы AI ICO ICNS для Adobe Illustrator.

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

Что касается цены, вы можете использовать 207 798 иконок и иллюстраций бесплатно. Но вы должны заплатить 2,00 доллара за 6 миллионов дополнительных иконок, ежемесячная плата в размере 9,00 долларов, если вы используете его без рекламы.

2. Nucleo — бесплатные иконки социальных сетей

Nucleo — это набор иконок социальных сетей для Mac и Windows, предназначенный для редактирования, настройки и экспорта коллекции из 32239 иконок.

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

Его иконки могут быть размером 16, 24, 32, 48, 64 пикселей в 5 различных размерах, а также в качестве контура, цвета и заливки в 3 различных стилях. Доступно в формате SVG для iOS, Android и веб-приложений.

Хотя вы можете использовать контур и заливку в той степени, в которой хотите, к сожалению, это не действует для цвета, его можно использовать только в размере 48 пикселей.

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

Если пользователей будет более 1, вам нужно будет использовать его за 299 долларов.

3. Flaction

Во Flaction вы можете найти более 6,4 миллионов иконок социальных сетей для ваших проектов и сайтов. Самая большая база данных значков с более чем 64 форматами значков, включая PNG, SVG, CSS. Здесь можно найти не только простые иконки, но и анимированные.

Редактируемые форматы для Adobe After Effects или JSON позволят вам творить чудеса на вашем сайте. Бесплатные наборы иконок для социальных сетей из всех форм, во всех цветах, прекрасно описаны на сайте.

Все бесплатные иконки социальных сетей в формате png, если вы хотите использовать их в других форматах, вам необходимо дополнительно приобрести 12 или 1 месяц. Вы можете использовать премиум-версию, заплатив 7,50 евро за 1 год и 6,75 евро за 1 месяц.

4. Шрифт Tonicons

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

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

Предлагает 115 высококачественных пакетов анимации социальных иконок для After Effect. Вы можете изменить и изменить размер цветов всех значков социальных сетей по своему вкусу. Его можно легко использовать во многих программах, таких как SkectApp, CorelDraw.

Подходит для иконок социальных сетей в форматах PSD и PNG с размерами 20, 32, 48, 64, 128, 256, 512 пикселей.

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

5. Набор социальных иконок Rivet

Rivet Social Icon Set предлагает 14 наборов социальных сетей бесплатно. Благодаря своему различному дизайну значки создают впечатление, будто они находятся на металлическом листе. Если у вас есть сайт WordPress, вы можете использовать его с этой темой. Иконки в пакете имеют размер 64x65px и формат PNG. Вы можете легко использовать его в личных и коммерческих целях.

6. SocioLEGO Набор социальных иконок Lego

SocialLego предлагает вам 11 различных иконок для использования на вашем сайте. Что отличает SocialLego от других наборов иконок для социальных сетей, так это чудо дизайна. Все иконки выполнены в виде лего-блога.

Если у вас есть игровой или образовательный сайт, им легко пользоваться. В пакет включены значки разных размеров: 256x256px, 128x128px, 64x64px и 32x32px. Эта идеально разработанная иконка доступна бесплатно.

7. 24 бесплатных плоских значка социальных сетей

Этот набор из 24 значков социальных сетей отличается тонким дизайном. Набор с 4 различными стилями стильно оформлен. Набор с 4 различными стилями стильно оформлен. Его размер можно изменить с 512 до 16 пикселей.

9Пакет значков 0002 поддерживает форматы файлов AI и EPS. Вы можете придать своему сайту любую форму и размер. Таким образом, это помогает увеличить посещаемость вашего сайта. Эти 24 значка социальных сетей можно использовать совершенно бесплатно.

8. Circle Flat Icons Retina-Ready

Circle Flat Icons содержит 24 высококачественных значка социальных сетей. Вы можете легко использовать значки социальных сетей, таких как Facebook, Twitter, Behance, на своем сайте.

Все иконки только в формате PNG. Размер ваших иконок может быть 256x256px, 128x128px, 64x64px и 32x32px. Вы можете изменить его размер в соответствии с размером и дизайном вашего сайта. Он используется совершенно бесплатно.

Наконец,

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

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

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

Также ознакомьтесь с другими нашими статьями в похожих категориях:

10 лучших плагинов для виджетов с иконками социальных сетей для WordPress

14 лучших бесплатных наборов иконок социальных сетей для WordPress

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

Чтобы сделать все это, вы должны разместить значки социальных сетей где-нибудь на видном месте на своей веб-странице. Вы можете вставить их на свою домашнюю страницу или специальную страницу «О нас», добавить кнопки «Поделиться» в социальных сетях к своим сообщениям и в любом другом месте, которое вы считаете подходящим. Но чтобы ваши значки социальных сетей были полностью видны вашим посетителям, просто выбрать подходящее местоположение недостаточно. Вы также должны убедиться, что дизайн ваших социальных иконок привлекает внимание и в то же время соответствует дизайну вашего веб-сайта.

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

  • Минимальные иконки социальных сетей

  • 100 бесплатных иконок социальных сетей мира

  • Классные логотипы социальных сетей

  • Набор иконок социальных сетей от Jagathish Saravanan

  • Социальный Округленный

  • Румяна Иконки социальных сетей

  • Набор иконок для социальных сетей (твердый)

  • Набор иконок социальных сетей от Just Icon

  • Набор иконок с логотипами и брендами от Flatart

  • 48 бесплатных иконок социальных сетей (в векторе) от Stefan Kuhl

  • Drawic от Kyo Nagashima

  • Флатикон

  • Бесплатные иконки

  • Freepik

Минимальные значки социальных сетей

Минимальные значки социальных сетей — это коллекция из минималистичных, стильных и современных иконок, которые вы можете использовать для своего сайта WordPress совершенно бесплатно . В этом пакете вы получите значки для некоторых из самых популярных социальных сетей, таких как Twitter, Facebook, Instagram, Behance и Dribbble. Поддерживаемые форматы включают AI, SVG и EPS. Кроме того, вы сможете экспортировать файл векторного иллюстратора практически в любой другой формат.

100 иконок социальных сетей Free World

Набор из 100 иконок социальных сетей Free World содержит иконки в векторном формате и поставляется практически со всеми мыслимыми социальными сетями. Таким образом, это один из самых больших наборов иконок для социальных сетей, который отлично подходит для веб-дизайнеров и разработчиков. Вы можете использовать их бесплатно, как в личных, так и в коммерческих целях. Тем не менее, ссылка на сайт автора обязательна.

Классные логотипы социальных сетей

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

Набор иконок для социальных сетей от Jagathish Saravanan

Еще одна коллекция иконок для социальных сетей, выполненная в черном цвете, от Jagathish Saravanan включает 10 бесплатных векторных иконок, идеально подходящих для любого веб-сайта с простым, но современным дизайном. Иконки в наборе включают Instagram, Dribble, Google, Facebook, Twitter, LinkedIn, PayPal, а также несколько иконок, связанных со СМИ и общением.

Social Rounded

Social Rounded — это набор, включающий красивые и красочные закругленные SVG-иконки, которые вы можете использовать, чтобы оживить дизайн вашего веб-сайта. Вы получаете набор из 25 иконок, таких как Twitter, Viber, WhatsApp и YouTube. Кроме того, вы также получаете несколько универсальных значков, которые представляют разработку, программирование, документирование и обмен в социальных сетях, музыку и социальные приложения и многое другое.

Темы Qode: Лучшие темы

Посмотреть коллекцию

Мост

Креативная многоцелевая тема WordPress

Стокгольм

Действительно многофункциональная тема

Startit

Свежая бизнес-тема Startup

Blush Social Media Icons Это список акварельных иконок социальных сетей

3 90 идеально подходит для веб-сайтов с художественным чутьем или тех, которые просто соответствуют их общему дизайну. слегка размытый розовый оттенок , который можно найти в этом наборе иконок для социальных сетей Blush, сильно отличается от некоторых стандартных наборов значков. Таким образом, это может только помочь вам в вашей миссии выделиться среди других при представлении вашего бизнеса в Интернете.

Набор значков социальных сетей (сплошной)

Набор значков социальных сетей (сплошной) состоит из большого количества черно-белых значков (45, если быть точным), все из которых привлекательны, современны и в целом радует глаз . Если вы хотите, вы можете скачать эти значки в форматах SVG и PNG, причем формат PNG доступен в 9 различных размерах. Вы можете использовать этот набор в коммерческих целях с указанием автора, что не является обязательным, но приветствуется.

Набор иконок для социальных сетей от Just Icon

Набор иконок для социальных сетей от Just Icon — это красочный и, осмелимся сказать, симпатичный набор из иконок, который включает 30 бесплатных векторных иконок для некоторых из самых популярных социальных сетей . К ним относятся такие, как Gmail, Line, Skype и Reddit. Помимо SVG, вы также можете скачать PNG и такие форматы, как AI, SCH, ISO и ICNS.

Набор значков с логотипами и брендами от Flatart

Набор значков с логотипами и брендами, содержащий более 400 значков (да, вы правильно прочитали), — отличный выбор, если вы ищете что-то слегка необычное. А именно этот набор иконок отличается своим нарисованным от руки внешним видом , способным привлечь внимание независимо от того, для какого типа веб-сайта они вам могут понадобиться — уникального веб-сайта-портфолио, блога, профессионального маркетингового агентства или чего-либо еще. Вы можете использовать эти иконки в личных и коммерческих целях совершенно бесплатно — просто не забудьте указать ссылку на сайт автора.

48 бесплатных иконок для социальных сетей (в векторе) от Stefan Kuhl

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

Drawic by Kyo Nagashima

Drawic — это небольшой набор SVG-иконок, которые можно загрузить непосредственно с веб-сайта дизайнера Kyo Nagashima. Сделав это, вы получите огромное количество из 88 различных социальных иконок, выполненных в стильном сочетании белого и серого . Его создатели также рекомендуют вам использовать функцию масштабирования вашего браузера и дополнительно проверять качество этих значков.

Flaticon

Flaticon — это платформа, используемая многими талантливыми дизайнерами, которые загружают туда свои собственные наборы иконок. Фактически, на этом сайте вы сможете найти более 80 000 пакетов значков. Вы можете ввести любой стиль, который вас интересует, в строке поиска, и вы увидите впечатляющее количество вариантов значков. На этом сайте есть все, от черных значков до многоцветных наборов значков. Все, что вам нужно сделать, это найти набор, который лучше всего подходит для вас.

Бесплатные иконки

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

Freepik

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

Заключение

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

Каждый из наборов значков социальных сетей, которые мы представили выше, может предложить что-то уникальное — будь то их цветовая комбинация, общий стиль значка или количество различных сетей, включенных . А если вы хотите подробнее изучить свои варианты, вы всегда можете посетить некоторые из мест, где, как известно, есть потрясающие наборы значков социальных сетей, такие как freeicons. io, Flaticon и Freepik. В любом случае, мы уверены, что вы сможете найти свою идеальную пару среди наших лучших вариантов.

Социальные иконки в WordPress (опыт 2022 года)

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

Но (всегда есть но, не так ли?), если вам нужны более изысканные функции, вам может понадобиться плагин. И если вы все еще используете классический редактор WordPress, вы можете сразу перейти к главе о плагинах для социальных сетей.

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

Блоки и шаблоны социальных сетей WordPress

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

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

Давайте проверим их.

Внутри страницы найдите любой знак «+». Нажмите на один из них, чтобы открыть средство вставки блоков.

Затем введите «социальный» в строке поиска внутри средства вставки блоков.

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

Блок социальных значков позволяет добавлять несколько значков в одну строку.

Важно : если вы будете искать эти значки по отдельности, в блокировщике, вы их не найдете. Вы можете заметить Twitter или TikTok, но эти блоки позволяют вставлять контент только с этих платформ, например твит.

Работа с блоками социальных сетей

Начнем с добавления блока Social Icons. Когда вы нажмете на нее, она будет добавлена ​​на страницу.

С помощью знака «+» вы можете добавить столько значков, сколько захотите.

Панель инструментов, которая появляется над блоком, позволяет:

  • Переместить блок . Когда вы выберете 6 точек, у вас будет возможность перетащить блок туда, куда вы хотите. Когда вы выбираете стрелки вверх и вниз, вы будете перемещать блок вверх и вниз.
  • Изменить выравнивание и выравнивание элементов ,
  • Выберите размер для элементов (маленький, нормальный, большой и огромный),
  • Скопируйте блок в буфер обмена и вставьте его на другую страницу или запись,
  • Дублируйте блок,
  • Переместите блок . После того, как вы выберете опцию «Переместить в», вы можете использовать клавиши со стрелками на клавиатуре, чтобы переместить блок туда, куда вы хотите. Просто нажмите Enter, когда доберетесь до выбранного места для перемещенного блока.
  • Вставить новый блок до и/или после текущего,
  • Редактировать блок как HTML . В тот момент, когда вы выберете эту опцию, вы увидите теги HTML, относящиеся к блоку. Тег HTML для значков социальных сетей — это тег
      , как в «неупорядоченном списке». Когда вы хотите выйти из редактора HTML, вы возвращаетесь к параметрам и переключаетесь на «Редактировать визуально».
    • Сгруппируйте дополнительных блоков, чтобы вы могли перемещать/перетаскивать их вместе, когда вам нужно,
    • Удалите блок .

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

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

    Теперь давайте добавим несколько значков со знаком «+».

    Я добавляю TikTok, Instagram и Spotify. Вы можете использовать строку поиска, чтобы ввести название значка, который вы ищете. Теперь будьте осторожны, используйте знак «+», на который я указываю ниже, чтобы добавить значки социальных сетей!

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

    В разделе «Стиль» у нас есть три варианта формы значков. Я собираюсь пойти на «Форму таблетки».

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

    Вы можете изменить как значок, так и цвет фона значков.

    Я выберу светло-розовый цвет для значков и светло-фиолетовый для фона. Теперь я вижу это сообщение, в котором мне советуют выбрать более контрастные цвета.

    Я переключаюсь на белые значки и темно-зеленый фон.

    Далее я могу немного поиграть с расстоянием между значками, а также между блоком и окружающими блоками (они же поля).

    Что касается настроек ссылок, я оставлю эту опцию «Вкл.»: открывать ссылки в новой вкладке.

    Но как добавить настоящие ссылки?

    Для этого нам нужно выделить каждую иконку по отдельности.

    Начнем со значка TikTok. В тот момент, когда вы выберете его, вы увидите панель, в которую вы можете вставить URL-адрес.

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

    Вот оно. Теперь вы разместили значки социальных сетей на странице со ссылками на ваши самые важные профили в социальных сетях.

    Шаблоны, включающие значки социальных сетей

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

    Я собираюсь добавить на страницу заголовок по центру с навигацией на фоне лосося.

    Этот заголовок состоит из трех основных блоков. Слева направо: блок навигации (включает только страницу с названием «Специализации», блок заголовка сайта (Lemony) и блок социальных иконок.

    Вы можете вносить изменения во всю группу блоков (шаблон) из редактора справа.

    Вы также можете настроить каждый блок отдельно.

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

    Если вы хотите, например, удалить значок «Twitter», вам нужно сначала выбрать его. Затем выберите три вертикальные точки на панели инструментов. Затем нажмите «Удалить значок социальной сети».

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

    Блоки сторонних социальных иконок

    Возможно, вы уже заметили это: как только вы начнете вводить «социальный» в строке поиска в инструменте вставки блоков, вы получите дополнительные рекомендации, помимо блоков и шаблонов. Это сторонние блоки, созданные разработчиками в сообществе WordPress.

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

    В редакторе блоков (инспекторе) справа вы можете выбрать из списка каналы социальных сетей, а затем выбрать тип кнопки. Давайте перейдем к Twitter и Material Flat.

    Дело в том, что это все, что делает блок-плагин. Дополнительные параметры стиля отсутствуют.

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

    Как встроить контент социальных сетей на страницу или в публикацию

    Ранее я упоминал, что вы можете заметить блоки TikTok или Twitter в средстве вставки блоков, и что они позволяют встраивать контент с этих платформ.

    Давайте посмотрим, как это работает.

    Начнем с добавления блока Twitter на страницу.

    Это будет выглядеть так:

    Теперь нам просто нужно поместить туда URL. Я собираюсь найти твит от J.K. Роулинг.

    Если вы выберете три горизонтальные точки в правом углу твита, вы увидите список параметров. Выберите «Вставить твит». Скопируйте URL-адрес твита в блок Twitter на своей странице.

    Таким образом вы встроите все содержимое твита на свою страницу.

    Шикарно выглядите, не правда ли?

    Рекомендуемые плагины социальных сетей WordPress

    Давайте теперь посмотрим, какие из них являются одними из самых популярных социальных плагинов WordPress!

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

    Если вы используете редактор блоков по умолчанию, вам следует проверить, имеет ли выбранный вами плагин блочную версию или нет, или он был протестирован с WordPress 5.9.Обновить.

    Smash Balloon

    Плагины Smash Balloon  WordPress используют более 1 600 000 пользователей, среди которых можно узнать Coca Cola, Bailey’s, Indeed и другие.

    Вот некоторые из функций, предоставляемых плагинами Smash Ballon:

    • Объедините свои социальные каналы из Facebook, Twitter, Instagram и YouTube в одну стену, известную как Социальная стена,
    • Отображение настраиваемых Facebook, Instagram, Twitter, или каналы Youtube в WordPress,
    • Пользовательские каналы социальных сетей на 100 % адаптированы для мобильных устройств.
    • Отображение лайков, акций, комментариев и реакций в настраиваемом раскрывающемся списке.

    WordPress 5.9 протестирован? Да.

    Есть ли официальный блок Smash Balloon? Да, для ленты Facebook. Узнайте больше здесь .

    Кнопки «Поделиться в социальных сетях» Всплывающие и всплывающие значки социальных сетей

    Этот плагин позволяет добавлять значки «Поделиться» для RSS, электронной почты, Facebook, Twitter, LinkedIn, Pinterest, Instagram, Youtube, «Поделиться» (охватывающих более 200 других социальных сетей) платформы) и загрузите пользовательские значки общего доступа по вашему выбору. У него более 200 000 активных установок.

    Вот некоторые функции, которые нам нравятся:

    • Простое размещение значков социальных сетей и обмена ими на вашем сайте,
    • Доступно более 200 стилей дизайна,
    • Возможность сделать значки социальных сетей «плавающими» или «плавающими». sticky’,
    • Разрешение посетителям подписываться на ваш блог по электронной почте,
    • Адаптивность для мобильных устройств,
    • Не замедляет работу вашего веб-сайта.

    Social Warfare

    Плагин Social Warfare уже скачали более 1 000 000 раз.

    Вот некоторые из функций Social Warfare, которые нам нравятся:

    • Доступны мощные настройки,
    • Функция Social Analytics позволяет вам точно понять, как ваши пользователи взаимодействуют с вашим контентом в социальных сетях,
    • Функция Social Optimizer позволяет вам, чтобы быстро создавать открытые графические теги и карточки Twitter,
    • Отображение счетчиков социальных сетей преимущественно для поощрения большего количества репостов.
    • Легкий и быстрый, так что это не повредит вашим усилиям по SEO,

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

    Войдите в конструкторы страниц!

    Как добавить значки социальных сетей на свой сайт с помощью конструктора страниц Kubio

    Kubio — это блочный конструктор страниц, который обогащает редактор WordPress по умолчанию новыми блоками и бесконечными вариантами стилей.

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

    После установки компоновщика страниц Kubio вы заметите несколько дополнительных блоков в средстве вставки блоков. Черные — это основные блоки WordPress, а сине-зеленые — это блоки Kubio.

    Давайте выберем блок социальных иконок и перетащим его в нужное место на холсте.

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

    Значки будут соответствовать цветам используемого вами шаблона/темы.

    В тот момент, когда вы выбираете блок социальных иконок, панель редактирования блока становится доступной с правой стороны. Именно здесь, в Кубио, происходит вся магия укладки!

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

    Контент

    На уровне «Контент» вы можете:

    • Выровнять значки по горизонтали.
    • Добавить новые значки в список. Есть много значков, которые вы можете выбрать.
    Стиль

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

    Вот что можно стилизовать:

    • Фон значка.
    • Граница значка.
    • Размер значка.
    • Расстояние между значками и отступы.
    Расширенный

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

    Вот доступные варианты:

    • Фон . Здесь вы можете настроить цвет и тип фона.
    • Расстояние. Здесь вы можете настроить поля и отступы для вашего блока социальных иконок Gutenberg.
    • Граница и тени. Здесь вы можете добавить к вашему блоку границы другого цвета, радиуса и толщины. Кроме того, вы можете добавить тени коробки. У вас есть полный контроль над положением, размытием, распространением и цветом тени блока.
    • Отвечает. Здесь вы можете решить, будет ли блок отображаться на компьютере, планшете или мобильном телефоне.
    • Разное. На этом уровне вы можете настроить z-индекс вашего блока (вертикально упорядочить перекрывающиеся элементы), установить, будет ли элемент переполняться или нет (отображение содержимого блока, вытекающего из его контейнера в окружающую область), добавить якоря HTML и классы CSS..

    Вот и все, ребята! Готовы ли вы теперь увеличить свою вовлеченность в социальные сети, используя значки социальных сетей WordPress и кнопки обмена?

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

    Иконки социальных сетей — Пользовательские иконки социальных сетей.

    Особенности

    Проверьте

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


    Проверьте

    Добавьте анимацию и эффекты наведения, чтобы ваши значки всплывали и вызывали больше кликов.


    Проверьте

    Настройте цвет, размер и форму значков социальных сетей.


    Около

    Получите больше подписчиков во всех своих социальных профилях.

    • Официальные иконки для Facebook, Instagram, Twitter, YouTube и более 50 других социальных сетей.
    • Полностью настройте внешний вид значков: выберите фон и цвет заливки, используйте квадратные или круглые значки, отрегулируйте размер значков, добавьте эффекты наведения и отобразите значки горизонтально или вертикально на странице.
    • Мобильный, отзывчивый на любом устройстве.

    Расширенные возможности:

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

    Добавление значков социальных сетей в Weebly

    • Нажмите синюю кнопку «Добавить».
    • Перетащите элемент POWR на свою страницу.
    • Настройте значки социальных сетей в Weebly.

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

    «Мне нравится, сколько различных вариантов он предлагает для платформ. Продолжайте в том же духе!» — Цифровой дизайн

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

    Подробнее

    Цены

    Индивидуальный дизайн
    Выберите цвета, шрифты, фон и стили границ.

    чек

    чек

    чек

    Удалить логотип POWr
    Удалить брендинг с неограниченного количества значков социальных сетей POWr.

    проверка

    проверка

    Дополнительные функции
    Обновите версию, чтобы разблокировать расширенные функции, такие как пользовательские значки и анимация.

    чек

    Посетите сайт разработчика для получения полной информации о ценах pageupdateexternal

    Отзывы

    звездымаленький звездный звездный звездный звездочки

    звездочки звездный звездный звездный звездочка

    49 оценок

    • звездымаленький звездный звездный звездный звездочки

      звездочки звездный звездный звездный звездочки

      Пользователь Weebly 03 августа 2022 г.

      Не красиво и с намеренно уродливым логотипом Powr вы почти вынуждены платить. но я не плачу за это. В самом деле. они не красивые. они не вписываются в тему. Извините за резкие слова, но это правда. .

    • звездымаленький звездный звездный звездный звездочки

      звездочки звездный звездный звездный звездочки

      Пользователь Weebly 13 февраля 2022 г.

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

    • звездымаленький звездный звездный звездный звездочки

      звездочки звездный звездный звездный звездочки

      Пользователь Weebly 27 мая 2021 г.

      Бред, нет избранных функций очень сложно загрузить

    • звездымаленький звездный звездный звездный звездочка

      звездочки звездный звездный звездный звездочки

      Пользователь Weebly 16 окт. 2020 г.

      Когда я нажимаю на значки, я не перемещаюсь туда, куда должен

    • звездымаленький звездный звездный звездный звездочки

      звездочки звездный звездный звездный звездочка

      Тодд Ворейс 14 февраля 2020 г.

      Быстрая и простая настройка даже для пользовательских ссылок!

    • звездымаленький звездный звездный звездный звездочки

      звездочки звездный звездный звездный звездочки

      МОХАМЕД ЭЛЬФАХИМ 12 февраля 2020 г.

      je suis un étudient je préféré ce site la parceque il est Important et facile pour cree un site web

    • звездымаленький звездный звездный звездный звездочки

      звездочки звездный звездный звездный звездочки

      Кейт Тобиас 06 февр. 2020 г.

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

    • звездымаленький звездный звездный звездный звездочки

      звездочки звездный звездный звездный звездочки

      Трейлраннеры Северного парка 29 января 2020 г.

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

    • звездымаленький звездный звездный звездный звездочки

      звездочки звездный звездный звездный звездочки

      Тара Оконнелл 01 нояб. 2019 г.

      Только скачал, ничего не сохраняет и постоянный запрос на просмотр — как можно просмотреть, когда буквально только что открыл!?

    • звездымаленький звездный звездный звездный звездочки

      звездочки звездный звездный звездный звездочки

      Дорис А. Бедсол 05 сент. 2019 г.

      Некоторые проблемы с facebook. Мне нравится один клик для загрузки в приложения

    1 — 10 из 49

    Как 9 брендов отображают социальные сети на своем веб-сайте

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

    Социальная интеграция в заголовки

    Хотите убедиться, что никто не пропустит ваши социальные профили? Разместите их в заголовке, как у следующих брендов, чтобы они были выше сгиба.

    1. Whole Foods

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

    2. Tennis.com

    На сайте Tennis.com все просто: маленькие значки в правом верхнем углу строки меню позволяют посетителям быть в курсе последних новостей тенниса в Twitter, Facebook и своих блог.

    3. Oreo

    Oreo интегрирует яркие и смелые социальные иконки в заголовок своего веб-сайта. Тем не менее, социальная активность на этом не заканчивается — под их заголовком и графикой празднования 100-летия находятся дополнительные ссылки на социальные профили, включая еще три ссылки на их страницу в Facebook и виджет активности в Twitter. Даже в их нижнем колонтитуле есть дополнительные кнопки Facebook Like, Facebook Share, Twitter и +1.

    Интеграция с социальными сетями в боковые панели

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

    4. Mashable

    У Mashable есть одна из лучших разработанных областей подписки, которая объединяет официальные кнопки, значки и плагины из ведущих социальных сетей. Неудивительно, что у них довольно много последователей.

    5. Coca-Cola

    Домашняя страница Coca-Cola на самом деле представляет собой гигантскую заставку, которая в конечном итоге направляет вас к различным объектам под брендом Coca-Cola о спасении Арктики, машинах для фристайла, наградах и другой информации о компании. Прямо посередине их домашней страницы находится полностью социальная мини-сайдбар, оснащенная плагином Facebook и ссылками на другие социальные профили.

    6. Starbucks

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

    Социальная интеграция в нижние колонтитулы

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

    7. American Express

    American Express использует простые значки 16×16 для отображения своих популярных социальных сетей. У них даже есть вращающийся баннер, который подчеркивает их профиль в Твиттере, а также программы членских вознаграждений, мобильные приложения и другие новости.

    8. Toyota

    Toyota, как и American Express, держит свои значки маленькими и ненавязчивыми, но их легко найти тем, кто хочет общаться с ними в социальных сетях.

    9. Nikon

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

    Ресурсы

    Хотите добавить иконки социальных сетей на свой веб-сайт? Вот официальные и неофициальные ресурсы.

    Официальные значки и логотипы социальных сетей

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

    • Логотипы и значки Twitter. На этой странице представлены версии логотипа Twitter и птицы в форматах PNG и EPS для светлого и темного фона.
    • Логотип Facebook. Facebook предлагает логотип кнопки «Нравится» в формате EPS и квадратный логотип «f» в формате EPS, JPG, PNG и PDF.
    • Значок Google+ — Google+ предлагает официальный статический значок нескольких размеров в формате PNG.
    • Логотипы и изображения LinkedIn — LinkedIn предлагает квадратные и корпоративные логотипы со светлым и темным фоном в формате JPG и PNG. У них также есть файлы TIFF с высоким разрешением для использования в печати.
    • Логотипы YouTube. У YouTube есть различные логотипы, размеры кнопок и формулировки, которые вы можете использовать для своего веб-сайта. Доступ к ним можно получить с помощью раскрывающегося списка в разделе «Нужно больше вариантов».
    • Кнопки, ресурсы и значки Foursquare. Foursquare предлагает широкий выбор различных кнопок для вашего локального бизнес-сайта в формате PNG.

    Неофициальные значки социальных сетей

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

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

    Официальные социальные значки и плагины

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

    • Кнопка «Подписаться на Твиттер» — нажмите здесь официальную кнопку «Подписаться на Твиттер» вместе с дополнительными кнопками «Поделиться в Твиттере».

Добавить комментарий

Ваш адрес email не будет опубликован.