Jump to content

div content pour footer élargi


Recommended Posts

Bonjour à tous,

 

comme chaque fois que je lance un topic, je vais vous demander de bien vouloir m'excuser d'entamer une discussion sans aucun doute mille fois rebattue. Mais j'aurai passé deux journées entières à formuler ma requête de toutes les façons par moi imaginable directement sur le forum prestashop ou passant par "l'ami google"... sans succès.

Voilà, comme bon nombre je voudrais que mon footer et mon header s'étalent gracieusement sur toute la largeur. Alors je sais il faut les sortire de la div de la page dans les fichiers footer.tpl et header.tpl, ce que j'ai fait. Effectivement, libérer des bornes de la "div page" les voilà qui arpentent allègrement tout l'espace que la taille de l'écran peut leur concéder. MAIS, mon logo, mes liens cms de bas de page comme les infos clients se font la malle profitant naturellement, eux aussi, de cet appel d'air.

Oui, je sais, il faut alors créer un "div content" (c'est ainsi nommé que j'ai appris l'existence de cet étrange animal) pour que tous les éléments du footer et du header restent à leur place initiale. Et bien sûr c'est là que je sèche. Je suis à quelque tapotement de clavier d'y arriver, je le sens mais en grand débutant que je suis je ne sais où mettre quoi exactement. Alors... un ENORME merci à qui aura la gentillesse de me l'expliquer.

 

Ciao a tutti

Link to comment
Share on other sites

Bonjour,

 

Alors en gros ta "div content" doit être dans la "div header" ainsi que dans ta "div footer" afin de permettre d'englober et de centrer les éléments du header et du footer.

 

Concrètement pour le header, dans le fichier "header.tpl" :

 

  <div id="header">

   <div id="header_content">

   <a id="header_logo" href="{$link->getPageLink('index.php')}" title="{$shop_name|escape:'htmlall':'UTF-8'}">
 <img class="logo" src="{$img_ps_dir}logo.jpg?{$img_update_time}" alt="{$shop_name|escape:'htmlall':'UTF-8'}" {if $logo_image_width}width="{$logo_image_width}"{/if} {if $logo_image_height}height="{$logo_image_height}" {/if} />
   </a>
   <div id="header_right">
 {$HOOK_TOP}
   </div>

   </div>

  </div>

 

Et pour le footer, dans le fichier "footer.tpl" :

 

  <div id="footer">

   <div id="footer_content">

 {$HOOK_FOOTER}

   </div>

  </div>

 

La dernière étape consiste à ajouter dans ton fichier global.css les styles suivants :

 

#header_content, #footer_content {
width:980px;
margin:0 auto;
}

 

Cet exemple est donné en prenant pour base le thème par défaut de Prestashop, il faudra donc peut-être l'adapter selon le thème que tu utilises.

Link to comment
Share on other sites

Bonjour à tous,

 

Je me permet de relancer ce sujet car je suis dans la même situation que zepelucheclub mais surement beaucoup plus novice encore. J'ai cherché dans les forums et sur les moteurs de recherche sans aucun résultat car je pense que je n'ai pas les bons mots pour rechercher.

Mon but est d'afficher un bas de page sur mon site en construction avec le nom des marques et les gammes qui y sont rattachées plus d'autres informations. Mais je ne sais pas comment faire. Je ne sais pas si il faut un module particulier ou modifier le code. A ce que je viens de comprendre il faudrait modiifier les fichiers templates.

Y a t-il dans ce forum un/des message(s) qui explique comment faire ou au moins qui donne(nt) des pistes de solution ?

Je joins deux exemples de sites avec des bas de page comme j'aimerais mettre en oeuvre.

PS : Je ne connais pas ces sites et j'espère que cela ne pose pas de problème que je les affichent ici.

 

post-360857-0-92633800-1336492963_thumb.jpg

post-360857-0-17710600-1336492972_thumb.jpg

 

Merci pour votre attention,

 

Eric

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...