Привет!
К нам в съемную тайскую квартиру приехали гости, так здорово повидать земляков, когда находишься вдали от дома.

Сегодня хочу вам рассказать про основные виджеты ВКонтакте, которые можно внедрить на свой блог. Виджеты – это небольшие программы, каждая из которых выполняют одну определенную функцию на сайте, на мобильном устройстве, в браузере и т.д. Это может быть кнопка, окно, меню, подсказка и прочее.
На сайте разместить виджет можно с помощью html-кода. Отдельную нишу занимают социальные виджеты. А поскольку сегодня одной из наиболее популярных социальных сетей в Рунете является ВКонтакте, узнаем, какие ее инструменты мы можем задействовать на своих блогах.

Виджеты Вконтакте для WordPress

Код всех доступных ВКонтакте-виджетов есть в разделе «Разработчики». Попасть в него можно по ссылке vk.com/dev/sites . Всего есть девять типов виджетов:

• «Комментарии»
• «Запись на стене»
• «Сообщества»
• «Мне нравится»
• «Рекомендации»
• «Опросы»
• «Авторизация»
• «Публикация ссылок»
• «Подписаться на автора».

Рассмотрим каждый из них подробнее.

Виджет комментариев Вконтакте для сайта

Заполните форму: введите название и адрес сайта (основной домен подставится автоматически); выберите тематику блога, количество комментариев, которые будут отображаться. Если число комментов превысит указанное вами, все их можно будет увидеть, нажав на кнопку «Предыдущие записи».

В пункте “Медиа” вы можете выбрать то, что пользователи смогут прикреплять к своим комментариям. Например, с такими настройками, как на ниже пользователи смогут писать текстовые комментарии, прикрепляя к ним граффити и ссылки:

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

Запись на стене

Этот виджет создан для того, чтобы вы могли процитировать слова другого человека, которые он написал в записи ВКонтакте. Если вы вставите цитату через этот виджет, ваши читатели удостоверятся, что информация приведена из первоисточника.

Как установить виджет группы ВКонтакте

Добавить группу ВКонтакте на сайт можно с помощью специального виджета. Вставьте ссылку на группу или публичную страницу вашего сайта; выберите, что будет отображаться — миниатюры аватарок участников, последние новости или только название сообщества. Задайте ширину и высоту виджета в пикселях, настройте виджет сообщества ВКонтакте под дизайн своего сайта и добавьте полученный код на сайт.

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

Этот виджет не будет работать без кнопки “Мне нравится”, потому что он показывает вашим посетителям статьи, которые получили больше всего лайков. Он позволит вам понимать, какие статьи больше всего нравятся аудитории, а пользователи смогут читать самые интересные тексты, попавшие в блок “Популярное”.

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

У кода этого виджета тоже есть две части, как и у комментариев. Первую из них добавьте в файл header.php, а вторую в нужное вам место на сайте.

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

Заполните по аналогии с предыдущими виджетами первую часть формы.

Задайте вопрос и варианты ответа. Добавлять новые можно при помощи “добавить” (расположена под “Варианты ответа”).

В коде этого виджета также есть две части, разделённые HTML-комментариями.

Нередко пользователи не хотят тратить время на регистрацию. Этот виджет позволит добавить на сайт авторизацию через аккаунт ВКонтакте. Пользователю не придется регистрироваться: он просто зайдет на сайт через свой профиль ВКонтакте. По поводу авторизации у ВКонтакте есть хорошая инструкция по ссылке vk.com/dev/Auth .

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

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

Виджет ВКонтакте для WordPress

Общие правила для того, чтобы вставить виджет Вконтакте на сайт:

• Код необходимо вставлять в ту часть темы, где вы хотите видеть виджет. Это может быть файл header.php, single.php, sidebar.php и т.д. в зависимости от функции виджета и дизайна вашего сайта. Подробнее об этих файлах читайте в статье о том, . Если код делится две части, первую из них нужно добавить перед закрывающимся тегом в файле header.php.
• Кроме того, если вам приглянулся какой-то виджет ВКонтакте, его можно добавить в админке блога (“Виджеты”).
• Если вы решили добавить сразу несколько виджетов на сайт, то обратите внимание, что во многих из них есть строка кода

  Достаточно вставить ее один раз, не нужно дублировать.

