Categories: Уроки WordPress

Добавление кнопки поделиться Вконтакте в модуль Jetpack «Поделиться»

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

Ранее я подробно описывал все возможности Jetpack, так же попытался максимально раскрыть все варианты добавления кнопок поделиться на сайт. Однако один из моментов, который я упустил связан с Jetpack и отсутствием кнопки поделиться в ВК.

Сейчас мы это быстренько исправим, и добавим необходимую кнопку в свой блок.

Что нам нужно для добавления кнопки:

  • Установленный плагин Jetpack;
  • активированный модуль «Поделиться»;
  • картинка 16 на 16 пикселей;
  • 2 минуты вашего времени.

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

Инструкция по добавлению дополнительной кнопки поделиться в Jetpack
Шаг 1. Устанавливаем Jetpack и модуль «Поделиться»

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

Далее активируем модуль поделиться:

Установили, переходим к следующему шагу, редактирования модуля.

Шаг 2. Добавляем картинку на сайт

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

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

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

После этого переходим к дальнейшим действиям.

Шаг 3. Внесение изменений в модуль «Поделиться»

Для начала заходим в настройки модуля, это можно сделать со страницы Jetpack/Настройки/Поделиться. В правом нижнем углу жмем «Настроить»

В блоке настроек Кнопки «Поделиться» нажимаем на «Добавить новый сервис». Вносим следующие параметры:

  1. Название сервиса. Пишем «Вконтакте»;
  2. URL-адрес сервиса. Вписываем такое: https://vk.com/share.php?url=%post_url%
  3. URL-адрес иконки. Пишем адрес где находиться картинка, либо в папке с картинками шаблона, либо так как я описывал выше вписываем адрес загруженной картинки через «Медиафайлы».

В конечном счете у вас должно выйти такое:

После того как жмякнули на «Создать кнопку», закрываем это окно и перезагружаем страницу с настройками. У вас должен было появиться такое:

Эту кнопочку перетаскиваем вниз к выбранным ранее сервисам.

Шаг 4. Интерактивный предварительный просмотр и изменение стилей кнопок

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

Пришлось немного поэкспериментировать, и дать вам готовый вариант:

  • загружаем кнопку 16 на 16;
  • Делаем серым цветом (#777);
  • устанавливаем стиль кнопки в «Иконка + текст»;

Вышло у меня вот так:

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

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

admin2

View Comments

  • Для начала заходим в настройки модуля, это можно сделать со страницы Jetpack/Настройки/Поделиться. В правом нижнем углу жмем «Настроить»

Recent Posts

Почему лучше всего инвестировать в квартиры с двумя спальнями?

В сфере инвестиций в недвижимость выбор типа недвижимости может существенно повлиять на доходность и долгосрочную…

1 месяц ago

Майнинг в деревнях — Учебное пособие

1 000 000 человек уже занимаются ГОРЯЧИМ майнингом, и мы рады сообщить, что открываем новый…

1 месяц ago

Mine HOT: майнинг криптовалюты

NEAR Wallet — это мини-приложение в Telegram для хранения NEAR, USDT и добычи HOT. Майнинг…

2 месяца ago

Почему аренда коммерческой недвижимости в Энгельсе — ваша лучшая инвестиция

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

2 месяца ago

Покупка готового бизнеса в Костроме

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

3 месяца ago

Notcoin, как играть

Новый 2024 год в криптосообществе начался с ажиотажа по поводу новой игры и потенциально будущей…

4 месяца ago