Jump to content

ajout d'onglets dans la description courte de la page produit


Recommended Posts

Bonjour à tous,

 

j'essaie en vain de rajouter des onglets sur la description courte de mon Prestashop 1.6.0.14, j'essaie d'appliquer la methode vue ici: http://getbootstrap.com/javascript/#tabs-usage mais si les liens et leur contenu apparaissent bien, ils ne sont pas formaté en Tab... comme vous pouvez le voir ici: http://boissons31.com/medoc/849-chteau-beauvillage-medoc-aocnbspmedoc-cest-un-vin-complexe-et-dense-une-robe-est-grenat-sombre-le-nez-est-puissant-et-frais-treg.html

Voici le code en question:


<ul class="nav nav-tabs" role="tablist" id="myTab">
  <li role="presentation" class="active"><a href="#description" aria-controls="description" role="tab" data-toggle="tab">Description</a></li>
  <li role="presentation"><a href="#conseils" aria-controls="conseils" role="tab" data-toggle="tab">Conseils et Service</a></li>
  <li role="presentation"><a href="#fichetechnique" aria-controls="fichetechnique" role="tab" data-toggle="tab">Fiche Technique</a></li>

</ul>

<div class="tab-content">
  <div role="tabpanel" class="tab-pane active" id="description">contenu tab "Description"</div>
  <div role="tabpanel" class="tab-pane" id="conseils">contenu tab "Conseils et Service"</div>
  <div role="tabpanel" class="tab-pane" id="fichetechnique">contenu tab "Fiche Technique"</div>


<script>
$('#myTab a').click(function (e) {
  e.preventDefault()
  $('#myTab a[href="#description"]').tab('show')
  $('#myTab a[href="#conseils"]').tab('show')
  $('#myTab a[href="#fichetechnique"]').tab('show')
})
</script>

Ma reconnaissance éternelle à qui voudra bien me donner un coup de main !

Edited by zappaien (see edit history)
Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
×
×
  • Create New...