Mardi 24 février 2009 2 24 /02 /2009 15:59
Ce menu tout simple fonctionne pratiquement sur toutes les plateformes.

Exemple de rendu :


Pour le mettre sur haut et fort, voici comment faire :


puis vous allez sur

APRES ces lignes

         
       <div id="banner">
                        <div class="banner-decorator1">
    <div class="banner-decorator2">
                                <h1><a href="{$blog.url}">{$blog.title}</a></h1>
                                <h2>{$blog.description|default:"&nbsp;"}</h2>

Vous collez ce code

<script type="text/javascript">
menuhz  = 1;
bgcolor ='#EEEEEE';
bgcolor2='#DDDDDD';
bgcolor3='#87D300';
bgcolor4='#2080a0';
largeur = 138;
hauteur = 30;
i       = 0;
menup = new Array;
menup[i++]='Accueil';
menup[i++]='{$blog.url}';
menup[i++]='A propos';
menup[i++]='{$blog.url}about.html';
menup[i++]='Archives';
menup[i++]='{$blog.url}archives/';
menup[i++]='nom';
menup[i++]='adresse.html';
menup[i++]='nom';
menup[i++]='adresse.html';
menup[i++]='nom';
menup[i++]='adresse.html';

menup[i++]='Contact';
menup[i++]='mailto:lavande@lignepapilles.com';

document.write('<style>');
document.write('.ejsmenu {ldelim}color:'+bgcolor4+'; cursor:pointer;{rdelim}')
document.write('</style>')
document.write('<DIV ID=top><TABLE BORDER=0 CELLPADDING=0 CELLSPACING=0 BGCOLOR='+bgcolor3+' WIDTH=100% HEIGHT='+hauteur+'><TR><TD><TABLE CELLPADING=0 CELLSPACING=1 BORDER=0 WIDTH=100% HEIGHT=100%>'+(menuhz?'<tr>':''))

quote = '"';
for(pass=0;pass<menup.length;pass+=2)
 document.write((menuhz?"":"<tr>")+"<TD WIDTH="+largeur+" ALIGN=center BGCOLOR="+bgcolor+" onMouseDown='location.href="+quote+menup[pass+1]+quote+"' onMouseOver='this.style.background="+quote+bgcolor2+quote+"' onMouseOut='this.style.background="+quote+bgcolor+quote+"' CLASS=ejsmenu><FONT SIZE=1 FACE=Verdana><B>"+menup[pass]+"</B></FONT></TD>")

document.write('</tr></TABLE></TD></TR></TABLE></DIV>')
</script>

Il n'y a plus qu'à compléter les zones en rouge par les URL correspondantes et en bleu le nom des cellules de votre choix (les trois premières lignes sont codées en html et fonctionnent sur tous les blogs)
Pour les couleurs et la atille des cellules ça se passe là:

menuhz  = 1     ;     //1:menu horizontal  mettre 0 si vous voulez un menu vertical
bgcolor ='#EEEEEE';  //Couleur arrière
bgcolor2='#DDDDDD';  //Couleur arrière surbrillance
bgcolor3='#FFFFFF';  //Couleur bordure
bgcolor4='#2080a0';  //Couleur texte
largeur = 77,5;      // largeur des cases
hauteur = 22;        // hauteur des cases



Enjoy !
Par Lavande - Publié dans : Haut et fort - Ecrire un commentaire - Voir les 15 commentaires
Retour à l'accueil

Commentaires

hello. je viens de tester le rendu sur mon blog vite fait. Ehm quelques chose a du m'échapper , la modif n 'apparait pas!
Commentaire n°1 posté par mindaLICIOUS le 25/02/2009 à 19h10
bizarre, refais la manip !
Réponse de Lavande le 01/03/2009 à 14h02
Merci pour l'explication ! Très pratique. Cependant, ma barre de menu n'apparait que sur la page d'accueil puis disparaît lorsqu'on se déplace sur le site.
Que faut-il faire pour l'avoir en permanence affichée ?

Merci ! :)
Commentaire n°2 posté par hélène le 24/03/2009 à 16h53
parce que tu dois copier le menu sur d'autres pages : pages des permaliens, des archives... etc (attention pas le flux rss, ni les com'...)
Réponse de Lavande le 25/03/2009 à 19h38
C'est parfait, ça marche ! Merci beaucoup ! :)
Commentaire n°3 posté par hélène le 25/03/2009 à 22h20
Super !
Réponse de Lavande le 26/03/2009 à 07h23
bon ba sous over blog ca marche po
ya pas une autre manip pour chez eux
?
Commentaire n°4 posté par sakina's creations le 26/03/2009 à 14h02
ben si il y en a... encore faut il consulter les tutos des menus concernant OB...
Réponse de Lavande le 26/03/2009 à 14h07
oui merci j'ai vu ca après, et j'ai réussi mon coup, bravo pour le tuto
Commentaire n°5 posté par sakina's creations le 26/03/2009 à 15h51
chouette !
Réponse de Lavande le 26/03/2009 à 16h15
Bon ça, c'est ce que je souhaiterais faire sur mon blog www.lestoutfee.canalblog.com ! mais j'avoue que je suis pas vraiment douée ! pas du tout d'ailleurs ! et si je comprends complètement tout ce qui est écrit, je ne trouve pas pour autant la config avancée.... c'est quoi HAUT ET FORT ? pardon d'etre si nulle ! et merci

