Как установить кнопку Поделиться vk на ваш сайта

Кнопка “Поделиться ВКонтакте” позволяет увеличить количество переходов с этой социальной сети, конечно при условии, если ваши статьи интересные, и ими будут делиться VK. Как установить кнопку читайте далее…
Ранее я уже публиковала пост о том, как установить комментарии ВКонтакте на blogspot, но многие читатели интересуются, как же установить кнопку “Поделиться ВКонтакте”. Умение создания кнопки ВКонтакте пригодиться вам при создании скрипта Заплати лайком.

Полезно! Если вы являетесь активным пользователем ВКонтакте, то здесь https://statuso.ru/vlyublen/ вы найдете большое количество цитат и афоризмов для вашей странички.   Статусы разделен по категориям, есть рейтинг по популярности.

Рассмотрим несколько способов:

Первый способ от разработчиков vk

• Переходим на страницу Виджеты ВКонтакте
• Если у вас уже добавлен блог ВКонтакте (если вы уже создавали для него приложение раньше, например, ставили виджет комментарии ВКонтакте), то выберите его из списка. В противном случае добавьте новый сайт:
  
• Подключаем новый сайт:
  
• Теперь осталось настроить кнопку – определиться с размером кнопки, выбрать вариант из предложенных и название кнопки.

Примечание. Если вы используете несколько кнопок “Поделиться ВКонтакте” (например, одна в записи, а другая - в сайдбаре), то вам нужно сделать разные id в коде (меняем отрезок кода, выделенный желтым):

<div id="vk_like"></div>
<script type="text/javascript">
VK.Widgets.Like('vk_like');
</script>

Второй способ создания кнопки vk:
Вставляем следующий код в любое место блога

<a href='https://vkontakte.ru/share.php?url=Ссылка' target='_blank'><img src='https://img-fotki.yandex.ru/get/6440/40839264.b/0_92085_e23512a0_XS.gif' border='0' width='32' height='32' alt='Как установить кнопку Поделиться vk на ваш сайта' title='Поделиться ВКонтакте'></a>

Посмотреть работу кнопки:
 
Как изменить картинку кнопки?
Для этого, вам нужно изменить ссылку на изображение (выделена желтым в коде выше).
Как установить кнопку ВKонтакте на Blogspot

Если вы выбрали первый способ содания кнопки вконтакте, то часть кода, которая расположена после </head> , нужно вставить в перед тегом
в шаблоне HTML блога (админпанель -> Шаблона блога -> Изменить html -> Находим и вставляем код </head&gt , который выделен на скриншоте красным. Вторую часть кода вставляем туда, где вы хотите вставить "мне нравиться". Об этом читайте далее.
1. В сайдбар (боковую колонку) можно установить посредством гаджета HTML / Javascript. Админ панель –> вкладка Дизайн –> Добавить элемент –> HTML / Javascript (сюда вставляем код),
2. В начало каждой записи. Админпанель –> вкладка “Шаблон” –> Изменить html –> Расширить шаблон виджета –> Находим код <data:post.body/> вставляем перед ним код кнопки vk.
3. После каждой записи блога. В шаблоне html блога находим строчку <div class='post-footer'> и вставляем код после него.
4. Если вы установили кнопку в начало или конец записи блога и не хотите, чтобы она отображалась на главной, а была видна только на странице записи, то заключите код кнопки между тегами <b:if cond='data:blog.pageType == &quot;item&quot;'> и </b:if>. Рекомендую использовать это условие, при котором вы прячете кнопку с главной страницы, так как во-первых, в этом случае кнопка работает более корректно, а во-вторых, удобнее для пользователя.