Сайт

Кнопка поделиться вконтакте для сайта: Добавить на сайт кнопки поделиться в соц сетях без плагинов и скриптов

03.09.2023

Содержание

Кнопка «поделиться Вконтакте» для WordPress через Jetpack

Jetpack — это бесплатный плагин для WordPress, позволяющий использовать многие функции, которые раньше были доступны сайтам только на WordPress.com. В этой краткой статье вы узнаете о том, как с помощью плагина Jetpack добавить на свой сайт кнопку «поделиться» для популярной российской социальной сети Вконтакте.

Установка и настройка Jetpack

Если у вас ещё не установлен плагин Jetpack, то вы можете сделать это через панель администрирования в разделе плагины, или скачать дистрибутив плагина с сайта WordPress.org. После установки, плагин предложит вам подключить его к вашей учётной записи на WordPress.com.

Подключить Jetpack к WordPress.com

Если у вас ещё нет учётной записи в сети WordPress.com, сейчас самое время её создать. Учтите, что сеть WordPress.com и ваш сайт на WordPress это разные вещи. Если вас интересуют подробности, обратитесь к нашей статье о разнице между WordPress.org и WordPress. com.

После подключения Jetpack к вашему аккаунту на WordPress.com, вам станут доступны все модули. Найдите модуль Поделиться и убедитесь в том, что он активен.

Модуль Поделиться в Jetpack

Настройка кнопки поделиться Вконтакте

Щёлкните кнопку Настроить в модуле Поделиться, или перейдите в раздел Параметры → Поделиться из основного меню WordPress. Настройки модуля делятся на два раздела, в данном случае нас интересует настройка блока Поделиться (Sharing Buttons). В области доступных сервисов найдите ссылку «Добавить новый сервис».

Настройки блока Поделиться

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

http://vk.com/share.php?url=%post_full_url%

Вам так же потребуется иконка размером 16х16 для вашей кнопки. Вы можете скачать её здесь и загрузить в вашу медиа библиотеку. Затем в поле URL-адрес иконки вставьте ссылку на файл картинки из вашей медиатеки.

Настройки для кнопки Вконтакте

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

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


Подобным способом в WordPress можно добавить кнопки «поделиться» и для других социальных сетей, не доступных по умолчанию в плагине Jetpack. Вам всего лишь нужно будет найти правильную ссылку (как правило на сайте социальной сети) и подобрать соответствующие иконку.

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

Марина Устюжанина

Сооснователь журнала WP Magazine, организатор первой конференции по WordPress в России и WordPress митапов в Москве. Поклонница свободной лицензии GPL. Чтение как образ жизни.

Подписаться на рассылку

Подписаться → Подпишитесь на бесплатную рассылку журнала WP Magazine и получайте новости, события, подборки тем и плагинов, уроки, советы и многое другое в мире WordPress!

Поделиться ссылочкой, рассказать в ЖЖ

В шестой части серии «Как продвинуть сайт самостоятельно» давайте поговорим про использование социальных кнопок, виджетов, и плагинов, которые позволяют делиться информацией с вашего сайта с друзьями в VK, Twitter, Facebook, ЖЖ, Google и т.д.

Как это работает

Установка кнопок означает, что у вас есть нечто такое, что люди захотят поместить у себя на страницах в Фейсбуке, Гугле, ВКонтакте. А значит, ваш сайт, или его отдельную страницу, увидят друзья этого человека. Таким образом, один клик/лайк будет продвигать ваш сайт в социальных сетях.

Скованные одной цепью

Сегодня оптимизация под социальность (social media optimization) – это часть SEO, и наоборот, поисковая оптимизация дополняет усилия по продвижению в социальных сетях. Например, когда пишут статью для блога, ориентированную на эффект в социальных сетях, также используют элементы SEO: подбор ключевых слов, заголовки, URL, внешние ссылки.

Использование

Работа с кнопками социальных сетей – это постоянный эксперимент и, своего рода, возможность «пощупать» рынок. Например, вы видите, что ваш сайт популярен среди пользователей Фейсбука, но вам хотелось бы достучаться и до VK. Используя соответствующие виджеты, можно быстро проверить, есть ли отклик.

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

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

Стоит отметить, что уже сложилось несколько мифов по отношению к социальным кнопкам. Например, что

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

Недостатки социализации сайта

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

  • влияют на скорость загрузки страницы («привет, SEO!»)
  • уводят посетителей с сайта (а вы так старались привести их)
  • временами «глючат» и, поэтому, могут поломать дизайн страницы

Самое простое – наблюдать за счетчиком кликов. Но и не забываем, что в Google Analytics можно отслеживать трафик из социальных сетей. На основе полученных данных есть смысл дальше экспериментировать с идеями по SMO.

Где взять и какие кнопки социальных сетей выбрать?В использовании социальных кнопок есть два «режима»:
1. Назовем его Plug and Play. Пользователь не видит как работает код, а просто использует готовые плагины/виджеты тех или иных служб.
2. Девелоперский. В данном случае мы понимаем как работают эти кнопки изнутри, капаемся в коде, что-то изменяем под свои уникальные требования. В этом случае надо постоянно быть в курсе, что делают разработчики тех или иных служб.