Если у вас остались вопросы по работе с виджетами Вконтакте, посмотрите видео:

P.S. Наши старые подруги приехали навестить нас в Районге. Дальше им предстоит долгое путешествие через пол-Таиланда и Лаоса автостопом с ночевками по каучсерфингу и в буддистских монастырях. Меня восхищают бюджетные путешествия, но они требуют очень много сил и энергии.

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

Итак, для начала что бы сделать виджет группы Вконтакте WordPress у вас должна быть эта самая группа, я думаю с этим все ясно. , было изучено ранее. Что нам даст группа социальной сети на нашей странице? Ну во первых это придаст жизни вашей странице, во вторых это полезно при продвижении сайта, и наконец это принесет вам дополнительный трафик на ваш ресурс в интернете.

Как установить виджет сообщества Вконтакте?

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

Прочитав сие написание приходим к выводу что данный виджет будет нам полезен поэтому продолжим рассматривать сами настройки. Разобьем форму на несколько пунктов и разберем каждый из них по отдельности.

Настройки виджета сообщества Вконтакте:

1. Придуманная вами ранее ссылка, она индивидуальна для каждой группы, при переходе в ваше сообщество, ссылку можно легко скопировать с адресной строки браузера, и забиваем ее именно в поле №1.
2. Что будет отображаться на вашем сайте в виджете группы. Предпочтительнее это будут люди подписанные на нее но тут решать только вам.
3. Размер рамки виджета отображаемый на вашем сайте, ширину нужно подбирать в зависимости от ширины вашего сайт бара или места расположения кода.
4. Настройки цветов, по умолчанию стоят настройки присущее социальной сети Вконтакте, вы же можете поексперементировать с ними самостоятельно.
5. При редактировании каждого из выше перечисленных полей код для вставки будет автоматически корректироваться под ваши нужды.
6. Точная картинка которая будет у вас на сайте после вставки кода виджета группы.

Немного поигравшись с настройками вы выберите для себя подходящий именно вам.

Как вставить виджет группы Вконтакте WordPress

Определившись с дизайном вашего виджета, переходим непосредственно к вставке кода на страницы вашего сайта.

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

Добрый день дорогие друзья. Каждый день на ваш блог заходит десяток посетителей, а не которым из них привычней и удобней оставить комментарий через социальную сеть. Но увы на вашем блоге не встроен виджет комментариев вконтакте wordpress . И так вы теряете драгоценные комментарии, которые не слабо подбадривают и в трудные времена, не так ли?) И сегодня я расскажу вам как вставить в свой блог , об этом в Интернете на самом деле много написано, но как-то не очень подробно и я решил исправить ситуацию, кстати раз мы так задели тему SMO, то советую вам прочитать мою статью “ “

Давайте проведём небольшой анализ и подумаем, почему вам нужно поставить на ваш блог wordpress комментарии вконтакте:

А теперь давайте перейдём к практическим действиям и установим на свой wordpress блог комментарии вконтакте. Кстати хочу сообщить вам, что на блоге моего друга проходит довольно интересный конкурс “Зачем я веду свой блог? ” Спешите принять участие и перед тем как я начну не забудь подписаться на обновления моего блога .

Установка комментариев вконтакте на wordpress – Этап № 1

Заходим в раздел разработчиков данной социальной сети в футере сайта есть ссылка разработчикам или можете пройти по данной ссылке .
И нажимаем в правом верхнем углу длинную синею кнопку подключить сайт.

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


Далее в появившемся окне введите название для виджета в произвольной форме, его описание и группу если такова иметься. В графе open ApI повторите ввод адреса своего сайта.

Установка комментариев вконтакте на wordpress блог – Этап № 2

Следующим нашим шагом будет уже сама установка комментариев вконтакте на ваш wordpress блог.
Значит проходим во данной ссылке или заходим вконтакт и в нижним меню жмём ссылку разработчикам, далее вы увидите три больших колонки на сверху одни из них будет называется Документация. Жмём её и в графе Для сайтов нажимаете ссылку Comments.

Попав на страницу вы будете лицезреть данную форму:

Теперь по порядку. В графе сайт выбираете название своего Api которое мы создали в прошлом этапе. Вывод количества комментариев выбираете на ваш вкус и цвет. Поставив галочку Медиа, тем самым вы активируете функцию оставлять в форме комментариев не только комментарии (прошу прощение за масло масленое;)), но и фото, видео, граффити.
Ширина можете оставить по умолчанию, позже всё равно подберете нужный размер.

