Jump to content

[RESOLU] groupes de liens alignés horizontalement dans le footer


Recommended Posts

Bonjour,

Après avoir réglé mes problèmes sur la personalisation de mon header, mon menu horizontal, mes produits phares (grĉe à vous d'ailleurs !)... me revoila pour trouver de l'aide concernant le footer cette fois ci.

Mon but étant d'aligner horizontalement plusieurs groupes de liens comme on voit souvent sur les sites aujourd'hui. Je suis tombé sur quelques posts qui m'ont mis sur la voie mais la je bloque. En gros j'utilise 3 ID : "footer" dans lequel je place une ligne pour marquer la séparation entre le corps de la page et le footer, "footer_content" pour créer un conteneur pour mes blocs de liens et "footer_block" qui seront les blocs de liens en eux même intégrés dans le conteneur.

Quelques détails :

Je vous passe l'ID footer qui a mon avis ne joue pas dans mon pb.

Le "footer_content" permet donc de créer mon conteneur :

#footer_content{
   float:left;
   width:640px;
}



Le "footer_block" pour créer des blocs de liens en float left et dont la largeur fait 30% pour les afficher en ligne :

div.footer_block{
   float:left;
   width:30%;
}



Dans mon footer.tpl j'appelle donc le hook FOOTER dans un div "footer"

Et enfin l'affichage des liens depuis blockvariouslinks.tpl :

><!-- MODULE Block various links -->
</pre>
<ul>

{l s='NOS OFFRES' mod='blockvariouslinks'}
{l s='Specials' mod='blockvariouslinks'}
{l s='New products' mod='blockvariouslinks'}
{l s='Top sellers' mod='blockvariouslinks'}
{l s='Contact us' mod='blockvariouslinks'}


{l s='MENTIONS LEGALES' mod='blockvariouslinks'}
   {foreach from=$cmslinks item=cmslink}
{$cmslink.meta_title|escape:'htmlall':'UTF-8'}
   {/foreach}

</ul>
<br><!-- /MODULE Block various links 



Dans ma logique cela devrait fonctionner, seulement rien à faire, les blocs s'affichent les uns sous les autres !!!

Ou ais-je fait une erreur ?

Please help ! :)

Share this post


Link to post
Share on other sites

Essaye dans ta construction d'avoir un truc plus de ce genre (il manque les dans la première balise

  • ):

>
</pre>
<ul>












et après pour le CSS

essaye plutot

ul#footer_block {
   ...
} 




V++

Atch

Share this post


Link to post
Share on other sites

C'est... comment dire... parfait ! :)

Décidément je ne peux plus me passer de vos précieux conseils !

Merci minijr, j'avais déja essayé ces solutions mais sans succès. Effectivement il manquait une définition ul pour le footer_block, merci Atch. Par contre après vérif avec Firebug il n'apparait pas de "bloc" footer_block dans le conteneur footer_content comme je m'attendais à le voir, est-ce normal ?

Une petite question cependant, pour ma culture perso, j'ai testé la structure que tu préconise Atch mais cela marche aussi avec ma structure d'origine. Une balise est elle obligatoire (ou recommandée) dans un bloc

  • ?

    Merci à vous deux, top efficacité comme d'hab :)

Share this post


Link to post
Share on other sites
  • 5 weeks later...

Merci Paulcool pour ton conseil, j'ai bien installer firebug mais je n'y comprend pas grand chose...je te dirai ce qu'il en sera dans un mois :)

J'ai bien effectué le changement de classe dans global.css (en remplaçant . par #) et je me retrouve avec l'affichage des liens du block BLOCKVARIOUS.TPL en vertical et non pas horizontal (en fait les liens sont les uns en dessous des autres).
J'ai remis le CSS tels qu'il était avant la modification et impossible de récupérer mon affichage horizontale. J'ai désinstallé le module puis réinstallé, rien y fait.
Ai je modifié une page qu"il ne fallait pas....ben en fait il ne me semble pas avoir touché à d'autres pages que footer.tpl, BLOCKVARIOUS.TPL et global.css ....m'enfin suis suffisamment vicieux pour l'avoir fait et ne plus m'en souvenir, méfiance.

J'ai suivi les conseils de divers posts tels qu'inclure la structure ci-dessous dans BLOCKVARIOUS.TPL mais mon affichage reste irrémédiablement vertical.

></pre>
<ul>










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
×
×
  • Create New...

Important Information

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