Jump to content
Sign in to follow this  
Twins Angels

[RESOLU] Ajouter un lien permanent

Recommended Posts

bonjour a tous...

 

Je cherche a rajouter un lien permanent a contact, sitemap, et favori...

 

j'ai bien rajouter dans les tpl et css ce qu'il fallait. le soucis que j'ai est que l'image de favori s'enleve sur mon FO... j'ai regarder partout et je ne comprends pas d'ou cela peut venir

 

Si quelqu'un pourrait m'expliquer ca serait gentil!!!! :wub: :wub:

 

http://www.twinsangels.fr

Share this post


Link to post
Share on other sites

Bonjour Twins angels,

 

Tu pourrais copier coller le code que tu as rajouté dans ton tpl ?

Share this post


Link to post
Share on other sites

oui bien sur

 

alors comme il y a 2 tpl je mets les 2 ...

dans le header :

<!-- Block permanent links module HEADER -->

<ul id="header_links">

<li id="header_link_contact"><a href="{$link->getPageLink('contact-form.php', true)}" title="{l s='contact' mod='blockpermanentlinks'}">{l s='contact' mod='blockpermanentlinks'}</a></li>

<li id="header_link_sitemap"><a href="{$link->getPageLink('sitemap.php')}" title="{l s='sitemap' mod='blockpermanentlinks'}">{l s='sitemap' mod='blockpermanentlinks'}</a></li>

<li id="header_link_bookmark">

<li id="header_link_account"><a href="{$link->getPageLink('authentication.php', true)}" title="{l s='Espace Client' mod='blockpermanentlinks'}">{l s='account' mod='blockpermanentlinks'}</a></li>

 

dans le permanentlinks.tpl:

<!-- Block permanent links module -->

<div id="permanent_links">

<!-- Sitemap -->

<div class="sitemap">

<a href="{$link->getPageLink('sitemap.php')}"><img src="{$img_dir}icon/sitemap.gif" alt="{l s='sitemap' mod='blockpermanentlinks'}" title="{l s='sitemap' mod='blockpermanentlinks'}" /></a>

<a href="{$link->getPageLink('sitemap.php')}">{l s='sitemap' mod='blockpermanentlinks'}</a>

</div>

<!-- Contact -->

<div class="contact">

<a href="{$link->getPageLink('contact-form.php', true)}"><img src="{$img_dir}icon/contact.gif" alt="{l s='contact' mod='blockpermanentlinks'}" title="{l s='contact' mod='blockpermanentlinks'}" /></a>

<a href="{$link->getPageLink('contact-form.php', true)}">{l s='contact' mod='blockpermanentlinks'}</a>

</div>

<!-- Espace Client -->

<div class="account">

<a href="{$link->getPageLink('authentication.php', true)}"><img src="{$img_dir}icon/account.gif" alt="{l s='account' mod='blockpermanentlinks'}" title="{l s='Espace Client' mod='blockpermanentlinks'}" /></a>

<a href="{$link->getPageLink('authentication.php', true)}">{l s='account' mod='blockpermanentlinks'}</a>

</div>

<!-- Bookmark -->

<div class="add_bookmark">

<script type="text/javascript">

writeBookmarkLink('{$come_from}', '{$shop_name|addslashes|addslashes}', '{l s='bookmark this page' mod='blockpermanentlinks'}', '{$img_dir}icon/star.gif');</script>

</div>

</div>

<!-- /Block permanent links module -->

 

et voila le css du theme

#header_links #header_link_sitemap a { background-image: url('../../../img/icon/sitemap.gif') }

#header_links #header_link_contact a { background-image: url('../../../img/icon/contact.gif') }

#header_links #header_link_bookmark a { background-image: url('../../../img/icon/star.gif') }

#header_links #header_link_account a { background-image: url('../../../img/icon/account.gif') }

Share this post


Link to post
Share on other sites

Je vois plusieurs petites choses, j'ai mis en rouge :

 

oui bien sur

 

alors comme il y a 2 tpl je mets les 2 ...

dans le header :

<!-- Block permanent links module HEADER -->

<ul id="header_links">

<li id="header_link_contact"><a href="{$link->getPageLink('contact-form.php', true)}" title="{l s='contact' mod='blockpermanentlinks'}">{l s='contact' mod='blockpermanentlinks'}</a></li>

<li id="header_link_sitemap"><a href="{$link->getPageLink('sitemap.php')}" title="{l s='sitemap' mod='blockpermanentlinks'}">{l s='sitemap' mod='blockpermanentlinks'}</a></li>

