Comment faire un menu qui se reproduit sur toutes les pages?

Le premier forum francophone sur l'éditeur de pages Web multiplateforme (Linux, Mac OS X, Windows) qui monte… KompoZer, héritier de Nvu, permet de créer vos pages Web graphiquement (wysiwyg) sans aucune connaissance du langage HTML.

Modérateur : chinon37

pralou
Salamandre
Messages : 27
Inscription : 24 janv. 2008, 13:00

Message par pralou »

bonjour,

Pour ma part, pour prendre un modèle de page htlm , j'ouvre un fichier correpondant à ma page modèle, je modifie quelques infos sur ma page, et "j'enregistre sous "ma page avec un autre nom. Pourquoi faire compliquer quand on peut faire simple !

pralou

Message envoyé avec : Mozilla/4.0 (compatible; MSIE 6.0; Windows NT 5.0; SIMBAR={103758F8-3C0A-4063-9D08-E422C22A8DA3})
Ymai
Tyrannosaurus Rex
Messages : 4220
Inscription : 12 mars 2005, 11:36

Message par Ymai »

Bonjour
Que se passe-t-il si le menu doit recevoir une rubrique supplémentaire, un jour?
La solution de la page "modèle" est bonne, mais elle ne permet pas de résoudre le problème que je mentionne ici.
Si le menu est fait en un endroit centralisé, il suffit de modifier cette unique occurrence pour qu'elle soit reprise dans toutes les pages.

Ceci dit, la méthode telle qu'expliquée dans ce topic gagnerait à être récrite de zéro.
ymai
« Un enfant de cinq ans comprendrait cela ! Allez me chercher un enfant de cinq ans ! »
Groucho Marx.
Ymai
Tyrannosaurus Rex
Messages : 4220
Inscription : 12 mars 2005, 11:36

Re: Comment faire un menu qui se reproduit sur toutes les pa

Message par Ymai »

[Edit: 30/08/2008]Pour une version propre et illustrée de la procédure, voir http://josar.free.fr/tutoKompozer/MenuM ... nclus.html
[/Edit]
Je reprends et tente de simplifier au maximum la procédure telle qu'elle peut être mise à profit dans KompoZer.
Merci de corriger ce qui doit l'être. Le but étant de permettre la publication d'une méthode simple et claire.

Comment réaliser un menu dont le contenu puisse être modifié et qui, après modification, sera reproduit sur toutes les pages du site web, sans qu'il soit nécessaire d'éditer chaque page?

Ci-dessous, quelques éléments de réponse.

Préalables
- Il est nécessaire d'avoir un hébergeur qui supporte le PHP
- L'éditeur utilisé est KompoZer et pas NVU qui n'est plus supporté.
- L'ajout de l'extension Handcoder est fortement recommandée pour permettre simplement l'édition des pages .php qui seront produites.
- On dispose parallèlement d'un éditeur de texte brut du type NotePad++ (sous Windows), Scite, Quanta+, Gedit,...

Méthode

- Un menu sera idéalement formé d'une liste non ordonnée, encore appelée "liste à puces".
- Cliquer n'importe où dans ce menu, de manière à faire apparaître la balise <ul> correspondant à la liste non ordonnée dans la barre d'état, au bas de la fenêtre de KompoZer
- Cliquer du bouton droit sur cette balise <ul> pour faire apparaître un menu contextuel.
- Dans ce menu, choisir la commande "Code HTML..."
- Une fenêtre s'ouvre: le code HTML du menu y apparaît. Quelque chose comme

Code : Tout sélectionner

<ul>
  <li><a href="page1.html">item1</a></li>
  <li><a href="page2.html">item2</a></li>
  <li><a href="page3.html">item3</a></li>
  <li><a href="page4.html">item4</a></li>
</ul>
- Sélectionner l'ensemble (Ctrl + A) et le copier (Ctrl + C)
- La fenêtre peut être fermée sans autre forme de procès.

