barre de menu

[momix]

bonjour j'aurais voulu savoir comment réaliser une barre de menu comme dans le site suivant,
qui il me semble a été réalisé sur iweb.
D'avance merci pour vos réponse



http://web.me.com/etiennecapelle/lescapelsonensuede/Installation_a_Eden/Installation_a_Eden.html

[koeklin]

ici http://www.cssplay.co.uk/menus/pro_horizontal.html (c'est celui du haut)
tant que vous y êtes Autant visiter le site entier http://www.cssplay.co.uk/

Tuto pour ce menu pro_one : à vous de l'adapter si vous en choisissez un autre
1) télécharger le fichier zippé, dézippez-le.
2) éditer la page pro_one.html avec un éditeur de texte (pas TexteEdit, préférez Smultron (gratuit)).

Code:

<ul class="menu1">
<li><a href="#nogo"><b>Home</b></a></li>
<li class="current"><a href="#nogo"><b>Privacy Policy</b></a></li>
<li><a href="#nogo"><b>Products</b></a></li>
<li><a href="#nogo"><b>Where to find us</b></a></li>
<li><a href="#nogo"><b>Contact us</b></a></li>
<li><a href="#nogo"><b>Search</b></a></li>
</ul>

chaque lien correspond à une ligne de ce genre

Code:

<li><a href="#nogo"><b>Home</b></a></li>

Home est le nom qui apparait dans la barrière, #nogo est la destination du lien
remplacez #nogo par l'adresse de votre page par ex.

Code:

<li><a href="http://www.etsicetaitvrai.be/Site/Bienvenue.html"><b>Home</b></a></li>

rajouter target="_top" dans la balise

Code:

<a href="http://www.etsicetaitvrai.be/Site/Bienvenue.html">

ce qui donne :

Code:

<li><a href="http://www.etsicetaitvrai.be/Site/Bienvenue.html" target="_top"><b>Home</b></a></li>

3) A l'aide d'un client FTP, mettez le dossier à la racine de votre FTP ( dossier www ou web ou public_html) à côté de votre dossier Site et de votre page index.html
L'adresse de votre page de menu correspond l'arborescence des fichiers :

http://www.etsicetaitvrai.be/pro_one/pro_one.html

= une page pro_one.html dans un dossier pro_one lui même placé à la racine du site (= http://www.etsicetaitvrai.be)
dans un widget fragment html placer le code suivant :

Code:

<script language="Javascript">
window.location="http://www.etsicetaitvrai.be/pro_one/pro_one.html";
</script>

le menu n'apparaitra pas dans iWeb mais sera visible une fois la page publiée sur le net avec votre navigateur. Donc pensez à redimensionner le widget fragment HTML aux dimensions probable du menu.

[momix]

Merci pour votre réactivité, je viens de lire vos explications ça n'as pas l'air trop compliqué...
Je testerai ça ce week-end a mon aise... si j'ai un soucis, je ne manquerai pas de vous appelé à l'aide.

[grobi01]

Bonjour,

Je suis complètement débutant malgré cela j'ai réussi cette manipulation fort bien expliquée.

Maintenant je souhaiterais placer ces icônes au centre ainsi que en faire des liens vers mais autres pages.

Pouvez vous m'aidez ?

Je vous remercie par avance

[koeklin]

Oui mais j'ai rien compris

[grobi01]

Je vais tenter d'être plus clair. Ma barre de menu est composé de Accueil, Méthode" Témoignages" Nous Contacter. Premièrement je souhaiterai lorsque que je clique sur Méthode atterrir sur la page Méthode qui est une de mes pages. De la même manière Avec Accueil, Témoignages et Nous Contacter.

Ensuite j'ai joint une image de ma barre de menu actuelle. Mes quatre icônes sont placés à gauche, je souhaiterai de la même manière que la barre de menu de ce site soit placé au milieu. Je veux dire par la que Accueil, Méthode, Témoignages et Nous Contacter soit centrés.

Ai-je étais plus clair ?

Je vous remercie par avance

Fichiers joints

Barre de menu.tiff Vous n'avez pas la permission de télécharger les fichiers joints.(8 Ko) Téléchargé 6 fois

[koeklin]

Et mon message du 11 février ne vous est d'aucune aide?

[domus33]

bonjour j'aurais voulu savoir comment réaliser une barre de menu comme dans le site suivant,
qui il me semble a été réalisé sur iweb.
D'avance merci pour vos réponse

Désolé de revenir très tardivement sur ce topic, mais , avec iWeb, on peut réaliser rapidement ce genre de menu me semble t'il, je me demande pourquoi une telle question...

[lucien de montmartre]

[lucien de montmartre]

ici http://www.cssplay.co.uk/menus/pro_horizontal.html (c'est celui du haut)
tant que vous y êtes Autant visiter le site entier http://www.cssplay.co.uk/

Tuto pour ce menu pro_one : à vous de l'adapter si vous en choisissez un autre
1) télécharger le fichier zippé, dézippez-le.
2) éditer la page pro_one.html avec un éditeur de texte (pas TexteEdit, préférez Smultron (gratuit)).

