Bouton qui renvoi vers onglet

[lemandarin]

Salut,

 

j'ai créer un nouveau onglet à côté de celui de la description et des caractéristiques dans la fiche produit. J'y ai mit mes groupes d'attributs à la place de l'affichage classique des attributs à droite de la photo. L'onglet s'appel donc tout naturellement "Configurer" et permettra de configurer son PC.

Tout fonctionne parfaitement, ainsi que son affichage uniquement si il y a des attributs.

 

Par contre je sèche sur un point, j'aimerai mettre plus haut dans ma fiche produit un bouton "Configurer" qui renverra l'utilisateur sur l'onget tout en le dépliant, exactement comme le bouton "Plus de détails" situé en dessous de la description courte.

Cependant je bloque sur la création de ce bouton. En y regardant de plus près, j'ai vu que le bouton "Plus de détails" avait comme url "javascript:{ldelim}{rdelim}". A quoi celà correspond t'il? Comment puis-je faire pour réaliser mon bouton qui pointera vers mon nouveau onglet idTab4?

 

Merci de m'éclairer.

 

Tom.

[Julien Breux]

Il faut que tu modifie le fichier :

/themes/prestashop/js/product.js

 

Juste après le bloc :

//catch the click on the "more infos" button at the top of the page
$('div#short_description_block p a.button').click(function(){
$('#more_info_tab_more_info').click();
$.scrollTo( '#views_block', 1200 );
});

 

Tu créé ton code :

//catch the click on the "Configure" button at the top of the page
$('#setting').click(function(){
$('#more_info_tab_setting').click();
$.scrollTo( '#views_block', 1200 );
});

 

Ton bouton dois s'appeler :

<a class="button" href="javascript:{}" id="setting">Configurer</a>

 

La partie "onglet" :

<div id="more_info_block" class="clear">
  <ul id="more_info_tabs" class="idTabs">
	<li><a id="more_info_tab_more_info" href="#idTab1">En savoir plus</a></li>
    <li><a id="more_info_tab_data_sheet" href="#idTab2">Fiche technique</a></li>
    <li><a id="more_info_tab_setting" href="#idTab3">Configurer</a></li>
  </ul>

  <div id="more_info_sheets" class="sheets">
    <!-- full description -->
    <div id="idTab1">
      ...
    </div>
    <!-- product's features -->
	<ul id="idTab2" class="bullet">
      <li>...</li>
    </ul>
    <!-- product's configure -->
    <div id="idTab3">
      Pour configurer votre ordi...
    </div>
  </div>
</div>

[lemandarin]

Merci beaucoup Julien, j'appliquerai ça se soir c'était plus simple que je ne le pensais.

 

Merci.

Tom.

[Julien Breux]

N'hésitez surtout pas à nous tenir au courant 

[daYmo]

Génial. Merci Julien, c'est très clair ton explication.
çà m'a permis de caller un bouton "accessoires"en dessous de "Plus de détails...", bien entendu lorsqu'il y a des accessoires.
Et c'est nickel : çà selectionne l'onglet "Accessoires" et scroll jusque cet onglet.

[ckarone]

Un vieux post mais merci Julien

[leeloo]

Bonjour,

Ce vieux post me met sur la voix. Mais je n'arrive pas à faire le renvoi vers le nouvel onglet sur ps 1.2.5.

Quelqu'un peut m'éclairer ?

[Prestapascher]

A tout hasard cette astuce fonctionne t elle sur 1.5?