Franc83

Créer un menu de navigation pour voyager de billet en billet.

Avec en prime un retour sur la page d'accueil. Cette idée est née d'une découverte de RayRay sur le Forum.

L'idée intéressante est de pouvoir naviguer sur le blog de billet en billet, de pouvoir retourner à l'accueil, sans arreter une éventuelle musique de fond qui serait sur Le premier billet.

1 - Conception du projet

Comme le système des ancres ne fonctionne pas sur les Space.Live.com dans leur version classique, sauf le retour haut de page avec :

#toppage > Haut de page

#toppage > Haut de page

qui fonctionne avec toutes les pages du blog, l'idée est venue d'utiliser les id mis en place par MSN pour différencier les différentes pages, et les différents modules.

Chaque page possède son propre identifiant, nommé en html "id", dont nous allons tirer profit pour référencer les pages dans un menu, comme sur un site.

Nous vous donnons une orientation, mais il en existe d'autres, à l'aide d'images ou de boutons. C'est à vous de voir.

Nous allons créer le menu sous forme d'un tableau, avec des titres de billets servant de liens, et les mettre sur toutes les pages du blog, pour aller n'importe où sur le blog à partir de n'importe quelle page. Le tout étant de sauvegarder le menu afin de n'avoir à rajouter qu'un seul élément chez soi avant de le copier coller par dessus l'ancien quand on ajoute un billet.

2 - Les identifiants

Chaque billet est appelé non par son adresse de type url, mais par un identifiant à l'intérieur du code de MSN. C'est un peu comme son nom.

Il se présente sous la forme suivante : cns!B0F429822ED6549!474.entry

Il existe une partie commune à tous les billets, et une partie propre à chaque billet, un peu comme le nom de famille de frères et soeurs, et leurs prénoms.

partie commune : cns!B0F429822ED6549!

partie unique : 474.entry

partie spécifique au blog : B0F429822ED6549!

Attention

Ce tuto est fait avec B0F429822ED6549! qui est l'identifiant de mon blog, donc cherchez bien le votre sinon vous allez avoir des messages d'erreur.

Si vous retrouvez dans le code source de la page tous les identifiants, vous pourrez les appeler individuellement, donc charger la page correspondante.

Comment les retrouver ?

En mode visualisation ( pas celui pour créer de nouveaux billets ), et en mode blog (comme sur l'illustration), dans le navigateur (internet explorer, mozilla firefox, opera...) cliquez sur "Affichage", puis "Afficher le code source" ou "Afficher la source de la page" ou "Source", cela dépend du navigateur.

S'ouvre alors une page en code html, ne paniquez pas, nous allons lancer une recherche de texte. Cliquez dans le menu "Edition", puis "Recherchez dans la page....." ou "Recherchez...".

Une boîte de saisie s'ouvre :

Dans cette boîte de saisie, nous allons rechercher toutes les occurences du mot entrycns!B0F429822ED6549!

Vous cliquez sur suivant

Vous tombez donc sur la première occurence du mot entrycns!B0F429822ED6549! et juste à coté, le titre du billet.

Sélectionnez toute la série du nom de l'id, et faites "édition", puis "copier", ou simplement au clavier control "CTRL+C"

Vous collez cette partie sélectionnée derrière l'url de votre site :

http://nom_du_blog.spaces.live.com/blog/cns!B0F429822ED6549!474.entry

3 - Construction des liens et du menu

Vous voici donc avec votre premier lien, pour arriver à votre premier article, dont le nom suit l'id. Il vous reste à faire la même opérations jusqu'à ce qu'il n'y ait plus d'occurence de entrycns!B0F429822ED6549!, et que vous ayez les adresses de tous vos billets.

Vous fonctionnez maintenant en mode Blog, tous vos id sont sur la même page et vous pouvez passer de l'un à l'autre en mettant sous le nom du billet relié à l'id, le même menu, pour aller sur n'importe quel billet, ou revenir à la page d'accueil.

4 - Conception du projet

On va donc construire un tableau avec autant de cellules que de billets, plus une case pour le retour à l'acceuil. On peut y rajouter aussi un lien pour un album de l'album photo, en recherchant son id.

Voila donc le menu qui devra etre en tête de chaque billet, sous le titre qui sert d'id, qui permettra de naviguer dans le blog d'un billet à l'autre.

En mode "texte", pour voir le code source, voici le contenu html du tableau :

Commenter cet article

Commenter
Les messages comportant des attaques verbales contre les personnes seront supprimés. Vous pouvez renouveler le code de sécurité en appliquant un rafraîchissement à votre navigateur. Appliquer cette méthode de rafraîchissement si vous avez entré un mauvais code de sécurité.
Nom
E-mail
Site web
Titre
BBCode:
Commentaire
Code:*
	Je désire être prévenu par mail des commentaires qui suivront

Powered by AkoComment Tweaked Special Edition v.1.4.6
AkoComment © Copyright 2004 by Arthur Konze - www.mamboportal.com
All right reserved