Editer la Page d'Accueil

Bonjour! Ceci est un petit tutoriel pour les admins afin qu'ils puissent mettre à jour la page d'accueil sans trop de difficulté. Les raccourcis clavier indiqués sont sous Windows, faudra adapter pour l'équivalence avec Mac.


Mettre à jour la section "Annonces" :

- Aller dans Panneau administratif -> Affichage -> Page d'accueil -> Généralités


- Ici, il y aura une section "Message sur la page d'accueil"


Pour plus de commodités, on va copier le texte s'y trouvant dans un éditeur de texte :
Cliquer dans la fenêtre de texte puis faire "Ctrl+A" (tout sélectionner) puis "Ctrl+C" (copier) pour sélectionner tout d'un coup.

On va copier ça dans le logiciel « Bloc-notes », c'est celui qui garde la forme la plus lisible. Faites une petite reherche Windows si vous ne l'avez pas sous la main. On peut utiliser un autre éditeur de texte si on veut, c'est histoire que tout le monde ait de quoi éditer.

Attention ! Quand je parle d'éditeur de texte, il ne faut pas prendre Word ou ses alternatives, ces éditeurs ne rendent pas le code plus lisible. Personnellement j'utilise Notepad++ qui peut se télécharger gratuitement.

- Une fois le texte collé, on recherche la section Annonces (Ctrl+R pour faire une recher par mot). Les modifications vont se faire dans la balise div align="justify":



Squelette d'une annonce sur la Page d'Accueil:

Code:

<div>

<div align="center">
<img alt="LE TITRE" src="lien de l'image" style="max-height:120px;" />
<div style="color:#008cb0 !important;" class="titre_pa">LE TITRE - 18/11/16</div>
</div><br />

Du texte suivi d'un saut de ligne<br /> Vous pouvez aller sur ce <a href="lien">lien</a>... Du texte encore suivi d'un saut de ligne<br />

<div class="signature_pa">
par Auteur
</div>

</div>
<hr />

Pour les curieux qui veulent comprendre à quoi correspondent les balises HTML :

Code:

<div>...</div> correspond à un bloc. C'est histoire de séparer les éléments (ici titre et signature).

<img /> pour mettre une image.

<a>...</a> pour mettre une lien.

<br /> permet de sauter une ligne.

<hr/> permet de tracer une ligne sur tout la longueur. Cela permet de faire un séparateur entre les annonces.

Pour le titre, il est possible de modifier la couleur en modifiant le code hexadecimal à côté de color:

Code:

<div style="color:#008cb0 !important;" class="titre_pa">LE TITRE - 18/11/16</div>

Exemple d'application :

Code:

<div>

<div align="center">
<img alt="Design 5.0" src="https://i37.servimg.com/u/f37/19/31/25/30/nf_pa_10.png" style="max-height:120px;" />
<div style="color:#008cb0 !important;" class="titre_pa">Design 5.0! - 18/11/16</div>
</div><br />

Alola tout le monde! Pour la sortie des nouveaux jeux Pokémon Soleil et Pokémon Lune, Nuzlocke France change de tenue! On espère que ça vous plaît! Faut dire que j'ai quand même beaucoup bosser dessus, je vais pas vous le cacher...<br /> Vous pouvez <a href="http://nuzlocke-france.forumgratuit.org/t962-design-forum-4-0">donner votre avis sur ce sujet et reporter d'éventuels bugs d'affichage</a>... On est jamais à l'abri... Je sais qu'ils sont là à nous guetter... AAAAAAAAAAH! <br />

<div class="signature_pa">
par Phiphi
</div>

</div>
<hr />

Ce qui donne sur la page d'accueil :



Mettre à jour la section "Recrutement" :

Même chose que tout à l'heure, sauf qu'il faut chercher la section Recrutement sur Bloc-notes et il n'y a pas de squelette pré-établi cette fois.


Petits conseils :

- Eviter les annonces trop longues. Si vous voulez vraiment détailler des choses, il est mieux de créer un sujet et ensuite mettre un lien vers ce sujet. Le but est de donner une infomation à quelqu'un rapidement, donc les pavés c'est pas tellement adapté.

- Ajouter une image avec le titre. Ca donne un indicateur de nouveauté plus impactant : une nouvelle image → une nouvelle annonce. C'est plus visible que juste un nouveau titre.