Сообщений в теме: 7

[badisoft]

Табы для дефолтового шаблона ShopCMS 3.1.3, построенного на bootstrap 3.0.

Раньше я эти табы делал на jquery-ui (см. https://cpu.badisoft...ook-IQ-701.html), там есть специально заточенный виджет для этого, но имея в "ядре шаблона" bootstrap использовать jquery-ui как-то глупо, ведь в bootstap есть свои табы, более интересные конструктивно и имеющие с шаблоном общие цветовые, размерные и прочие свойства.
Ниже идет кусочек файла product_deatailed.tpl.html, только сами табы, лишнее удалено.

<ul class="nav nav-tabs">

  <li><a href="#tab1" data-toggle="tab">Краткое</a></li>

  <li{if !$smarty.get.sent && !$smarty.get.nosent && !$smarty.request.disc} class="active"{/if}><a href="#tab2" data-toggle="tab">Полное</a></li>

  {if $product_related_number}<li><a href="#tab3" data-toggle="tab">Опции</a></li>{/if}

  {if $smarty.const.CONF_PRODUCT_MAIL}<li{if $smarty.get.sent || $smarty.get.nosent} class="active"{/if}><a href="#tab4" data-toggle="tab">Вопрос?</a></li>{/if}

  {if $smarty.const.CONF_USE_DISCUSS}<li{if $smarty.request.disc} class="active"{/if}><a href="#tab5" data-toggle="tab">Отзывы({$product_reviews_count})</a></li>{/if}

</ul>



<div class="tab-content">



<div id="tab1" class="tab-pane fade">

{* код вывода краткого описания *}

{include file="product_brief_tab.tpl.html"}

</div>



<div id="tab2" class="tab-pane fade{if !$smarty.get.sent && !$smarty.get.nosent && !$smarty.request.disc} in active{/if}">

{* код вывода полного описания *}

[...]

</div>



{if $product_related_number}

<div id="tab3" class="tab-pane fade">

{* рекомендуемые товары *}

[...]

</div>

{/if}



{if $smarty.const.CONF_PRODUCT_MAIL eq 1}

<div id="tab4" class="tab-pane fade{if $smarty.get.sent || $smarty.get.nosent} in active{/if}">

{* вывод формы для отправки вопроса *}

{include file="product_mail_tab.tpl.html"}

</div>

{/if}



{if $smarty.const.CONF_USE_DISCUSS}

<div id="tab5" class="tab-pane fade{if $smarty.request.disc} in active{/if}">

{* вывод дискуссий *}

{include file="product_discussion.tpl.html"}

</div>

{/if}



</div>

Пример: http://new.badisoft....ook-iq-701.html

Источник:
http://bootstrap-3.r...ts.php#nav-tabs
http://bootstrap-3.r...script.php#tabs

[makki]

Спасибо! Не могли бы вы еще поделиться содержанием файлов, включенных в табы product_mail_tab.tpl.html и т.д?

[badisoft]

Спасибо! Не могли бы вы еще поделиться содержанием файлов, включенных в табы product_mail_tab.tpl.html и т.д?

http://vsupport.club/topic/2223-табы-в-полном-описании-товара-краткоеполноео/
Ну а правка под 3.1.3 - самостоятельно.

[m0skit]

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

[Dbus]

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

Писать ее состояние в куки или local storage. Или get

[m0skit]

Писать ее состояние в куки или local storage. Или get

А, ну все понятно, пошел писать. Спасибо за подсказку.

А если серьезно, то если бы я знал как написать, то я бы не спрашивал как это сделать. Не находите?

[badisoft]

А если серьезно, то если бы я знал как написать, то я бы не спрашивал как это сделать. Не находите?

А какого ответа Вы хотите?
Когда код уже есть - им обычно не жалко поделиться.
Но не писать же код за Вас для Вашего коммерческого сайта.
А рекомендация совершенно правильная - сохранять или передавать (get, post, cookie, sql, file, moon) текущее состояние табов, чтобы к нему можно было вернуться. Наиболее просто через get или через cookie.

[Dbus]

А если серьезно, то если бы я знал как написать, то я бы не спрашивал как это сделать. Не находите?

Дать подсказку в какую сторону думать и писать готовое решение на пустом энтузиазме по первому чиху вопрошающего - это немного разные по трудоемкости и затраченному времени задачи. Не находите?