<li id="header_link_bookmark"> </li> (balise pas fermée et tu n'as rien dans ta puce)

<li id="header_link_account"><a href="{$link->getPageLink('authentication.php', true)}" title="{l s='Espace Client' mod='blockpermanentlinks'}">{l s='account' mod='blockpermanentlinks'}</a></li>

 

dans le permanentlinks.tpl:

<!-- Block permanent links module -->

<div id="permanent_links">

<!-- Sitemap -->

<div class="sitemap">

<a href="{$link->getPageLink('sitemap.php')}"><img src="{$img_dir}icon/sitemap.gif" alt="{l s='sitemap' mod='blockpermanentlinks'}" title="{l s='sitemap' mod='blockpermanentlinks'}" /></a>

<a href="{$link->getPageLink('sitemap.php')}">{l s='sitemap' mod='blockpermanentlinks'}</a>

</div>

<!-- Contact -->

<div class="contact">

<a href="{$link->getPageLink('contact-form.php', true)}"><img src="{$img_dir}icon/contact.gif" alt="{l s='contact' mod='blockpermanentlinks'}" title="{l s='contact' mod='blockpermanentlinks'}" /></a>

<a href="{$link->getPageLink('contact-form.php', true)}">{l s='contact' mod='blockpermanentlinks'}</a>

</div>

<!-- Espace Client -->

<div class="account">

<a href="{$link->getPageLink('authentication.php', true)}"><img src="{$img_dir}icon/account.gif" alt="{l s='account' mod='blockpermanentlinks'}" title="{l s='Espace Client' mod='blockpermanentlinks'}" /></a>

<a href="{$link->getPageLink('authentication.php', true)}">{l s='account' mod='blockpermanentlinks'}</a>

</div>

<!-- Bookmark -->

<div class="add_bookmark">

<script type="text/javascript">

writeBookmarkLink('{$come_from}', '{$shop_name|addslashes|addslashes}', '{l s='bookmark this page' mod='blockpermanentlinks'}', '{$img_dir}icon/star.gif');</script>

</div>

</div>

<!-- /Block permanent links module -->

 

et voila le css du theme (il manque les ";" à la fin de chaque background-image)

#header_links #header_link_sitemap a { background-image: url('../../../img/icon/sitemap.gif'); }

#header_links #header_link_contact a { background-image: url('../../../img/icon/contact.gif'); }

#header_links #header_link_bookmark a { background-image: url('../../../img/icon/star.gif'); }

#header_links #header_link_account a { background-image: url('../../../img/icon/account.gif'); }

Share this post


Link to post
Share on other sites

J'ai bien fait ce que tu m'as dit mais ca n'a rien changé. Au contraire ca m'a retiré en plus l'image de account (je suis sous firefox)

 

d'autre part comment ca se fait qu'il manquait des point virgule ou le li fermé alors que je nai touché a rien a part un copié coller de contact???

Share this post


Link to post
Share on other sites

Bonjour twins angels,

 

je viens de ton site via firefox et j'ai 4 liens: contact account, plan du site, favoris...

As-tu résolu ton problème?

 

Il me semble par contre, que firebug nous montre que ton css a besoin d'un petit rangement: tu as en haut de page beaucoup de zones qui se chevauchent et dont l'affichage ne sera pas évident pour tous les navigateurs. il devrait donc y avoir un peu de redimensionnement à faire.

 

Cordialement.

Daniel

Share this post


Link to post
Share on other sites

bon voila en regardant plus attentivement le header et le manquement dasn la puce j'ai trouvé le probleme.

 

j'avais simplement mal placé toute la ligne <li> account ....

 

merci beaucoup de ton aide Carl

Share this post


Link to post
Share on other sites

Bonjour twins angels,

 

je viens de ton site via firefox et j'ai 4 liens: contact account, plan du site, favoris...

As-tu résolu ton problème?

 

Il me semble par contre, que firebug nous montre que ton css a besoin d'un petit rangement: tu as en haut de page beaucoup de zones qui se chevauchent et dont l'affichage ne sera pas évident pour tous les navigateurs. il devrait donc y avoir un peu de redimensionnement à faire.

 

Cordialement.

Daniel

 

Bonjour Daniel,

 

Que veux tu dire??? Désolé je suis totalement novice en tpl css et tout ce qui s'en suit :/

 

PS : oui oui tout est reglé. le soucis venait des images et non des liens par eux meme

Share this post


Link to post
Share on other sites

Bonjour Twins Angels,

 

Tu es loin d'être nul en .tpl, puisque tu as compris que c'est lui qui décidait du contenu et de l'ordre, et que tu l'as super bien utilisé pour modifier tes liens permanents.

 

Pour ce qui est du css, il s'agit des positionnements, dimensions, couleurs, polices de caractères etc....et c'est bien plus simple que les tpl.

Pour te simplifier le travail sur css il existe un outil gratuit sur firefox qui s'appelle Firebug, qui te permet de rentrer dans le css de n'importe quel site, de voir les fichiers css et les lignes css qui régissent la zone sélectionnée, et même de simuler et visualiser des changements (non enregistrés) du css.

Essaie, c'est un outil simple qui fait énormément progresser.

 

Bonne continuation. Daniel

PS: n'oublie pas d'éditer ton post et de le passer en résolu

Share this post


Link to post
Share on other sites

je me sers deja de firebug ... mais je ne vois pas le probleme en fait au niveau du chevauchement. Ma belle soeur est sur internet explorer et quand je fais un changement de positionnement je lui demande de regarder chez elle ce que ca donne. et je varie en fonction de ca ...

 

y'a til autre chose a faire au niveau du css?

 

 

Post mis en resolu....

Share this post


Link to post
Share on other sites

En fait,

 

le passage à la souris sur ton site montre par exemple que les zones de chacun de tes logos du bloc "liens permanent" chevauchent ton menu horizontal. plus précisément, ton menu s'affiche par dessus les zones "lien permanent")

 

Tel quel (avec en plus des logos de petite taille et un fond transparent) pas de problème pour l'internaute.

C'est aussi ce que je me disais pour mon premier site, avant de réaliser que sur une autre taille d'écran et avec un autre navigateur (ie6 pour citer un vieux dinosaure qui fait moins de 5% aujourd'hui), c'etait l'inverse qui se produisait (les images par dessus le menu), avec pas mal de désagréments à la clé, de rubriques décalées etc....

Des Prestashopiens expérimentés m'ont alors fait comprendre qu'un code bien rangé (ils appellent ça "propre"), avec des zones bien définies qui se succèdent sans se chevaucher met à l'abri de ces éventualités désagréables, passées (IE6) ou a venir (évolutions IE, chrome, firefox etc...).

 

Donc si ton code fonctionne tel quel pas de problème, mais c'est juste quelque chose à intégrer au cas où tu rencontrerais d'autres difficultés, pour éviter parfois de chercher des heures entières...

Share this post


Link to post
Share on other sites

En fait,

 

le passage à la souris sur ton site montre par exemple que les zones de chacun de tes logos du bloc "liens permanent" chevauchent ton menu horizontal. plus précisément, ton menu s'affiche par dessus les zones "lien permanent")

 

Tel quel (avec en plus des logos de petite taille et un fond transparent) pas de problème pour l'internaute.

C'est aussi ce que je me disais pour mon premier site, avant de réaliser que sur une autre taille d'écran et avec un autre navigateur (ie6 pour citer un vieux dinosaure qui fait moins de 5% aujourd'hui), c'etait l'inverse qui se produisait (les images par dessus le menu), avec pas mal de désagréments à la clé, de rubriques décalées etc....

Des Prestashopiens expérimentés m'ont alors fait comprendre qu'un code bien rangé (ils appellent ça "propre"), avec des zones bien définies qui se succèdent sans se chevaucher met à l'abri de ces éventualités désagréables, passées (IE6) ou a venir (évolutions IE, chrome, firefox etc...).

 

Donc si ton code fonctionne tel quel pas de problème, mais c'est juste quelque chose à intégrer au cas où tu rencontrerais d'autres difficultés, pour éviter parfois de chercher des heures entières...

 

ok je comprend bien mais je ne sais pas trop comment faire ... te serait il possible de m'aider a rendre "propre" mon site?

Share this post


Link to post
Share on other sites

Bonjour twinsangels,

 

je viens de retourner sur ton site piocher une paire d'exemples.

qui pourraient être un risque de problèmes potentiels en cas d'évolution ultérieure du site, ou des navigateurs.

 

- le logo: occupe une taille> à celle prévue et "pousse" (ou pas, c'est selon) les autres éléments du header). si ça fonctionne comme ça c'est ok, mais attention si rajout en header d'autres éléments, puis surtout mettre en gras dans tes notes de ne remplacer à l'avenir que par une image de même dimension (sinon rique de décalage ou empiètement). En fait ça passe sans problème, et si les éventuelles évolutions te préoccuppent,la solution est de rajouter une bannière (voir forum).

- Les images de 200x80 px pour contact etc... à priori casées dans un emplacement de 65 px de hauteur.

- la marge négative en bas du header right, je suppose dans le but de remonter le menu. là, je crois qu'il y a un risque réel (à valider sur tous les navigateurs). on a clairement 2 zones qui s'empiètent Si firefox est ok pour ça, j'ai déjà eu des pb avec ce type de manip sur d'autres navigateurs (soit décalage forcé par le navigateur, soit header qui recouvre le menu). Ce point me semble être à traiter en redimensionnant correctement les zones du header.

 

Rien de bien méchant en final, mais autant jouer la tranquillité.

Cordialement. Daniel

Share this post


Link to post
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
Sign in to follow this  

×
×
  • Create New...

Important Information

Cookies ensure the smooth running of our services. Using these, you accept the use of cookies. Learn More