karine
Commentaire n°6 posté par lafeemarraine le 07/04/2009 à 00h49
ton blog est un blog de la plateforme canalblog et là tu consultes un tuto pour la plateforme haut et fort... Le mieux est de consulter les tuto qui concerne ta propre plateforme en utilisant l'index...
Réponse de Lavande le 07/04/2009 à 08h55
oui oui, ça je m'en suis apperçue et je l'ai compris après avoir adressé ce comm... excuse moi ! seulement pour faire ce que je souhaite, il faut être en mode avancé si j'ai bien compris et je bloque sur un point comme je te le disais ! aussi un peu d'aide complémentaire ne serait aps de refus ! il est ou ce "affaichage" ! ^^
merci ma belle

karine
Commentaire n°7 posté par lafeemarraine le 07/04/2009 à 09h12
affichage ? mais où est ce que je parle de affichage dans ce tuto ? le mieux est d'utilser le formulaire contact sous la bannière ou le formulaire poser une question. Les commentaires ne sont pas l'espace le plus appropriés pour répondre aux questions spécifiques
Réponse de Lavande le 07/04/2009 à 09h17
Bonsoir !
Merci pour ce tuto, mais tout comme MindaLicious, j'ai beau placer ce code là où il est conseillé de le faire, il ne fonctionne pas. Il marche lorsque je le place au dessus de la bannière dans le template, mais du coup la couleur de fond de mon blog change et devient celle que j'ai modifiée dans le code pour etre celle des onglets du menu... :s
Savez-vous ce que je fais mal ?
Merci !
Commentaire n°8 posté par kaamiye le 13/04/2009 à 19h22
Ca y est je sais d'où venait mon problème :j'avais tenté de "masquer" les cellules dont je n'avais pas encore l'utilité avec ""
Donc problème résolu et bientot une navigation facilitée dans mon blog :)
Commentaire n°9 posté par Amanda+aka+mindaLICIOUS le 01/05/2009 à 12h30
cette manie de toucher à tout et de veir pleurer On ne masque pas avec "" mais avec <!--   -->
Réponse de Lavande le 03/05/2009 à 19h50
ah mince c'est ce que je voulais écrire entre les guillemets. j'ai du oublier ( chui une t^te de linotte!)
""
Commentaire n°10 posté par Amanda+aka+mindaLICIOUS le 03/05/2009 à 20h23
ah rectification : j'ai réécrit pareil, les balises entre les guillemets ne veulent pas apparaitre !
Commentaire n°11 posté par Amanda+aka+mindaLICIOUS le 03/05/2009 à 20h25
marche pas chez moi :s
Commentaire n°12 posté par Sacha le 30/10/2009 à 19h27
ça ne fonctionne pas chez moi...
(H&F refuse de valider mes changements)
je me demande si ce n'est pas parce que j'ai déjà une bannière personnalisée (mais je ne sais pas où je dois modifier des codes du coup)
Commentaire n°13 posté par Luna Part le 27/05/2010 à 15h56
J'ai suivie tous les conseils, mais rien n'apparait... C'est moi ou bien?
Commentaire n°14 posté par Lilith le 09/06/2010 à 18h31
Ah finalement c'était moi et ça fonctionne! Merci!
Commentaire n°15 posté par Lilith le 09/06/2010 à 18h51



Je le fais pour vous !


Passer en mode avancé, installer un menu, migrer votre blog, créer un blog wordpress, besoin d'une bannière, relooker votre blog... Vous avez besoin d'aide ?
Je le fais pour vous ! Contactez moi, j'établierai un devis ! Pour un premier contact, clic ici.
@ tout de suite !

Coup de pouce pour

Comboost qui met à disposition des bloggeurs ses supers diaporamas !



 

Je sais aussi cuisiner...

Visitez mon autre blog !


Achetez mon livre !

Boutonlivre01

Installez le logo!

Parce que peut être vous avez trouvé votre bonheur sur blogtuto et que vous avez envie de le faire savoir, un petit lien ou une petite image sur votre blog, ça me fait drôlement plaisir quand je passe chez vous et que je reconnais mes codes... Alors pensez-y !

bouton_blogtuto

 




Bookmark and Share
http://www.wikio.fr
J'invite aussi les bloggeurs Haut et fort à ajouter le logo de Gee Mee, contributeur actif pour leur plateforme !

Personnalisez votre blog avec Gee Mee

Recherche

Comptons !

Compteur de visiteurs en lignes Nethique.info Il y a  9  personne(s) sur ce blog

Syndication

  • Flux RSS des articles
 
Contact - C.G.U. - Rémunération en droits d'auteur - Signaler un abus - Articles les plus commentés