Теперь давайте разбираться с кодом, куда и как его вставлять.

Первые две части кода вам необходимо вставить в админке блога в файл header.php между тэгами

Меня многие просили подготовить материал о том как добавить комментарии от социальных сетей Вконтакте и Фейсбук на сайт созданный на движке WordPress. И вот наконец-то я выбрал время и подготовил эту статью. Сразу хочу отметить, что у вас должны быть аккаунты в обеих социальных сетях, если их нет, то сначала зарегистрируйтесь.

Итак, приступим.

Комментарии будем добавлять при помощи специального плагина, который называется Vkontakte API. Также этот плагин позволяет добавить на сайт кнопки социальных сетей. Для установки плагина переходим в консоли управления сайтом в пункт меню «Плагины» и нажимаем кнопку «Добавить новый».

После этого прописываем в поисковой строке название плагина — Vkontakte API и нажимаем клавишу Enter на клавиатуре. Находим наш плагин и жмем кнопку «Установить»

После того как плагин установится, нажимаем по ссылке «Активировать плагин». Теперь нам нужно его настроить.

Настройки плагина

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

Вконтакте

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

Здесь нам нужно указать название нашего приложения и выбрать тип «Веб-сайт». Название можете указывать любое — его никто кроме вас не увидит. После этого нужно указать адрес нашего сайта и базовый домен, т.е. тот же адрес только без протокола http://. После того как заполнили все пункты, нажимаем кнопку «Подключить сайт»

После этого появится всплывающее окошко с просьбой подтвердить ваши действия при помощи бесплатного сообщения на телефон. Нажимаем кнопку «Получить код» и ожидаем смс. Обычно код приходит в течение нескольких секунд.

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

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

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

Какую из кнопок ставить решать вам, можно поставить сразу обе кнопки.

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

Facebook

Теперь переходим на вкладку с настройками социальной сети фейсбук. Здесь настроек меньше, но также нужно создать приложение, чтобы у нас работали комментарии от 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. Если у вас остались вопросы или что-то было непонятно, пишите в комментариях что именно не получилось, я постараюсь вам помочь.

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

WordPress комментарии вконтакте без плагина

Что бы установить WordPress комментарии вконтакте на сайт, нужно сначала перейти на и заполнить поля для редактирования скрипта. Можете убрать галочку с медиа, что бы пользователи не могли выкладывать видео и картинки. Выводить более 15 комментариев не советую. Ширина у виджета стоит стандартная 496, поставив на сайт, можете изменить на «auto» что бы виджет лёг на всю ширину комментариев и был гибким.По картинке видно, какую часть, в какой файл нужно вставлять. Первую часть устанавливаем в header.php перед закрывающимся тегом Вторую часть, которая большая, ставим в файл single.php. Если хотите, что бы комментарии вконтакте выводились до wordpress комментариев, то находите строчку вывода комментариев php comments и ставите перед ней, как на картинке ниже. Если нужен виджет ниже, то ставите после.
Это был трудный способ, как сделать wordpress комментарии вконтакте, а теперь пора узнать простой способ.

wordpress плагин комментарии вконтакте

Плагин Vkontakte api

Вот весь функционал:

Но нас сейчас интересует именно комментарии вконтакте. После установки плагина, у вас появится Vkontakte api в закладках. Там нажимаем раздел Вконтакте и переходим по ссылке, что бы сделать приложение.
После того как перешли, следует заполнить необходимые поля, обязательно выберите для веб сайта. Вам придет смс на телефон с подтверждением, после чего будет создано приложение. После этого можете даже не настраивать приложение, а сразу перейти на вкладку настройка и первые 2 строчки нам необходимо скопировать для плагина vkontakte api.
Копируем строчки и расставляем их в плагине, после этого он начнёт работать. Находим настройку комментариев и ставим нужные настройки. Вот мои настройки:
Поздравляю, комментарии вконтакте установлены на сайт! Советую сначала постараться поставить wordpress комментарии вконтакте без плагина, что бы не нагружать сайт лишним. Если же не удобно, то используйте плагин vkontakte api, который здорово помогает не только с комментариями.