Passer au contenu

Faciliter la navigation dans son site

Vous avez créé un site de quelques dizaines de pages. Pour améliorer son ergonomie, vous allez ajouter dans la page d’accueil une liste arborescente permettant aux…

Vous avez créé un site de quelques dizaines de pages. Pour améliorer son ergonomie, vous allez ajouter dans la page d’accueil une liste arborescente permettant aux internautes d’accéder facilement à toutes les pages du site. Cette liste sera organisée en branches, à la façon de l’Explorateur de Windows : vos visiteurs pourront dérouler et refermer des branches en cliquant sur le petit symbole placé à sa gauche.Connectez-vous à la page javascript.cooldev.com/files/COOLjsTree.zippuis décompactez le fichier téléchargé dans le dossier COOLjsTree.A l’aide du Bloc-notes de Windows, ouvrez le fichier tree1_ nodes.jssitué dans le sous-dossier menu1du dossier COOLjsTreesamples.Rendez-vous à l’adresse javascript.cooldev.com/utils/cooltreebuilder.shtml. Maintenant, définissez l’arbre du site. Tapez le titre de la page dans la zone Captionet son adresse dans la zone URL,puis cliquez sur Add Node.Procédez de même pour toutes les pages de votre site en utilisant, si nécessaire, les boutons >>Indentet <afin que l’alignement des pages respecte leur hiérarchie dans votre site. Une fois l’arbre complètement défini, cliquez sur le bouton Generate.Sélectionnez puis copiez le contenu de la zone Resultdans le Presse-papiers (Ctrl + C).Retournez dans le Bloc-notes, sélectionnez tout (Ctrl + A),puis collez les données (Ctrl + V). Transformez TREE_NODESen TREE1_NODES. A l’aide du menu Fichier, enregistrez le résultat. Pour consulter larborescence de votre site, double-cliquez sur le fichier index.htmlplacé dans le sous-dossier menu1.

🔴 Pour ne manquer aucune actualité de 01net, suivez-nous sur Google Actualités et WhatsApp.


La rédaction