- Ouvrir, par ailleurs, un logiciel d'édition de texte brut.
- Coller le texte provenant de la manipulation précédente (Ctrl + V)
- Enregistrer le document sous le nom "menu.inc.html" ou n'importe quel autre nom qui convient. L'extension .php n'est nécessaire que si le code collé contient du PHP.

- Revenir à KompoZer.
- La balise correspondant au menu est toujours sélectionnée.
- Dans le menu "Insertion", choisir la commande "Code PHP..."
- Dans la fenêtre qui apparaît, écrire l'instruction suivante:

Code : Tout sélectionner

include ("menu.inc.html");
- Cliquer sur OK pour fermer la fenêtre contenant ce bout de code.
- Dans la page, le menu est remplacé par un petit rectangle jaune dans lequel on peut lire la mention PHP
- Dans le menu "Fichier", sélectionner la commande "Enregistrer Sous..."
- Changer l'extension du fichier: .html est remplacé par .php

- Procéder de même dans toutes les pages qui contiennent le menu:
  • * remplacement du menu par le code PHP mentionné plus haut.
    * enregistrement de la page avec l'extension .php
Il reste maintenant à corriger le code du menu. En effet, tous les liens pointent vers des pages .html (Exemple: page1.html) qui sont fort probablement devenues des pages .php (Exemple: page1.php)
Dans l'exemple présenté ci-dessus, le code deviendrait

Code : Tout sélectionner

<ul>
  <li><a href="page1.php">item1</a></li>
  <li><a href="page2.php">item2</a></li>
  <li><a href="page3.php">item3</a></li>
  <li><a href="page4.php">item4</a></li>
</ul>
- Dans le logiciel d'édition de texte brut, remplacer les extensions .html par les extension .php
- Enregistrer le document modifié.

A partir de ce moment, toute modification du menu ne doit plus être faite que dans ce fichier "menu.inc.html". Elle sera répercutée automatiquement dans toutes les pages où le code PHP d'appel du menu aura été inséré.

Épilogue et avertissements
Attention! Les pages .php ne peuvent plus être visualisées directement dans le navigateur par un simple clic sur l'icône "Navigateur" de la barre d'outils. Elles doivent obligatoirement être interprétées par un serveur web qui "comprend" le PHP.
Deux possibilités:
1. Voir le résultat sur le serveur web distant; ce qui oblige à télécharger les pages par FTP pour pouvoir les visualiser.
2. Installer un serveur du type Easy PHP, Wamp Server,... sur l'ordinateur local.

Une petite difficulté pourrait survenir si le fichier "menu.inc.html" contient des caractères accentués (ces caractères sont alors remplacés par des signes différents). Dans ce cas, vérifier que le logiciel d'édition de texte pur utilise bien le même encodage que KompoZer:
> Outils > Préférences > Paramètres de page > Encodage

Pour éditer très simplement les pages .php depuis le "Gestionnaire de sites", installer l'extension Handcoder.

De nombreux points de la procédure décrite ci-dessus sont de la plume de Kazé. Merci à lui.

Message envoyé avec : Mozilla/5.0 (X11; U; Linux i686; fr; rv:1.9) Gecko/2008061015 Firefox/3.0
ymai
« Un enfant de cinq ans comprendrait cela ! Allez me chercher un enfant de cinq ans ! »
Groucho Marx.
Invité

Message par Invité »

Bonjour, je n'arrive pas à installer Handorcer et Nsmcontext. Voici le message d'erreur que je reçois. Pouvez-vous m'aide à arranger ce problème.

Voici le message d'erreur que je reçois "Impossible d'installer NsmConText 0.3.1, car il/elle n'est pas compatible avec Firefox 3.0.1"


Merci de votre aide

