Comment faire pour avoir avoir un vrai menu haut en CSS ?

[BIGYOM 0]

Bonjour

Je souhaite modifier le menu horizontal 1 pour pouvoir mettre des tabs.

Je me heurte à la difficulté d'insérer l'id de la page dans la liste des liens.

Pour être plus claire, comment faire des menu de ce type ?

CSS horizontal menu

Merci de m'éclairer

:angry: cool c'est mon premier message sur ce forum

[MLG01 0]

Qu'entends tu par:

"Je me heurte à la difficulté d'insérer l'id de la page dans la liste des liens."

Pour l'insérer ton menu, tu dois faire des modifs dans haut.php de ton modèle choisi :angry:

Attention: Si ton site est au minimum bilingue, tu dois en tenir compte dans ton menu horizontal !

[BIGYOM 0]

Oublions cette histoire d'id...

Je voudrais que, par exemple, quand on clique sur "promotions", le lien du menu reste sélectionné avec le même style qu'un "a:hover".

(j'ai du mal à m'exprimer ce matin....)

[BIGYOM 0]

Une piste ?

Dans la feuille de style screen.css, environ ligne 228, il y a ceci :

div#menu1 ul li.active {

....

mais on ne trouve nul part l'appel au style .active...

J'ai essayé avec div#menu1 ul li a:active {

mais cela ne fait rien.

je gratte, je gratte... :angry:

[MLG01 0]

Une piste ?

Dans la feuille de style screen.css, environ ligne 228, il y a ceci :

div#menu1 ul li.active {

....

mais on ne trouve nul part l'appel au style .active...

J'ai essayé avec div#menu1 ul li a:active {

mais cela ne fait rien.

je gratte, je gratte... :angry:

Si tu fais une clique sur un lien, il me semble que c'est hover que tu dois mettre et pas active :huh:

n'oublie que ta page n'est qu'un lien et que l'apelle d'une balise <li> fait appel à une puce.

Tu peux lui donner pas mal d'attributs mais pas d'agir comme un lien.

C'est comme une voiture bourrée de gadgets mais qui n'a pas de carburant dans son reservoir pour avancer :)

donc dans la classe div

c'et plutot ceci que tu dois faire

div#menu1 ul li a:hover {

ton code

}

N'oublie pas de faire appelise à ta classe menu1 sur ta page php.

[BIGYOM 0]

j'avance !

Grâce à Alsacréation !

En gros, les liens du menu1 (haut.php) amènent vers des pages .php

Par exemple, la page achat/nouveautes.php contient un identifiant de page : $page_name = 'nouveautes';

Il suffit de l'inclure dans l'url du menu1 (haut.php):

<li><a href="' . $wwwroot . '/achat/nouveautes.php" '; if ($page_name == 'nouveautes') {echo ' id="en-cours"';} echo '>' . NOUVEAUTES . '</a></li>

Il faut bien faire gaffe à l'imbrication du code html dans le code php.

dans screen.css

on rajoute :

div#menu1 ul li a#en-cours {

	color: #FFFFFF;                                    /* par exemple */

	background: #767A7D;

	text-decoration: underline;

}[/codebox]

et cela fonctionne !

Il faut aussi et surtout, sous peine d'erreur, déclarer la variable $page_name sur toutes les pages où elle ne figure pas.

J'y vais de ce pas....

....... un moment plus tard

Il faut juste déclarer la variable dans la fichier configuration.inc.php :

$page_name ="";

je l'ai mis à la fin du fichier et plus de messages d'erreur !

:angry: ouf !

[BIGYOM 0]

Vous allez me dire que je parle tout seul... mais bon, j'approfondis le sujet.

Mon astuce fonctionne parfaitement sur les pages "nouveautés", "promotions", etc. mais pas pour la page d'index "accueil" !

Bigre.

Dans haut.php

modifier le lien vers l'accueil dans le menu1

<li><a href="' . $wwwroot . '/" '; if ($page_name == 'frontpage') {echo ' id="en-cours"';} echo '>' . HOME . '</a></li>

Dans index.php à la racine du site

Rajouter la variable $page_name

.....


define('IN_HOME', true);

$page_name = 'frontpage';

include("$repertoire_modele/haut.php");


.......[/codebox]

ensuite pour éviter une erreur d'index

[b]modifier les fichiers lib/lang/en.php et lib/lang/fr.php[/b]

vers la ligne 598, après //meta

rajouter sur les fichiers le code suivant :

[codebox]$_GLOBAL['strSpecificMeta']['Title']['frontpage'] = '';
$_GLOBAL['strSpecificMeta']['Keywords']['frontpage'] = '';
$_GLOBAL['strSpecificMeta']['Description']['frontpage'] = '';

et l'onglet "accueil" a le comportement souhaité !