Bienvenue sur Ace Design. Ici vous trouverez tout ce qu'il faut pour personnaliser au maximum votre forum Aceboard. Il y a actuellement 4 visiteur(s) connecté(s) sur AceDesign !
| Accueil | Inscription | Le Forum | Le Livre d'or   

Faire un pied de page


Cette rubrique est déstinée aux administrateurs de forums qui veulent un pied de page mais qui ne conaissent rien au HTML. Je vous propose ici de quoi faire un pied de page de la forme de votre choix et aux couleurs de votre choix, et cela sans utiliser de logiciel particulier : le bloc note devrait suffire.

Voici donc comment nous allons travailler (hé oui, il va falloir travailler un peu),
  • J'ai conçu différents modèles de pieds de pages que vous n'aurez plus qu'à remplir, disponibles ici. 
  • Pour les remplir, vous aurez par contre besoin de quelques notions en html que je vais détailler ci dessous.
  • Enfin, pour améliorer votre pied de page, je vous invite à consulter la rubrique d'astuces.
Commençons donc par regarder comment fonctionne le html. Si vous voulez des tutoriaux très complets sur le html, cliquez ici, sinon, lisez la suite.

Je crois qu'il est temps de se lancer...

HTML : Les bases pour un pied de page



Nous allons donc voir dans un premier temps comment mettre en forme un texte, le tableau parlera pour moi.

Mise en forme Code correspondant
Mise en gras d'un texte <span style="font-weight: bold;"> Le texte à mettre en gras </span>
Mise en Italique <span style="font-style: italic;"> Le texte à mettre en Italique </span>
Soulignement <span style="text-decoration: underline;"> Le texte à souligner </span>
Modification de la police <span style="font family: Verdana;"> Le texte à souligner </span>

Remplacer Verdana par le nom de la police désirée.
Modification de la taille <span style="font-size: Xpt;">Le texte à modifier </span>

Remplacer X par la taille du texte désirée.
Modification de la couleur <span style="color: #XXXXXX;">Le texte à colorer</span>

Remplacer XXXXXX par le code de la couleur désirée.

Comme vous l'aurez compris, ce qui apparaît en bleu est votre texte.
Si vous voulez mettre un gras seulement une partie du texte, il faut faire le code suivant:
Le début du texte<span style="font-weight: bold;"> La partie à mettre en gras</span> la fin du texte.
Bien entendu, vous pouvez faire de même pour chaque type de mise en form, ceci n'était qu'un exemple, mais je pense que vous aviez compris.

Evidemment,  un texte peut être à la fois souligné et en gras. Ces codes  sont donc cumulables. Dans ce cas, les parties qui apparaît en rouge dans mes codes sont à mettre les unes à la suite des autres.
Ainsi, le code d'un texte en gras, souligné, et italique serait :
<span style="font-weight: bold; font-style: Italic; text-decoration: underline;"> Le texte à modifier </span>
C'est de cette façon qu'il vous faudra donc procéder chaque fois que vous voudrez cumuler plusieurs types de mise en forme.

J'ai omis de préciser une chose très importante, mais nous y venons: lorsque vous voudrez passer à la ligne, si vous appuyez sur la touche "entrée", vous constaterez vite que ça ne fonctionnera pas. Pour afficher un passage à la ligne, il vous faudra pacer la balise <br> entre les deux lignes. Pas de panique, voici un petit exemple pour vous eclaircir les idées:
<span style="font-weight: bold; font-style: Italic; text-decoration: underline;">  Ligne1
 ligne2 </span>
Si vous tapez le bout de code ci dessus dans votre code html, ligne 1 et ligne 2 sertont écrits l'un à coté de l'autre ans votre pied de page.
Il nous faudra donc écrire dans le code html le bout de code ci dessous:
<span style="font-weight: bold; font-style: Italic; text-decoration: underline;"> Ligne1
<br> ligne2 </span>


C'est reparti pour un tour avec le CSS



Vous avez sans doutes remarqué que mes codes en rouge dans le paragraphe précédent ressemblent étrangement à des propriétés CSS ... Cela est tout à fait vrai, le CSS va nous servir pour définir l'apparance du pied de page. Si vous ne connaissez pas le CSS, un coup d'oeil sur cette page vous sera indispensable.
Ne vous inquiétez pas, cela sera très rapide, et sans comparaison avec le CSS d'un forum, on n'utilisera même pas de pseudos classes .
Les propriétés que nous aurons besoin d'utiliser seront les fonds des cellules, les bordures, les alignements, ety bien sur les modificaions des couleurs de texte. Vous pourrez bien sur en utiliser plus si vous le désirez.
Les propriétés s'appliquerons dans les modèles de pieds de page que j'ai crées pour vous:
il vous suffira de les mettre à la place du texte en rouge, sans oublier de séparer chaque propriété par un ;.
<td style="propriétés à appliquer à la colonne de gauche"> Le contenu de la colonne de gauche </span>

Et voilà, je n'en dit pas plus, avec ce que vous venez de lire, vous êtes prêts à choisir un modèle de pied de page et à le remplir.

Heu... dernière petite chose



Une fois votre pied de page modifié à votre guise grâce au bloc notes, enregistrez le sous le nom "pied.html". Vous pouvez ensuite fermer le bloc notes, et ouvrir le pied que vous avez crée (avec le navigateur internet) en double cliquant dessus. Si ce pied vous convient, on l'heberge. Si vous voulez remodifier quelque chose, faites un clic-droit sur l'icône de ce fichier, puis ouvrir avec, et selectionnez "bloc notes" (ou notpad), enfin, faites les modifications désirées.

J'ai parlé d'héberger ... pas d'inquiétudes, cela est très simple. Rendez vous sur Voila, et laissez vous guider pour créer votre espace d'hebergement, vous n'avez ensuite plus qu'à envoyer ce pied de page dans votre hebergement.

Cette fois, c'est vraiment fini, passons à l'étape suivante.

© AceDesign, réalisé par Zell - La construction de ce site a demandé beaucoup de temps et d'efforts, merci de respecter le travail fourni. - Pour me contacter, merci de laisser un message sur le forum ou de m'envoyer un message privé.