Установка Табов на Prestashop 1.6.0.9

[Nano]

Всем здравствуйте, нашел не плохие табы хотелось бы их установить, так как в этом деле особо опытом не сверкаю прошу помощи в здешних умельцев...

1) Теперь по порятку, первое что я понял, для начала надо подключить скрипт...из своего не богатого опыта, прописал такой код  в header.tpl

Код Выделить Развернуть

<script type="text/javascript" src="/jquery-tabs-interface/js/script.js"></script>

2) Потом нужно вставить код(заведомо выбрав место), я так понимаю в product.tpl

Код Выделить Развернуть

<div id="tabs" class="clearfix">

<ul>
<li><a href="#tab1" title="Tab1 Title">Tab 1</a></li>
<li><a href="#tab2" title="Tab2 Title">Tab 2</a></li>
<li><a href="#tab3" title="Tab3 Title">Tab 3</a></li>
</ul>

</div>

<div id="panels">
<div class="panel-wrapper">
<div class="panel">
<h2>Panel 1</h2>
<p>Nullam in dui mauris. ......</p> <p>
<a href="#tab2">Go to Tab2</a></p>
</div>
<div class="panel">
<h2>Panel 2</h2>
<p>Nullam in dui mauris. ......</p><p>
<a href="#tab3">Go to Tab3</a></p>
</div>
<div class="panel">
<h2>Panel 3</h2>
<p>Nullam in dui mauris. ......</p><p>
<a href="#tab1">Back to Tab1</a></p>
</div>
</div>
</div> <!-- //#panels -->

3) З СSS в принципе я тоже могу разобраться и подозреваю, что стили надо закинуть в global.css

4) Но вот с Javascript я совсем на вы, собственно вопрос: Куда закинуть этот код ?

Код Выделить Развернуть

var QTABS = {

init: function () {

// attached onload and change event to address plugin
$.address.init(function(event) {

// first load, set panel
QTABS.setPanel(event);

}).change(function(event) {

// if the url changes, set panel
QTABS.setPanel(event);

});

},

// the core function to display correct panel
setPanel: function (event) {

// grab the hash tag from address plugin event
var hashtag = event.pathNames[0];

// get the correct tab item, if no hashtag, get the first tab item
var tab = (hashtag) ? $('#tabs li a[href=#' + hashtag + ']') : $('#tabs li:first a');

// reset everything to default
$('#tabs li').removeClass('active');
$('#panels .panel').hide();

// if hashtag is found
if (hashtag) {

// set current tab item active and display correct panel
tab.parent().addClass('active');
$('#panels .panel:eq(' + (tab.parent().index()) + ')').show();

} else {

// set the first tab item and first panel
$('#tabs li:first').addClass('active');
$('#panels .panel:first').show();

}

// change the page title to current selected tab
document.title = tab.attr('title');

}

}

// Execute this script!
QTABS.init();

Подкоректируйте пожалуйста, если не правильно описал процесс...Буду весьма благодарен за помощь ))

[Adik]

Вопрос такой - зачем? Просто интересно попробывать этот метод?
В prestashop 1.6 табы реализованны на Bootsrap 3 - вкладки tab

Код js можно в отдельный файл и его подключить в нужном шаблоне. А можно прямо в шаблон добавить.   

[Nano]

Йолки палки, золотой Вы человек, да откуда я знал, что все уже придумали за меня ))) Сейчас буду пробовать установить, спасибо)))

[Nano]

Еще один вопросик, он встроен или его надо интегрировать ?

[mAgency]

Стандартная тема выполнена на bootsrap3.
Все функции boostrap в ней включены.

[al0er]

В prestashop 1.6 табы реализованны на Bootsrap 3 - вкладки tab

Этот метод для Bootsrap 3 срабатывает если прописывать табы в product.tpl, и не срабатывает (не переключаются вкладки), если прописывать в визуальном редакторе при заполнении карточки товара. Скажите, можно как-то это исправить?

[mAgency]

Через виз. редактор не возможно сделать табы.
Только через шаблоны и модули.