Message envoyé avec : Mozilla/5.0 (Windows; U; Windows NT 5.1; fr; rv:1.9.0.1) Gecko/2008070208 Firefox/3.0.1
zigloom
Salamandre
Messages : 26
Inscription : 03 sept. 2008, 13:34

Message par zigloom »

Anonymous a écrit :Bonjour, je n'arrive pas à installer Handorcer et Nsmcontext. Voici le message d'erreur que je reçois. Pouvez-vous m'aide à arranger ce problème.

Voici le message d'erreur que je reçois "Impossible d'installer NsmConText 0.3.1, car il/elle n'est pas compatible avec Firefox 3.0.1"


Merci de votre aide

Message envoyé avec : Mozilla/5.0 (Windows; U; Windows NT 5.1; fr; rv:1.9.0.1) Gecko/2008070208 Firefox/3.0.1
C'est encore moi Zigloom, l'invité qui vient de poser la question
Paix cordiale
Fabrice.Tres.Net
Tyrannosaurus Rex
Messages : 2390
Inscription : 26 juin 2006, 12:50

Message par Fabrice.Tres.Net »

Handcoder et Nsmcontext sont des extensions pour Kompozer!

Tu es en train de les installer sous Firefox.

Il faut enregistrer ces 2 extensions sur ton disques puis les installer dans Kompozer.
Pour ce, sous Firefox, faire un clic droit sur le lien vers l'extension et ensuite "enregistrer sous " .
Ensuite sous Kompozer, Outils >Modules complementaires ou extensions > Installer

édité: typo
Dernière modification par Fabrice.Tres.Net le 14 sept. 2008, 11:10, modifié 1 fois.
ToutiWeb
Lézard à collerette
Messages : 327
Inscription : 19 août 2008, 17:51

Message par ToutiWeb »

Merci pour ce tuto très complet... je commence à le suivre et je tatonne déjà ...notepas ++ je n'y ai rien absolument rien compris rien qu'après le téléchargement j'étais bloquée... donc j'ai téléchargé celui-ci
http://editxper.online.fr/index.htm
dans l'espoir d'y arriver avec cet éditeur de texte ... hé oui j'en suis seulement au matériel nécessaire ^^hihihihi
la suite dans mes prochaines aventures !
(merci encore de nous aider)


Message envoyé avec : Mozilla/4.0 (compatible; MSIE 7.0; Windows NT 5.1; .NET CLR 2.0.50727; .NET CLR 1.1.4322)
zigloom
Salamandre
Messages : 26
Inscription : 03 sept. 2008, 13:34

Message par zigloom »

