ecco

Попробовав различные решения для организации вкладок на странице товара ShopCMS, остановился на варианте предложенном сервисом Yahoo.

итак, приступим к реализации.

1. Заходим в админку: Настройки / Общие настройки / и активируем (включаем) чекбокс "Принудительная очистка кэша"

2. В файле шаблона core/tpl/user/ВАШ_ШАБЛОН/head.tpl.html ищем строку

 {* подключение скриптов *}

ниже нее вставляем

<script src="http://yui.yahooapis.com/3.4.1/build/yui/yui-min.js"></script>

3. В файле шаблона core/tpl/user/ВАШ_ШАБЛОН/product_detailed.tpl.html в нужном для Вас месте вставляем код:

<div id="product-tabs">
	<ul>
		<li><a href="#tab1">Вкладка 1</a></li>
		<li><a href="#tab2">Вкладка 2</a></li>
<li><a href="#tab3">Вкладка 3</a></li>
	 </ul>
	<div>		
	   <div id="tab1">
Текст вкладки 1
</div>
<div id="tab2">
Текст вкладки 2
</div>
<div id="tab3">
Текст вкладки 3
</div>
	</div>
<script>
{literal}
YUI().use('tabview', function(Y) {
var tabview = new Y.TabView({
srcNode: '#product-tabs'
});

tabview.render();
});
{/literal}
</script>
</div>

4. В файле шаблона data/ВАШ_ШАБЛОН/style.css добавляем стили, приведу простой пример стиля - само собой можно оформить более красивые стили с изображениями и т.п.

/* Product tabs  */
#product-tabs{clear:both;}
ul.yui3-tabview-list{margin-top:10px;}
.yui3-tab-label{border-left:1px solid #CCC;border-right:1px solid #CCC;border-top:1px solid #CCC;margin-right:3px;}
div.yui3-tabview-panel{border:1px solid #CCC;padding:20px;margin-bottom:10px;}
.yui3-tab-selected{background-color:#CCC;margin-right:3px!important;}

4. Обновляем страницу товара. Заходим в админку: Настройки / Общие настройки / и деактивируем (выключаем) чекбокс "Принудительная очистка кэша".

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

 tabs.png   17.95К   316 Количество загрузок:

Также табы можно использовать например для вывода описания либо характеристик товара.

Как вывести URL товара

Поставил виджет комментариев Facebook. В этом виджете есть возможность оставлять заметку на своей стене в Facebook.

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

То есть как вывести урл товара в карточке товара (product_detailed.tpl.html) с помощью смарти

чтобы код

имел вид: