Débuter sur iWeb : le menu

4 juil. 10

Il existe plusieurs façons de naviguer dans son site :

le menu de navigation d’iWeb

les liens que l’on peut aussi organiser sous la forme d’un menu personnalisé

les menus au sein de fragments HTML

Par défaut, il est activé.

Ses réglages (limités) sont accessibles via l’inspecteur > Page > Page (voir image ci-contre) :

Vous pouvez choisir

1. d’afficher une page ou non au sein du menu

2. sur chacune de vos pages d’afficher ou non ce menu

Pour les blogs et les podcasts, seule la page d’accueil peut «figurer au menu», les entrées et la page d’archives non. Les pages Photos qui dépendent d’un album, elles aussi seront absentes, on y accède via la page «Albums».

Si vous souhaitez avoir deux menus différents (dans le cas d’un site multilingue par ex.), je vous conseille d’avoir plusieurs sites (un site sur iWeb correspond à un dossier sur votre serveur (FTP ou MobileMe) ou votre Mac, vous pouvez avoir plusieurs dossiers sur votre serveur et donc plusieurs sites sur iWeb).

Ajouter une page externe au site fait par iWeb n’est pas une option proposée, néanmoins

il existe des solutions avec un p’tit bout de code en JavaScript dans un fragment HTML :

•soit pour ajouter artificiellement un nouvel item de votre choix au menu (wyodor)
•soit pour rediriger une page (modèle Vide) inscrite au menu vers la page de votre choix (clubiweb).

Dans les deux cas, le résultat sera le même, vous aurez un item du menu vous pointant vers une page externe.

les désavantages :

Ce menu sera le même pour toutes les pages du site qui l’afficheront.

Comme de nombreuses fonctions d’iWeb, le menu nécessite d’avoir le JavaScript activé sur le navigateur de vos visiteurs sinon il risque de voir en lieu et place qu’un point.

un point à la place du menu

Ce menu n’est pas personnalisable facilement : on ne peut changer ni sa police ni ses couleurs qui dépendent directement du thème utilisé. Seule sa largeur peut être modifiée.

Une zone de texte, quelques liens vers ses propres pages. Quoi de plus simple que de faire son propre menu.

Sélectionnez un mot, un groupe de mots, une image ou une figure

Un exemple de menu horizontal tout simple :

Accueil Archive forum

L'inconvénient,

c’est qu’il faut le copier sur toutes les pages. Pour ma part, pour créer une nouvelle page, je me contente de dupliquer une page me servant de modèle et contenant le menu.

Les avantages :

Pas de difficulté pour ajouter une page externe (si on possède son URL)

Proposer des menus différents selon les pages

Personnalisation : proposer des menus sous forme de listes, la couleur , la taille de la police de son choix.
Par ex. un menu sous forme de liste police "A bite":

Comme quoi, il ne faut pas grand-chose pour « agrémenter » son site web d'un menu moche qui ne plait qu’à soi.

Cette méthode est à réserver aux menus plus complexes. J’avais donné quelques exemples :

‣le menu en accordéon (HTML, CSS, JavaScript). Voir exemple ci-contre et la page de tuto.
‣un menu minimal en flash pour illustrer la page «du code HTML dans un widget»

Concernant les menus en HTML ,CSS +/- JavaScript, de nombreux sites donnent des codes pour faire son propre menu comme Dynamicdrive . Il faut souvent modifier ces codes pour que les liens s’ouvrent dans la même fenêtre de navigateur et non dans l’emplacement du widget (par ex. en ajoutant target="_top" dans la balise HTML de lien) : je vous invite donc, à vous intéresser à la page «menu en accordéon», si vous récupérez de tels codes. ------------------>

Autre modèle de menu, le menu horizontal "drop down" fait avec l'aide du site cssmenumaker . Vous trouvez un tutoriel ici

Vous trouverez aussi différentes méthodes pour intégrer un menu dropdown dans un site iWeb, tutos en anglais "approximatif", sur ce mini-site : http://iweb.debutersurmac.com/menu/map.html.

Commentaires | Accueil Archives Précédent Suivant Forum Mon Twitter Débuter sur Mac

Liens :