WordPress >

Добавить кнопку Вконтакте «Мне нравится» для сайта (Поделиться, Сохранить)

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

Думаю вам будет интересно почитать мою конкурсную статью «Продвижение неизбежно«.

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

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

Можете почитать Как добавить Кнопку Facebook «Мне нравится»


Еще одна статья по установке кнопок: Как установить кнопку Twitter

Четвертая (включая данную) статью про установки кнопок: Установка кнопки google +1.

Советую почитать статью о заработке на постовых в RotaPost.

А так же поучаствовать в моей акции — Обзор блога каждому.

кнопка вконтакте мне нравится

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

Способов много, но на вкус и цвет… Я обычно вижу использование набора кнопок соц закладок и кнопка Вконтакте «Мне нравится» вынесена еще отдельно  — бывает и такое.

Использование виджета Вконтакте:

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


Видим перед собой блок, в котором необходимо заполнить данные:

настройка виджета вконтактеЗаполняем поля «Название сайта», «Адрес сайта», «Основной домен сайта» (основной домен должен заполняться автоматически, когда вы будете заполнять адрес сайта). После этого нажимаем кнопку «Сохранить».  У вас должны пропасть строки заполнения данных и появиться вместо них одна «Сайт/приложение», где и будет ваш добавленный ресурс.

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

После этого полностью копируем «Код для вставки».

Открываем ваш файл single.php и ищем строчку <?php the_content(»); ?>


После этой строчки вписываем тег <p> — чтобы был отступ сверху кнопки, далее вставляем код кнопки («Код для вставки»), опять прописываем <p> — делая отступ снизу кнопки. Код виджета лучше занести в теги <noindex>код</noindex>, чтобы поисковик не индексировал код. После всего проделанного сохраняем и видим результат:

кнопка мне нравится вконтакте на блогеКнопка отображается и функционирует. Попробуйте ее в действии.

Установка своей кнопки «Мне нравится»:

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

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

Кнопка Вконтакте "Мне нравится"

Загружаем картинку к себе на хостинг в папку images в папке с шаблоном (темой). У меня путь до папки выглядит так:

http://blognat.ru/wp-content/themes/Krem_Jam/kremjam/images/me_in_vkontakte.png

Следующий шаг. Заходим в файл single.php и ищем место куда вставить кнопку. Я рекомендую ставить кнопку в конце поста. Как и в прошлом варианте, ставим указанный ниже код после <?php the_content(»); ?>

<a rel="nofollow" target="_blank" href="http://vkontakte.ru/share.php?url=<?php the_permalink(); ?>" ><img src="<?php bloginfo('template_url'); ?>/images/me_in_vkontakte.png"  title="Поделиться ВКонтакте" alt="Поделиться ВКонтакте" /></a>


В данном коде необходимо поменять только название картинки, если оно отличается от моего (me_in_vkontakte.png)
Сохраняем и проверяем работу кнопки:

Вконтакте своя кнопка
Используя данный вариант, нажимая на кнопку «Вконтакте», пользователя будет перенаправлять на страницу публикации ссылки, где он может указать «Заголовок ссылки», указать, надо ли показывать изображение (если изображений в статье несколько, то какое из них),  можно сразу же откомментировать данную ссылку, а так же указать галками, куда отправлять сслыку: на стену и (или) в заметки. выглядит эта страница так:

страница настройки публикации ссылки

Кстати, для собственных кнопок я советую устанавливать затемнение фон с помощью css стилей. Стили можно применять и к других изображениям, думаю материал будет полезен: Затемнение фона через css.

Установка плагина кнопки Вконтакте:

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

Самый распространенный плагин, для установки отдельной кнопки вконтакте, является плагин VKontakte Share Button, скачиваем его по этой ссылке: Скачать плагин Vkontakte Share Button
Устанавливаем плагин стандартным способом и активируем его.
Заходим в настройки. Плагин полностью русифицирован, так что вам не составит труда настроить его:
настройки плагина Vkontakte Button

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

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

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

Как и обещал «Ленину» ссылка на его seo блог, за подсказку немного заработать на оплату хостинга на сервисе Nolix.ru. Заработать можно и с не очень посещаемого блога.

Блогнат. Учебник блоггера.


Читать ещё:

Комментирование закрыто.