Как разделить комментарии ВК?

Question

[Александр Коновалов]

Здравствуйте! Столкнулся с проблемой. На странице подключено 2 виджета комментариев ВК. Один в одном блоке, второй в другом. Но они почему-то отображаются все в одном блоке. Как решить?

<ul class="hidden-menu">
<script type="text/javascript" src="//vk.com/js/api/openapi.js?133"></script>        	
            
<script type="text/javascript">
	VK.init({apiId: 5604749, onlyWidgets: true});
</script>

<div id="vk_comments"></div>
<script type="text/javascript">
VK.Widgets.Comments("vk_comments", {limit: 10, width: "210", attach: "*", autoPublish: "0", pageUrl: "http://rz34.ru"});
</script>
		</ul>

<div class="entry-content">
                        <p><script type="text/javascript" src="//vk.com/js/api/openapi.js?127"></script><br />
<script type="text/javascript">
  VK.init({apiId: 5604749, onlyWidgets: true});
</script></p>
<p><!-- Put this div tag to the place, where the Comments block will be --></p>
<div id="vk_comments"></div>
<p><script type="text/javascript">
VK.Widgets.Comments("vk_comments", {redesign: 1, limit: 20, width: "1060", attach: "*"});
</script></p>
                                        </div>

Answer 1

[Petr Flaks]

Атрибут id подразумевает уникальность элемента, следовательно, на странице не может быть два элемента с одинаковыми ID. Метод VK.Widgets.Comments() первым параметром принимает именно этот самый ID элемента. Вам надо сделать что-то вроде такого:

Первый блок комментариев:

<div id="vk_comments_1"></div>
<script type="text/javascript">
  VK.Widgets.Comments("vk_comments_1", {redesign: 1, limit: 20, width: "1060", attach: "*"});
</script>

Второй блок комментариев:

<div id="vk_comments_2"></div>
<script type="text/javascript">
  VK.Widgets.Comments("vk_comments_2", {redesign: 1, limit: 20, width: "1060", attach: "*"});
</script>

Также, если вы хотите разместить несколько блоков комментариев на странице, чтобы в них были разные комментарии, вам надо будет в метод VK.Widgets.Comments() передать третий параметр с уникальным ID, иначе ВК будет в обоих виджетах отображать одинаковые комментарии. Например, у первого виджета можно поставить число 1, а у второго - число 2 Что это такое и зачем это нужно я отвечал вот здесь: Как сделать чат из комментариев ВК? (см. комментарии к ответу).

Comments

[Александр Коновалов]

terron а как правильно указывать этот параметр?

[Кирилл Жиляев]

Александр Коновалов: пусть первый - комментарии к материалу. Третий параметр у первого виджета будет, например, ID материала. Второй - чат. Тогда он будет иметь постоянное значение.

[Александр Коновалов]

kirill_782: что-то у меня не получается. vk_comments_1 и vk_comments_2 прописал, page_id прописал и виджеты вообще перестали отображаться. Может я неверно указал id?
VK.Widgets.Comments("vk_comments", {limit: 10, width: "210", attach: "*", autoPublish: "0", page_id: "1"});

[Petr Flaks]

Александр Коновалов: внимательнее: вам надо указать третий параметр метода, а не добавить новый ключ в объект второго параметра. Вам надо сделать так:

<div id="vk_comments_1"></div>
<script type="text/javascript">
  VK.Widgets.Comments("vk_comments_1", {redesign: 1, limit: 20, width: "1060", attach: "*"}, 1);
</script>

<div id="vk_comments_2"></div>
<script type="text/javascript">
  VK.Widgets.Comments("vk_comments_2", {redesign: 1, limit: 20, width: "1060", attach: "*"}, 2);
</script>

[Александр Коновалов]

terron: большое спасибо!