Плагин ВКонтакте WordPress: виджет, коментарии и социльные кнопки VKontakte. Добавляем виджет комментариев Вконтакте (VK) для WordPress Wordpress вконтакте
Всем привет! В настоящий момент социальные сети переживают настоящим бум популярности. Практически все пользователи интернета имеют свою страничкой в одной или нескольких социальных сетях. Какие из них самые популярные? На ум сразу приходят VKontakte и Facebook. Сегодня я вам рассказу о плагине ВКонтакте WordPress, которые добавляют на блог комментарии ВК, социальные кнопки и виджеты.
Для работы плагина необходимо иметь аккаунт ВК. Сам плагин устанавливается стандартно:
После активации будет создан отдельный пункт в меня админки WordPress — Vkontakte API. Рассмотрим представленные в нем настройки.
Первое с чего следует начать — это создать новое приложение в ВК.
Порядок действия следующий:
На следующей странице вводим адрес сайта (в формате http://vash_sayt.ru) и базовый домен (vash_sayt.ru). При желании можно добавить иконку и фото загрузить. Сохраняем изменения. Теперь копируем с этой же страницы ID приложения и Защищенный ключ и вставляем в настройки плагина Vkontakte API.
Плагин русский, поэтому и все его настройки на русском языке. Не буду разбирать каждую опцию, просто дам свои пояснения.
Комментарии.
Плагин автоматически добавляет в WordPress комментарии ВКонтакте, никого дополнительного кода никуда вставлять не надо. Стандартные комментарии WordPress при этом так же работают, но их можно отключить, поставив галочку напротив «Убрать комметарии WordPress-а».
Медиа в комментариях.
Какие медиа файлы могут добавляться к комментарию. Обратите внимание на пункт Ссылки, который я бы отключил, чтобы меньше спама было.
Кнопка «Мне нравится».
Добавить иконку «Мне нравится» на блог и настроить ее расположение. Отличная функция, позволяющая читателем рассказать о вашем блоге своим друзьям.
Еще одна иконка от VKontakte.
Facebook Like button.
Если вы пользуетесь WordPress, то вероятнее всего вам надоели стандартные комментарии, так как они не очень удобные и скорее всего вам приходит куча спама. Конечно есть куча плагинов, чтобы избавиться от спама, но иногда хочется попробовать какую-то новую систем комментариев. В этой записи, я расскажу как поставить комментарии ВКонтакте на WordPress, а так же покажу плагин, который сделает всю работу за вас.
ВведениеВ этой записи я рассмотрю два способа:
Детальная установка плагинов описана под заголовком ниже, лишь в данном случае вводите «AnyComment» в поиске для установки этого плагина.
Плагин для VK комментариевДавайте установить плагин комментариев ВКонтакте напрямую через панель администратора.
Инструкция к установке:
Это мой личный плагин и я буду вам благодарен если вы оставите хороший отзыв или «5 звезд»:)
Функции- Полностью заменить комментарии от WordPress на ВК
- Поставить виджет VK комментариев вместе с обычными комментариями. В этой случае, вы можете установить позицию виджета, «выше», «ниже» стандартных комментариев или «под заголовком».
- Просмотр всех комментариев оставленных пользователями через VK виджет в админ центре
- Все настройки которые есть у VK виджета комментариев, есть в админке
- Предварительный просмотр виджета комментариев прямо под настройками
- Заходим на страницу с виджетами и выбираем «Комментарии» (или кликните ).
- В выпадающем списке «Сайт/приложение» выбираете «Подключить новый сайт» или выбираете текущий сайт (если вы уже добавляли). При добавлении вам нужно указать «название сайта», «адрес», «основной домен» и выбрать тематику..ru», «сайт» и «ИТ (компьютеры и софт».
- Далее выбираем «Количество комментариев» для отображения. Если вы выберете, например, пять комментариев, а у вас уже добавлено больше, то сначала при загрузке страницы покажется 5 комментарием и далее вы можете нажать нажать «Показать еще», чтобы подгрузить остальные.
- Выбираем нужно вам «Медиа» или нет. Это например добавление граффити, фото, аудио видео и ссылки.
- Устанавливаете ширину блока комментариев.
Мы не будем просто вставлять код, так как это не правильно. Я покажу вам как это делать в стиле WordPress.
Добавляем код виджета VKУ вас должен быть код, который выглядит примерно следующим образом.
VK.init({apiId: XXXXXXX, onlyWidgets: true});
Как вы можете заметить, он разделен на 2 части.
Первая — это скрипты (строки 1-6), которые вам нужно подгрузить для отображения комментариев. Вместе «XXXXXXX» у вас будет отображаться уникальный номер вашего сайта.
Вторая — это часть кода, которая понадобится для отображения комментариев.
Создаем функцию в functions.php- Копируем функцию, которая находится ниже и открываем файл functions.php, который находится внутри вашей темы.
- Спускаемся в самый низ файла и добавляем следующую функцию.
Внимание! Вместо «ВАШ_ID» пишите ID который написан в вашем коде для вставки.
Function vk_comments_api() { if(is_single()) { echo ""; echo " VK.init({apiId: ВАШ_ID, onlyWidgets: true}); "; } } add_action("wp_head", "vk_comments_api");
В этой коде я добавил два скрипта в вашего WordPress сайта. Но я не просто их добавил. Я сделал условие, которые добавит скрипты только в том случае, если запись открыта полностью. А зачем нам нужно грузит сайт лишними скриптами? Верно?
Добавляем комментарии в comments.phpПеред этой строчкой вставляем вторую часть нашего кода, которая выглядит следующим образом:
VK.Widgets.Comments("vk_comments", {limit: 10, width: "665", attach: "*"});
И все готово! Комментарии должны быть успешно установлены.
Если у вас какие-то проблемы — пишите их в комментарии ниже к этой записи, буду рад помочь.
ВыводПодключение комментариев от контакта не такой сложный процесс как вам скорее всего это казалось. Это все занимает не больше пяти минут.
Подключенные комментарии Вконтакте на вашем блоге или сайте являются неплохим инструментом, источником для получения дополнительного трафика. Посетитель прокомментирует вашу запись через виджет или плагин комментариев от Вконтакте и оставит птичку не тронутой, его комментарий появится на его стене.
Этот факт не останется без внимания его друзей, у которых возможно после посещения вашего сайта сложится противоположное мнение или совпадающее и пойдет диалог…
Положительные факторы от добавления комментариев Вконтакте
1. Существенное пополнение посетителей переходящих из социальной сети Вконтакте на ваш сайт. Заметно ощущается уже в течении первых месяцев после установки формы. А в чем причина? В этой форме установлена по умолчанию птичка на «Отобразить на Вашей странице»:
Многие на нее вообще внимания не обращают, она остается и количество ссылок на ваш сайт растет, а по ним приходят новые посетители из Вконтакте, и даже могут записи к себе на стену.
2. Растет количество комментариев. Процесс комментирования через форму разработанную WordPress сложноват, такие комментарии должны пройти через процедуру модерации вручную, проще это осуществить через форму ввода комментариев Вконтакте (нет необходимости набирать ни имения ни почты), а комментарий появляется как говорится «в один клик, их становиться чем раньше. Количество желающих, чтобы вы добавили их в друзья. Выгоды от этого факта объяснять не надо.
4. Возможность проработать комментарии на вкладке «администрирование», где можно кое что нежелательное просто ликвидировать
Отрицательные факторы от добавления комментариев Вконтакте на WordPress
1. Дополнительная нагрузка в связи с необходимостью лично проревизировать и ответить на комментарии вконтакте, а для этого надо регулярно заходить на конкретные статьи своего сайта или же делать это через администрирование. Любишь кататься люби и саночки возить. Ранее ответы осуществлялись из панели администратора WordPress.
2. Вконтакте комменты не синхронизируются с базой данных на сайте. Все комменты – их собственность.
Как добавить комментарии вконтакте в WordPressДобавить комментарии Вконтакте в WordPress можно используя виджет или плагин
через виджет , пошагово:
3-й шаг Для установки комментариев кликаем и переходим к коду виджета от Вконтакте.
4-й шаг На странице генерации кода для вашего сайта, заполняем небольшую форму. Указываете, название сайта, домен, сколько выводить комментариев, расширенную версию комментариев и ширину блока. Далее нажимаем «Сохранить», вводим каптчу. После сохранения, сформируется код для вставки на сайт комментариев от Вконтакте.
5-й шаг Код состоит из двух частей. Одну часть копируем и вставляем в файл header.php перед закрывающим тегом .
6-й шаг Вторую часть кода копируем и вставляем в файл single.php перед
Сохраняем файл, идем на страницу блога или сайта и видим, что комментарии от Вконтакте подключены.
Инструкция по добавлению комментариев Вконтакте в WordPress через плагин , пошагово:1-й шаг Заходим в админпанель на своем сайте в WordPress, выбираем в меню «Плагины» à «Добавить новый»à набираем vkontakte api «Поиск плагинов»Находим плагин и кликаем «Установить»
2-й шаг После успешной установки выбираем «Активировать плагин»
3-й шаг Переходим к настройкам плагина
4-й шаг В связи с отсутствием у нас ID и защищенного ключа идем по ссылке
5-й шаг
В открывшемся окне создаем приложение, кликая «Перейти к загрузке
приложения» предварительно введя его название и описание
6-й шаг
В следующем открывшемся окне вводим полученный код, пришедший на ваш
сотовый телефон буквально менее чем через 30 секунд, и жмем «Отправить»
7-й шаг
В открывшемся окне копируем ID и защищенный ключ и вставляем их в
соответствующие поля в окне открытом на 6-м шаге. Возвращаемся в это окно и заполнив
адрес сайта и базовый домен жмем на «Сохранить изменения»
8-й шаг В настройках плагина ставим птичку на «Первыми показывать комментарии Vkontakte» , настраиваем кнопки и другие полезности и жмем «Сохранить настройки»
Обновляем кэш выйдя и снова зайдя на свой сайт, пользуемся полезной функцией. Итак, мы рассмотрели две методики того Как добавить комментарии Вконтакте в WordPress. Не знаю куда уж подробней, но может видео тоже будет полезным. Кстати, еще посмотрите другие блогов, не ограничивайтесь одним лишь VK!
Что не говорите, но в последнее время активность использования различных кнопок добавления постов блога в социальные сети возросла. Идея и доступность данного метода, как мне кажется, намного лучше различных сервисов социальных закладок из которых в рунете большая часть была просто «неживые». Пара-тройка топовых закладочных социалок еще как-то могла существовать и размещаться на страницах блога, но то множество кнопочек и вариантов, которые предоставляли разные сервисы было ни к чему. Сейчас это, пожалуй, можно сравнить с Google Buzz — новый сервис начали использовать многие, на данный момент он вроде как не работает (да и работал ли?), но соответствующая иконка все еще размещается на многих проектах. А вот если говорить о твиттере, фэйсбуке и вконтакте — тут совсем другая история.
Вообще для создание кнопки вконтакте (как и некоторых других) есть несколько вариантов решений, но недавно нашел еще парочку интересных wordpress плагинов, которыми с вами и поделюсь. Но для начала немного теории и «повторения пройденного материала».
1. Первый вариант для кнопки вконтакте — использование картинок и кода от сервиса. Для добавления используется простой стандартный код:
При изменении его «под себя» обратить внимание на ссылку на изображение vkontakte.gif, которое должно находится в папке шаблона, директории images. Стандартную кнопку, которую вы видите в самом конце статьи данного блога, можно менять на любую другую. Также не забывайте указать ее ширину и высоту через width и height. Плюс варианта в его элементарности, тут даже особо в коде не нужно разбираться, можно добавить «как есть.»
2.
Вариант два — добавление кнопки с помощью . Модуль достаточно прост в установке и позволяет отображаться количество воспользовавшихся им пользователей. В общем, небольшой интерактив, а также некоторые интересные возможности при настройке.
На данном этапе я использую именно этот вариант и мне нравится.
3. Плагины для обычной кнопки вконтакте и других социальных сетей. Некоторое время назад я опубликовал подборку , где к сожалению, не было вконтакте, но были представлены популярных забугорные сервисы и весьма оригинальная их подача в блоге.
Теоретически вы могли бы залезть в код плагина и с помощью знаний из первого варианта заменить какой-то ненужный буржуйский сервис на социальную сеть вконтакте. Но я решил поискать уже готовые варианты. Как на зло плагинов оказалось немало, но большая их часть совершенно бесполезные и унылые. В итоге выбрал лишь два достойный кандидата (притом, что мне нужно было еще одно дополнительное условие).
Social Share Buttons for WordPress
Плагин заточен чисто под рунет, так как содержится самые популярные у нас социальные сети — вконтакте, одноклассники, мой мир, livejournal, фэйсбук и твиттер. Если я правильно, то он чем-то аналогичен VK Share Button либо точнее будет сказать, включает в себя его функциональность. Вы можете выбирать разные варианты отображения кнопок, а также задавать некоторые настройки для каждой из них. Есть возможность сортировки кнопок, выбора некоторых из них.
Самый большой недостаток плагина, по сути, его ограниченность только популярными рунетовскими социальными сетями, что не всегда оправдано. А мне как раз нужно было добавить на сайте кроме вконтакта еще и LinkedIn. Перерыл, признаюсь, очень много плагинов пока не нашел супер крутой и полезный Share and Follow.
— это самый крутой плагин с кнопками социальных закладок, который я только встречал. Здесь очень много возможностей и столько же настроек. Установка и начало работы происходит достаточно быстро — скачайте плагин, активируйте в амдинке и укажите в разделе Share and Follow какие именно кнопки вам нужны. Они сразу же отобразятся на страницах блога.
После этого можно приступать к подробной настройке — можно выбрать размер кнопок, множество различных социальных сервисов, а также общие возможности (RSS, email, версия для печати). Этот же плагин добавлять элемент фолловинга сбоку от полосы прокрутки а также имеет множество других опций. Есть платные возможности, но бесплатных и без них хватает с головой. Предлагаю глянуть небольшое видео по использованию Share and Follow:
Возможно, в будущем рассмотрю модуль Share and Follow более подробно, но вы можете меня не ждать и сами исследовать его. Самое главное, что он идеально подходит как для рунета, так и англоязычных сайтов — список социальных сервисов более чем достаточен. Установка быстрая и простая, короче говоря, Share and Follow должен быть в архиве любого разработчика сайтов /блогов на wordpress.
P.S. Кстати, о социальных сетях возможно вам пригодятся статусы про жизнь для вконтакте, которые можно себе установить очень просто.
В жизни есть несколько основных психологических аспектов как например саморазвитие личности которые позволяют достигать больших успехов и результатов.
Вы можете немного подправить зрение без очков одев контактные линзы на работу или учебу, закажите их в интернете.
Меня многие просили подготовить материал о том как добавить комментарии от социальных сетей Вконтакте и Фейсбук на сайт созданный на движке WordPress. И вот наконец-то я выбрал время и подготовил эту статью. Сразу хочу отметить, что у вас должны быть аккаунты в обеих социальных сетях, если их нет, то сначала зарегистрируйтесь.
Итак, приступим.
Комментарии будем добавлять при помощи специального плагина, который называется Vkontakte API. Также этот плагин позволяет добавить на сайт кнопки социальных сетей. Для установки плагина переходим в консоли управления сайтом в пункт меню «Плагины» и нажимаем кнопку «Добавить новый».
После этого прописываем в поисковой строке название плагина — Vkontakte API и нажимаем клавишу Enter на клавиатуре. Находим наш плагин и жмем кнопку «Установить»
После того как плагин установится, нажимаем по ссылке «Активировать плагин». Теперь нам нужно его настроить.
Настройки плагинаПосле установки плагина в меню консоли управления сайтом появился новый пункт «Vkontakte API», переходим в него. Перед нами панель настроек. В данной панели 4 вкладки, разберем их по порядку.
Если мы перейдем во вкладку Вконтакте, то первым делом нас просят указать ID приложения и Защищенный ключ. Дело в том, что для взаимодействия с социальными сетями, как правило, необходимо создавать приложение. Делается это очень просто. Над полями с ID и ключом есть небольшая подсказка, в которой указана ссылка, переходите по этой ссылке
Здесь нам нужно указать название нашего приложения и выбрать тип «Веб-сайт». Название можете указывать любое — его никто кроме вас не увидит. После этого нужно указать адрес нашего сайта и базовый домен, т.е. тот же адрес только без протокола http://. После того как заполнили все пункты, нажимаем кнопку «Подключить сайт»
После этого появится всплывающее окошко с просьбой подтвердить ваши действия при помощи бесплатного сообщения на телефон. Нажимаем кнопку «Получить код» и ожидаем смс. Обычно код приходит в течение нескольких секунд.
Вводим полученный код и жмем кнопку «Отправить код». Все, наше приложение создано! Вот так легко и просто. Никаких настроек здесь делать больше не нужно, просто переходим на вкладку «Настройки» и видим здесь ID приложения и Защищенный ключ, копируем их по очереди и вставляем в соответствующие поля в настройках нашего плагина.
Далее идет блок «Вход» — эта функция позволяет вашим посетителям регистрироваться на сайте через социальную сеть вконтакте. Я лично регистрацию на своем сайте не ставил, но возможно для кого-то эта функция будет полезна.
Следующий блок настроек касается кнопки «Мне нравится». Ниже скриншот, на котором показано как настроена данная кнопка у меня на сайте, можете настроить также или поиграться с настройками самостоятельно.
Какую из кнопок ставить решать вам, можно поставить сразу обе кнопки.
Далее идут настройки кросспостинга, но пока эта функция работает не до конца, и находится в beta тесте, поэтому пока их пропускаем. Спускаемся в самый низ и нажимаем кнопку «Сохранить настройки». Все, с настройками Вконтакте мы закончили, теперь можно перейти на сайт и посмотреть что у нас получилось в итоге.
Теперь переходим на вкладку с настройками социальной сети фейсбук. Здесь настроек меньше, но также нужно создать приложение, чтобы у нас работали комментарии от facebook. В самом начале также как в настройках комментариев от вконтакте есть ссылка на страницу, на которой мы можем создать приложение в фейсбук, переходим по ней.
Здесь может быть два варианта:
1. Если вы не привязывали номер мобильного телефона к facebook, то вам предложат указать номер телефона и подтвердить его через смс. К сожалению, я не могу показать эти настройки т.к. мой номер давно привязан к моему аккаунту, но там нет ничего сложного. Нужно просто указать номер, получить код по смс, ввести этот код и отправить. После этого у вас будет все как во втором варианте.
2. Ваш номер привязан и вы увидите следующую картинку:
Нажимаем по зеленой кнопке «Create a New App», нам откроется всплывающее окошко, в котором нам нужно заполнить некоторые поля (см. скриншот ниже):
1. Придумываем название для нашего приложения. Данное название будет видно только вам, пользователи его не увидят.
2. Придумываем Namespace. Честно говоря, я так и не понял для чего нужен этот пункт. Насколько я понял, это что-то вроде логина, вообщем, здесь нужно указать УНИКАЛЬНОЕ слово латинскими символами (не менее 6). В дальнейшем это слово нам не понадобится, поэтому можно просто указать набор букв — это не важно.
4. Жмем по кнопке «Создать приложение»
После этого появится всплывающее окошко, в котором нужно заполнить каптчу (ввести символы с картинки) и нажать «Ок».
Все, наше приложение создано. Никакие настройки больше делать не нужно, просто копируем ID приложения (App ID), возвращаемся к настройкам плагина и вставляем в соответствующее поле.
Следующим шагом нам нужно указать ID администратора, для того чтобы мы могли управлять комментариями. Чтобы получить ID админа, нужно перейти на свою страницу в facebook. Здесь тоже два варианта:
1. В адресе вашей страницы указаны цифры и выглядит он примерно так: http://facebook.com/100001117382458. Просто копируете эти цифры — это и есть ID администратора, т.е. ваш ID.
2. Адрес вашей страницы имеет примерно такой вид: https://www.facebook.com/OpekunAlex, т.е. вместо цифр указан буквенный логин, тогда вам нужно воспользоваться вот этим сервисом — http://findmyfbid.com
На этом настройки facebook закончены, можно перейти на сайт и посмотреть что у нас получилось.
Возвращаемся к настройкам плагина и переходим к следующей вкладке «Соц.кнопки». Здесь мы можем добавить кнопки от других социальных сетей: google+, twitter, mail.ru, одноклассники, яндекс кнопку.
Просто выставляете напротив нужной кнопки «Показывать», также как мы делали для кнопок Вконтакте и Фейсбук. Я обычно добавляю кнопки twitter и mail.ru с одноклассниками. После того как выбрали необходимые кнопки, не забудьте сохранить изменения. Если у вас есть твиттер, можете добавить свой аккаунт, тогда при нажатии на кнопку твиттера у ваших посетителей будет добавляться ссылка на ваш твиттер и если они твитнут ваш пост, то все их подписчики в твиттере увидят ссылку на ваш твиттер и возможно подпишутся. На этом здесь настройки закончены.
Оставшаяся вкладка «Остальное» нас не интересует. Т.о. образом мы с вами разобрались как добавить комментарии от социальных сетей Вконтакте и Фейсбук на сайт созданный на движке WordPress + узнали как добавить кнопки социальных сетей на сайт.
P.S. Если у вас остались вопросы или что-то было непонятно, пишите в комментариях что именно не получилось, я постараюсь вам помочь.