Jump to content

Modifier la hauteur de la grid du logo dans le header

Marlènee
 Share

Recommended Posts

Marlènee Newbie

Marlènee

Posted
Posted

Bonjour,

 

j'ai un espace trop important qui ne sert à rien entre le logo de mon site (dans le header) et le début du menu verticale (les catégories des produits). Cela est dû un une image logo qui fait 71px de hauteur, alors que le logo en lui même fait environ 45px de hauteur. En clair, le logo qui a un fond transparent a, en bas, une trentaine de pixels qui ne servent à rien.

 

Voici ce que je peux voir dans le code en utilisant firebug:

<a id="header_logo" title="TITLE" href="http://www.monsite.com/">

    <img class="logo" width="298" height="71" alt="ALT" src="/img/logo.jpg?138784598"></img>

</a>

Avec Photoshop, j'ai supprimé le bas du logo qui ne servait à rien. L'image du logo fait maintenant 51px. J'ai ajouté le nouveau logo via le backoffice (Preference, Theme, logo de l'en tête). Malheureusement le résultat est médiocre car ça affiche toujours une hauteur de 71px et donc ça métire mon logo.

 

Je trouve bien le width 298 dans le fichier grid_prestashop.css (.container_9 .grid_2 {width:298px;})

Mais je ne trouve pas ou je peux diminuer le height="71".

 

Pouvez-vous me dire ou je peux diminuer cette hauteur SVP ?

Merci

Link to comment
Share on other sites
Vinum Rookie

Vinum

Posted
Posted

Bonjour,

regardez dans le fichier header.tpl si la hauteur n'est pas codée en dur ou dans le tpl appelé par le module qui appelle le fichier grid_prestashop.css.

sinon dans le fichier grid_prestashop.css au même endroit ou est défini le width mettez un height.

Link to comment
Share on other sites
Marlènee Newbie

Marlènee

Posted
  • Author
Posted

Merci pour ton aide Vinum,

Voila ce qu'il y a dans le fichier header.tpl kaprès la balise head, je ne pense pas que la hauteur est codée en dur.

<body {if isset($page_name)}id="{$page_name|escape:'htmlall':'UTF-8'}"{/if} class="{if $hide_left_column}hide-left-column{/if} {if $hide_right_column}hide-right-column{/if} {if $content_only} content_only {/if}">
	{if !$content_only}
		{if isset($restricted_country_mode) && $restricted_country_mode}
		<div id="restricted-country">
			<p>{l s='You cannot place a new order from your country.'} <span class="bold">{$geolocation_country}</span></p>
		</div>
		{/if}
		<div id="page" class="container_9 clearfix">

			<!-- Header -->
			<div id="header" class="grid_9 alpha omega">
      <div id="header_right" class="grid_6 omega">
					{$HOOK_TOP}
				</div>
				
				
			</div>
      </div>
      
      
      </div>
			<div id="page2" class="container_9 clearfix">
			<div id="columns" class="grid_9 alpha omega clearfix">
				<!-- Left -->
				<div id="left_column" class="column grid_2 alpha">
					{$HOOK_LEFT_COLUMN}
				</div>

				<!-- Center -->
				<div id="center_column" class=" grid_5">
	{/if}

Voici ce que j'ai modifié dans le fichier grid_prestashop.css

.container_9 .grid_2 {width:298px;height:51px;}

Ca n'a rien changé.

 

 

 

dans le tpl appelé par le module qui appelle le fichier grid_prestashop.css

 

Comment savoir quel .tpl est appellé par le module SVP ?

Link to comment
Share on other sites
Julien64 Newbie

Julien64

Posted
Posted

Bonjour,

 

Je viens de voir votre post concernant le bug sur la colonne de gauche et c'est directement lié à la modification faite suite à ce post ci, à savoir la hauteur fixée à 51px sur l'élément .container_9 .grid_2

En supprimant cette hauteur, votre colonne de gauche n'apparaitra plus au-dessus du footer.

 

Ensuite pour le logo, il faut effectivement le réuploder par l'admin de PS avec le bon format et ensuite vider les caches et fichiers de compilation smarty et ça devrait fonctionner. Mais je vois qu'actuellement le logo est intégré à partir du module de menu... :s

Link to comment
Share on other sites
Marlènee Newbie

Marlènee

Posted
  • Author
Posted

 

Je viens de voir votre post concernant le bug sur la colonne de gauche et c'est directement lié à la modification faite suite à ce post ci, à savoir la hauteur fixée à 51px sur l'élément .container_9 .grid_2

En supprimant cette hauteur, votre colonne de gauche n'apparaitra plus au-dessus du footer.

 

Bonjour Julien, en effet, c'était exactement ça.

 

 

Ensuite pour le logo, il faut effectivement le réuploder par l'admin de PS avec le bon format et ensuite vider les caches et fichiers de compilation smarty et ça devrait fonctionner. Mais je vois qu'actuellement le logo est intégré à partir du module de menu... :s

 

Quand je change le logo, je vais dans le backoffice > Preference > Theme et j'upload le logo.

Je suis ensuite allé dans  Paramètres avancés > Performances et j'ai coché : "Forcer la compilation à chaque appel" et j'ai désactivé le cache. Je suis aller dans Firefox (j'ai fait la même manip sous Chromonium) et j'ai fait un CTRL+F5.

La nouvelle image s'affiche bien, mais elle est déformées (étirée dans le sens verticale) car ça hauteur HTML reste 71px et non 51px.

Link to comment
Share on other sites
Julien64 Newbie

Julien64

Posted
Posted

Ok c'est vraiment bizarre parce que dans le code source je vois le logo dans le module de menu et non comme il est de base sur les thèmes classiques.

Il doit y avoir une hauteur entrée en dur dans un TPL j'imagine... en recherchant sur les fichiers du thème height="71" ou 71px peut être que tu trouveras quelque chose...

Link to comment
Share on other sites
Marlènee Newbie

Marlènee

Posted
  • Author
Posted

J'ai téléchargé tout le dossier theme de mon site sur mon ordi. J'ai fait une recherche grâce à Notepad++ dans tous les fichiers du dossier avec le terme height="71", il n'a rien. Sinon avec le terme "71px", il me trouve uniquement des fichiers qui sont dans le dossier "cache".

 

Par exemple voici un bout de code qui se trouve dans un fichier cache (tout à la fin):

#container_slder_principal{background-color:#c91e52;height:300px;clear:both;position:relative;margin-bottom:25px}.ozogrof_left{background-image:url('http://www.monsite.fr/modules/homeslider/images/zogrof_left.png');width:83px;height:71px;background-repeat:no-repeat;position:absolute;left:-71px;top:-71px}.ozogrof_right{background-image:url('http://www.monsite.fr/modules/homeslider/images/zogrof_right.png');width:145px;height:52px;background-repeat:no-repeat;position:absolute;right:-112px;top:300px}

Les images qu'il y a dans ce bout de code étaient affiché sur le site, ça fait parti du design. Je ne sais pas pourquoi, elles ne sont plus visibles.

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
 Share
Go to topic listing
×
×
  • Create New...