Code:

<ul class="menu1">
<li><a href="#nogo"><b>Home</b></a></li>
<li class="current"><a href="#nogo"><b>Privacy Policy</b></a></li>
<li><a href="#nogo"><b>Products</b></a></li>
<li><a href="#nogo"><b>Where to find us</b></a></li>
<li><a href="#nogo"><b>Contact us</b></a></li>
<li><a href="#nogo"><b>Search</b></a></li>
</ul>

Bonsoir,

Ect-ce possible avec Mobileme ?(comme avec FTP)
chaque lien correspond à une ligne de ce genre

Code:

<li><a href="#nogo"><b>Home</b></a></li>

Home est le nom qui apparait dans la barrière, #nogo est la destination du lien
remplacez #nogo par l'adresse de votre page par ex.

Code:

<li><a href="http://www.etsicetaitvrai.be/Site/Bienvenue.html"><b>Home</b></a></li>

rajouter target="_top" dans la balise

Code:

<a href="http://www.etsicetaitvrai.be/Site/Bienvenue.html">

ce qui donne :

Code:

<li><a href="http://www.etsicetaitvrai.be/Site/Bienvenue.html" target="_top"><b>Home</b></a></li>

3) A l'aide d'un client FTP, mettez le dossier à la racine de votre FTP ( dossier www ou web ou public_html) à côté de votre dossier Site et de votre page index.html
L'adresse de votre page de menu correspond l'arborescence des fichiers :

http://www.etsicetaitvrai.be/pro_one/pro_one.html

= une page pro_one.html dans un dossier pro_one lui même placé à la racine du site (= http://www.etsicetaitvrai.be)
dans un widget fragment html placer le code suivant :

Code:

<script language="Javascript">
window.location="http://www.etsicetaitvrai.be/pro_one/pro_one.html";
</script>

le menu n'apparaitra pas dans iWeb mais sera visible une fois la page publiée sur le net avec votre navigateur. Donc pensez à redimensionner le widget fragment HTML aux dimensions probable du menu.

Bonsoir,

Est-ce possible avec Mobileme? (Vous parlez d'éditer avec FTP)

[koeklin]

Aucun souci

[lucien de montmartre]

ici http://www.cssplay.co.uk/menus/pro_horizontal.html (c'est celui du haut)
tant que vous y êtes Autant visiter le site entier http://www.cssplay.co.uk/

Tuto pour ce menu pro_one : à vous de l'adapter si vous en choisissez un autre
1) télécharger le fichier zippé, dézippez-le.
2) éditer la page pro_one.html avec un éditeur de texte (pas TexteEdit, préférez Smultron (gratuit)).

Code:

<ul class="menu1">
<li><a href="#nogo"><b>Home</b></a></li>
<li class="current"><a href="#nogo"><b>Privacy Policy</b></a></li>
<li><a href="#nogo"><b>Products</b></a></li>
<li><a href="#nogo"><b>Where to find us</b></a></li>
<li><a href="#nogo"><b>Contact us</b></a></li>
<li><a href="#nogo"><b>Search</b></a></li>
</ul>

chaque lien correspond à une ligne de ce genre

Code:

<li><a href="#nogo"><b>Home</b></a></li>

Home est le nom qui apparait dans la barrière, #nogo est la destination du lien
remplacez #nogo par l'adresse de votre page par ex.

Code:

<li><a href="http://www.etsicetaitvrai.be/Site/Bienvenue.html"><b>Home</b></a></li>