Полезные ресурсы для разработчиков:
  • Facebook: developers.facebook.com
  • VK: vk.com/developers
  • Google+: developers.google.com/+/
Plug and Play виджеты
ВКонтакте– vk.com/developers, могут быть интересны в первую очередь:

  • Сообщества – свяжет сайт с группой или официальной страницей VK.
  • «Мне нравится» – позволит пользователям выразить отношение к статье одним кликом или поделиться ссылкой на неё с друзьями.

Фейсбук
  • Визитки: facebook.com/badges
  • Социальные плагины Фейсбука: возможность ставить отметки «Мне нравится» и «Поделиться» на других сайтах.


Твитер
: twitter.com/widgets

Mail.Ru Кнопки «Нравится» и «Класс!»: api.mail.ru/sites/plugins/share/

Сборные солянки:

  • Яндекс: Блок «Поделиться» для вашего сайта — позволяет вашим посетителям размещать ссылку на страницу вашего сайта в социальных сетях или блогах.
  • ShareThis
  • AddThis


В следующем выпуске серии для начинающих вебмастаров у нас ньюансы технического тестирования сайта. Stay tuned!

Voog в Твиттере и Facebook. Присоединяйтесь!

Вам не нужны кнопки «Поделиться в социальных сетях» на вашем сайте

Генераторы разметки схемы Блог

Войти

Получить доступ Веб-сайт. Вот почему.

Последнее обновление

|

— просмотров


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

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

Причина №1: никто не нажимает на кнопки «Поделиться»

Скажите честно — когда вы в последний раз сами нажимали на кнопку «Поделиться»?

Moovweb сообщает, что 99,8% мобильных пользователей никогда не нажимают кнопки социальных сетей. Это означает, что на 1000 посетителей вашего блога 2 человека будут взаимодействовать с кнопками. Из этих двух человек, может быть, 1 действительно поделится этим в своих социальных сетях? Пользователи настольных компьютеров чуть лучше — 99,4%.

Отчет также показал, что пользователи в 12 раз чаще нажимают на рекламу, чем на кнопку «Поделиться в социальных сетях». Нажатие на объявление уже является относительно редким событием с точки зрения статистики.

Причина № 2: хороший контент все равно будет опубликован

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

Причина № 3: более естественно делиться веб-страницей без использования кнопок общего доступа

Возможно, это было не так 15 лет назад, но сегодня это определенно так.

  • Мобильный телефон: нажмите на встроенную функцию общего доступа в браузере, чтобы поделиться в приложении по вашему выбору.
  • Рабочий стол: Скопируйте URL-адрес из браузера и вставьте его в новую публикацию в Twitter/Linkedin/Facebook.

Это дает несколько преимуществ UX:

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

Причина № 4: это может отвлекать от вашего основного CTA

Даже если бы кнопки социальных сетей были эффективны, они они все еще хорошая идея?

В большинстве случаев пользователи взаимодействуют с одним CTA. Это означает, что ваш основной призыв к действию (например, подписка на новостную рассылку, запрос демоверсии, покупка продукта [, то есть это мой любимый призыв к действию ]) будет конкурировать за внимание с кнопками социальных сетей.

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

Причина № 5: это может снизить производительность веб-сайта

Существует два основных способа добавления кнопки «Поделиться в социальных сетях» на ваш веб-сайт

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

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

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

Заключение

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

Компонент SEO, структурированные данные, настройка фавиконки, настройка карты сайта и многое другое в вашем фреймворке и на вашем языке.

Подробнее

Пожизненный доступ (цена раннего бронирования)

Использование кнопок «Поделиться» | LINE Developers

О

Вы можете легко создать и добавить кнопку «Поделиться» из социальных плагинов LINE на выбранный вами веб-сайт. Если вы хотите добавить это в нативные приложения iOS или Android, мы рекомендуем вам использовать экран «Поделиться с». Дополнительные сведения о том, как добавить этот экран, см. на странице «Использование функций LINE со схемой URL-адресов LINE».

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

Использование официальных значков LINE

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

1. Выберите язык Выберите язык веб-сайта, на который вы хотите добавить кнопку. Кнопка будет создана на выбранном языке.

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

3. Тип кнопки Выберите дизайн для кнопки «Поделиться».

4. Размер

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

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

Я согласен с правилами использования социальных плагинов LINE.

Использование пользовательских значков

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

Я согласен с правилами использования социальных плагинов LINE.

Совет

Пример (URL: https://line.me/en)

https://social-plugins.line.me/lineit/share?url=https%3A%2F%2Fline.me%2Fen

После создания дерева DOM и создания содержимого на вашем сайте вызовите LineIt.loadButton() , чтобы активировать кнопку «Поделиться».

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

HTTP-запрос

GET https://api.line.me/social-plugin/metrics?url=https://line.me/en

Параметры запроса

url ​​

String

900 04 Обязательно

URL-адрес, для которого нужно получить количество общих ресурсов.
(например: https://line.me/en)

Пример запроса
Пример ответа
Коды состояния

Запрос выполнен успешно.

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

Ваш адрес email не будет опубликован. Обязательные поля помечены *