Друзья привет!

Небольшой пост про то, как поставить к себе на сайт форму комментариев от социальной сети VKontakte. Установка формы для комментирования способствует продвижению и популярности вашего сайта, а если поставите форму от VK, то продвижение, посещаемость значительно улучшиться.

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

На своем блоге, я добавил форму как дополнительную к основной.

форма комментариев

 

Также у кого нет своего сайта, но он хочет чтобы была видна аватарка и смогли перейти на его страницу в социальной сети VKontakte, то необходимо ставить эту форму для комментариев.

Форма комментариев ВКонтакте — на сайт WordPress!

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

На странице с виджетом необходимо настроить саму форму комментариев.

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

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

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

 

Как видно на первом изображении, моя форма находится выше основной.

Если вы хотите поставить форму под статьей, то с помощью FilleZilla скопируйте файл Single.php на рабочий стол и откройте его с помощью текстового редактора Notepad++, нажмите на ссылку чтобы скачать программу.

Теперь необходимо найти место где заканчивается статья.

После этой строки нужно вставить код формы!
<div class="entry"><?php the_content(); ?></div>
Если хотите поставить после категорий и тегов, то после этой строки!
<?php the_tags('<p class="tags"><strong>Метки:</strong> ', ', ', '</p>'); ?>

Возможно у вас коды отличаются, ищите что то похожее на них.

Да и код формы, который у вас получился делится на 3 части. Первую часть нужно поставить в файл Header.php до тега </head>

<!-- Put this script tag to the <head> of your page -->
<script type="text/javascript" src="//vk.com/js/api/openapi.js?116"></script>

Вторую часть кода нужно поставить в этом же файле после тега <body>

<script type="text/javascript">
  VK.init({apiId: 4662855, onlyWidgets: true});
</script>

Ну и третья часть, как раз ставится в файл Single.php, или туда, где вы хотите видеть форму.

<!-- Put this div tag to the place, where the Comments block will be -->
<div id="vk_comments"></div>
<script type="text/javascript">
VK.Widgets.Comments("vk_comments", {limit: 10, width: "600", attach: "*"});
</script>

Все цифровые значения меняете на свои, я лишь показал части кода на своем примере.

В моем случае, форма стоит после тегов:

Комментарии вконтакте на сайте wordpress

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

Если необходимо будет форму выравнивать, то необходимо самому прописать в код формы специальные коды, некоторые коды описаны в этой статье. Не на каждом шаблоне, форма встанет ровно, как нужно.

Пример того, как я ровнял форму:

<div style="margin: 11px;" id="vk_comments"></div>
<script style="center" type="text/javascript">
VK.Widgets.Comments("vk_comments", {limit: 10, width: "520", attach: "*"});
</script>

Если вы хотите, то можете над формой написать какой нибудь текст, для этого в файле Single.php над кодом, который вы поставили допишите еще вот такой код с вашей фразой:

<b><i><div align="center"><font size="3">Буду рад Вашим комментариям!</font></div></i></b>
<div style="margin: 11px;" id="vk_comments"></div>
<script style="center" type="text/javascript">
VK.Widgets.Comments("vk_comments", {limit: 10, width: "520", attach: "*"});
</script>

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

Вот и все, форма комментариев из популярной социальной сети ВКонтакте установлена.

На этом я заканчиваю, всем пока!