Проблема с социальным виджетом Вконтакте "Мне нравится"

Блог им. demidee
Возникла проблема с социальным виджетом Вконтакте «Мне нравится». Если кто-то сталкивался с этой проблемой, прошу, подскажите решение:
Разместил виджет в topic_topic.tpl. На главной странице сайта вконтактовские кнопки «склеиваются», т.к. скрипт, отвечающий за размещение кнопок выводит их все в одном диве vk_like.

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

Заранее спасибо.

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

avatar
Скорее всего проблема в том, что у всех виджетов одинаковые айдишники. Как вариант можно к id виджета добавлять id топика, а виджет инициализировать по классу
avatar
Суть уловил, но как это сделать в строчках?
Хороший пример реализации подобного — cossa.ru(главная страница и, соответственно, страница статьи), но вот как они это сделали — ума не приложу.

P.S. заранее прошу прощения за, возможно, глупые вопросы, ибо, увы, я не программист=)
avatar
если по аналогии с cossa.ru, то вам нужно ваш лайк заменить на примерно такой код:


<div id="vk_like_{$oTopic->getId()}"></div>

<script type="text/javascript">
	VK.Widgets.Like("vk_like_{$oTopic->getId()}", {
		type: "button",
		height: 20,
		pageTitle: "{$oTopic->getTitle()}",
		text: "{$oTopic->getText()|strip_tags|truncate:200}",
		pageUrl: "{$oTopic->getUrl()}"
	});
</script>

Если используете последнюю версию ls, то скорее всего не нужно оборачивать все {literal}{/literal},
если до 0.4, то скорее всего подойдет такой код:


<script type="text/javascript">
	VK.Widgets.Like("vk_like_{$oTopic->getId()}", {literal}{{/literal}
		type: "button",
		height: 20,
		pageTitle: "{$oTopic->getTitle()}",
		text: "{$oTopic->getText()|strip_tags|truncate:200}",
		pageUrl: "{$oTopic->getUrl()}"
	{literal}});{/literal}
</script>


Если используете плагин, который добавляет к топику превьюшку, то можно передавать еще и эту картинку вконтакту. А если вдруг не заработает — пишите разберемся :)
avatar
Сопоставив ваши коды с некоторой информацией, найденной в интернете, и рабочий вариант был собран:
<div id="vk_like_{$oTopic->getId()}"></div>
<script type="text/javascript">
VK.Widgets.Like("vk_like_{$oTopic->getId()}", {literal}{{/literal}
type: "button"
pageUrl: "{$oTopic->getUrl()}"{literal}}{/literal});
</script>


Огромное Вам спасибо!=)
avatar
У меня на главной странице набор из топиков и я пытаюсь вставить кнопку Мне нравится вида:
<!-- Put this script tag to the <head> of your page -->
<script type="text/javascript" src="http://userapi.com/js/api/openapi.js?52"></script>

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

<!-- Put this div tag to the place, where the Like block will be -->
<div id="vk_like"></div>
<script type="text/javascript">
VK.Widgets.Like("vk_like", {type: "vertical"});
</script>

Вылезает ошибка:
Uncaught exception 'SmartyCompilerException' with message 'Syntax Error in template «Z:/home/ave-yummy.ru/www/templates/skin/developer\topic_part_footer.tpl» on line 62 «VK.init({apiId: 3142731, onlyWidgets: true});» — Unexpected ": ", expected one of: "}"
По Вашему совету не работает
avatar
В topic_list.tpl добавил:
<!-- VKONTAKTE INI-->	
			<script type="text/javascript" src="http://vk.com/js/api/openapi.js?69"></script>
			<script type="text/javascript">
			  VK.init({apiId: 3272161, onlyWidgets: true});
			</script>
			<!-- VKONTAKTE INI-->


А в topic_topic.tpl


			<!--VKONTAKTE-->
			<div style="margin:5px;float:right;  width:60px">
				<div id="vk_like_{$oTopic->getId()}" ></div>
				{literal}
				<script type="text/javascript">
					VK.Widgets.Like("vk_like_{/literal}{$oTopic->getId()}{literal}",  {type: "mini",  height: 20, pageUrl: '{/literal}{$oTopic->getUrl()}{literal}', pageTitle: '{/literal}{$oTopic->getTitle()|escape:'html'}{literal}', page_id:{/literal}{$oTopic->getId()}{literal}});
				</script>
				{/literal}
			</div>
			
			<!-- EOF VKONTAKTE -->


Обязательно пропишите параметры:

Пример работы здесь: http://connect-universum.com/blog/newmedia_ru/
Только зарегистрированные и авторизованные пользователи могут оставлять комментарии.