Retour dans NVU à (aux) la page(s) qui doivent contenir le menu (nous avions laissé le patient sur la table d'opération).
- A l'endroit où le menu doit venir prendre place, insérer un fragment de code PHP: Insertion > Code PHP
- écrire
Code:
include ("menu.inc.php");
Je bloque à partir de là? L'endroit ou le menu doit venir? C'est la page "Index" ou pas?
Vous pouvez être plus clair s'il vous plaît quand vous écrivez "
insérer un fragment de code PHP: Insertion > Code PHP
- écrire
Code:
include ("menu.inc.php");
Merci de votre aide

Message envoyé avec : Mozilla/5.0 (Windows; U; Windows NT 5.1; fr; rv:1.9.0.1) Gecko/2008070208 Firefox/3.0.1
Paix cordiale
Ymai
Tyrannosaurus Rex
Messages : 4220
Inscription : 12 mars 2005, 11:36

Message par Ymai »

Bonjour
Et cette version-là n'est-elle pas plus compréhensible?
http://josar.free.fr/tutoKompozer/MenuM ... nclus.html

Message envoyé avec : Mozilla/5.0 (X11; U; Linux i686; fr; rv:1.9.0.1) Gecko/2008072820 Firefox/3.0.1
ymai
« Un enfant de cinq ans comprendrait cela ! Allez me chercher un enfant de cinq ans ! »
Groucho Marx.
zigloom
Salamandre
Messages : 26
Inscription : 03 sept. 2008, 13:34

Message par zigloom »

merci, j'ai réussi à faire le menu. Mais un autre blem. Quand j'ouvre le site via IE, les liens ne fonctionnent. savez-vous ou se trouve sa solution. Merci

Message envoyé avec : Mozilla/5.0 (Windows; U; Windows NT 5.1; fr; rv:1.9.0.1) Gecko/2008070208 Firefox/3.0.1
Paix cordiale
Invité

Message par Invité »

Bonsoir,

personne n'a la solution? Merci pour vos commentaires. Je pense que le conflit entre IE et Firefox fait des victimes innocents. A l'aide

Message envoyé avec : Mozilla/5.0 (Windows; U; Windows NT 5.1; fr; rv:1.9.0.1) Gecko/2008070208 Firefox/3.0.1
Ymai
Tyrannosaurus Rex
Messages : 4220
Inscription : 12 mars 2005, 11:36

Message par Ymai »

Merci de fournir une adresse web ou le code d'une page qui pose problème. Là, comme ça, c'est difficile de trouver.

Message envoyé avec : Mozilla/5.0 (X11; U; Linux i686; fr; rv:1.9.0.1) Gecko/2008072820 Firefox/3.0.1
ymai
« Un enfant de cinq ans comprendrait cela ! Allez me chercher un enfant de cinq ans ! »
Groucho Marx.
zigloom
Salamandre
Messages : 26
Inscription : 03 sept. 2008, 13:34

Message par zigloom »

Code : Tout sélectionner

<a
 href="http://www.arkf-kanel.com/Qui_sommes_nous.html"><button>
Qui
sommes-Nous?</button>&nbsp;&nbsp;</a><a
 href="http://www.arkf-kanel/connaitre_kanel.html"><button>Connaître
Kanel</button></a><a
 href="http://www.arkf.com/Projet1.html"><button>Nos
projets & partenaires</button></a><a
 href="http://www.arkf-kanel.com/Realisations.html"><button>Nos
réalisations</button></a><a
 href="mailto:arkf@arkf-kanel.com"><button>Pour
nous contacter</button></a>
Merci par avance de votre aide

Message envoyé avec : Mozilla/5.0 (Windows; U; Windows NT 5.1; fr; rv:1.9.0.1) Gecko/2008070208 Firefox/3.0.1
Paix cordiale
Gagea
Iguane
Messages : 627
Inscription : 20 juil. 2008, 10:25

Message par Gagea »

Bonjour,
Je débute aussi, comme toi, mais si c'est le code de ta page menuinc.html que tu as envoyé, je vois que tu n'as pas modifié, dans le code de cette page les extensions des fichiers dans lesquels tu as inclus le menu : au lieu de Qui_sommes_nous.html il faudrait qu'il y ait Qui_sommes_nous.php
On va attendre que Ymai ait de temps de te répondre pour savoir si ce que je te dis est la bonne réponse.

Message envoyé avec : Mozilla/5.0 (Windows; U; Windows NT 5.1; fr; rv:1.9.0.1) Gecko/2008070208 Firefox/3.0.1
zigloom
Salamandre
Messages : 26
Inscription : 03 sept. 2008, 13:34

Message par zigloom »

Merci d'avoir tenté. mais le problème est plus profond car les pages ne s'affichent pas pareils selon qu'on utilise Firefox ou IE. Les liens fonctionnent avec Firefox, j'ai pas de problème à ce niveau. C'est IE qui fait des caprices.

Merci

Message envoyé avec : Mozilla/5.0 (Windows; U; Windows NT 5.1; fr; rv:1.9.0.1) Gecko/2008070208 Firefox/3.0.1
Paix cordiale
Répondre

Qui est en ligne ?

Utilisateurs parcourant ce forum : Aucun utilisateur inscrit et 3 invités