rajouter target="_top" dans la balise

Code:

<a href="http://www.etsicetaitvrai.be/Site/Bienvenue.html">

ce qui donne :

Code:

<li><a href="http://www.etsicetaitvrai.be/Site/Bienvenue.html" target="_top"><b>Home</b></a></li>

3) A l'aide d'un client FTP, mettez le dossier à la racine de votre FTP ( dossier www ou web ou public_html) à côté de votre dossier Site et de votre page index.html
L'adresse de votre page de menu correspond l'arborescence des fichiers :

http://www.etsicetaitvrai.be/pro_one/pro_one.html

= une page pro_one.html dans un dossier pro_one lui même placé à la racine du site (= http://www.etsicetaitvrai.be)
dans un widget fragment html placer le code suivant :

Code:

<script language="Javascript">
window.location="http://www.etsicetaitvrai.be/pro_one/pro_one.html";
</script>

le menu n'apparaitra pas dans iWeb mais sera visible une fois la page publiée sur le net avec votre navigateur. Donc pensez à redimensionner le widget fragment HTML aux dimensions probable du menu.

J'ai suivi le processus en changeant l'adresse de Momix et en mettant la mienne... résultat: rien...

[koeklin]

les causes d'erreurs sont multiples et variées si je ne vois pas les pages où vous avez intégré ce codes, je vais avoir du mal à vous aider. Un petit lien?

[lucien de montmartre]

les causes d'erreurs sont multiples et variées si je ne vois pas les pages où vous avez intégré ce codes, je vais avoir du mal à vous aider. Un petit lien?

Bon, constatant que cela ne fonctionnait pas j'ai enlevé le widget sur la page iWeb, mais le fichier pro_one.html est toujours dans le iDisk.
Voici le lien:

http://www.luciendemontmartre.com

(Dans la page accueil.)

Merci

Voilà, j'ai remis le widget:



dans la page d'accueil:



http://www.luciendemontmartre.com/Lucien_de_Montmartre/Accueil.html

[lucien de montmartre]

les causes d'erreurs sont multiples et variées si je ne vois pas les pages où vous avez intégré ce codes, je vais avoir du mal à vous aider. Un petit lien?

J'ai encore essayé, rien à faire:

http://www.luciendemontmartre.com/Lucien_de_Montmartre/Accueil.html

[koeklin]

bon ok j'ai cerné le problème
Commençons par le commencement


et le commencement commence ici :
http://www.cssplay.co.uk/menus/pro_horizontal.html
les codes que je donne dans ce topic ne sont que des extraits du fichier html du dossier téléchargé, pas le code en entier.

[lucien de montmartre]

Donc il faut que je mette le code source "entier", en changeant les urls?




C'est ça?

Merci bien...

[koeklin]

mettez le dossier entier dans votre dossier Sites (iDisk /Web /Sites)
l'url de votre page sera

Code:

http://www.votrenomdedomaine/le_nom_du_dossier/le_nom_de_la_page.html

Sinon évitez de répondre en cliquant sur le bouton "citer" il y a un bouton "répondre" au bas de la page sous le cadre de réponse rapide (à ne pas confondre avec le bouton "nouveau" qui ouvre une nouveau topic)

[lucien de montmartre]

Bon, rien à faire... je suis nul de chez nul!

[koeklin]

ouvrez la page html qui est sur votre idisk avec safari
Safari donnera une url dans la barre d'adresse (en https), en l'état vous ne pourrez pas vous en servir.
Mais je pourrais vous donner l'URL valide de cette page.

[lucien de montmartre]

file:///Volumes/luciendemontmartre-1/Web/Sites/http-::www.luciendemontmartre.com:pro_one:http-::www.luciendemontmartre.com:Lucien_de_Montmartre:Accueil.html

Voici le lien en question (le lien de la barre de menu...)
Et merci de vous donner du mal.

Et ça c'est le lien index.html:

file:///Volumes/luciendemontmartre-1/Web/Sites/Lucien_de_Montmartre/Accueil.html

[koeklin]

Désolé, j'aurais voulu plutôt l'url du fichier pro_one.html qui contient le code du menu

[lucien de montmartre]

C'est le premier lien qui contient le fichier pro_one. C'est ce lien que j'ai mis dans iDisk...

[Contenu sponsorisé]