Graphisme et Mise en forme

Images en libre service à l'usage des membres et des modérateurs.


séparateurs
























Logo officiel pour Poudlard




autres:




d'autres logos ici

La mise en forme des messages: les BBCodes

BBCode est l'abréviation de Bulletin Board Code, une simplification du langage HTML utilisée pour mettre en forme les messages de forums de discussion. Par abus de langage, les éléments du BBCode sont appelés balises. Le nom d'une balise est délimité par les crochets [ et ], contrairement au HTML où les caractères < et > sont utilisés. Certaines balises ont une propriété, aussi appelée attribut, dont la valeur est assignée à la balise elle-même à l'aide du symbole =. (source: wikipedia)


Le principe c'est que pour la mise en forme de votre texte, il suffit d'entourer votre texte ou la partie du texte concerné par les balises entre crochets. Un code de début et un code de fin:

Gras

Code:

[b]votre texte[/b]

Je suis certain qu'il y a des balises que vous ne connaissez pas

Italique

Code:

[i]votre texte[/i]

Je suis certain qu'il y a des balises que vous ne connaissez pas

Souligné

Code:

[u]votre texte[/u]

Je suis certain qu'il y a des balises que vous ne connaissez pas

Barré

Code:

[strike]votre texte[/strike]

Je suis certain qu'il y a des balises que vous ne connaissez pas

Police

Code:

[font=Courier New]votre texte[/font]
[font=Times New Roman]votre texte[/font]
[font=Impact]votre texte[/font]
[font=Verdana]votre texte[/font]
[font=Arial Black]votre texte[/font]
[font=Comic Sans Ms]votre texte[/font]
[font=Georgia]votre texte[/font]

Je suis certain qu'il y a des balises que vous ne connaissez pas
Je suis certain qu'il y a des balises que vous ne connaissez pas
Je suis certain qu'il y a des balises que vous ne connaissez pas
Je suis certain qu'il y a des balises que vous ne connaissez pas
Je suis certain qu'il y a des balises que vous ne connaissez pas
Je suis certain qu'il y a des balises que vous ne connaissez pas
Je suis certain qu'il y a des balises que vous ne connaissez pas

Alignement à gauche

Code:

votre texte

Je suis certain qu'il y a des balises que vous ne connaissez pas

Centré

Code:

[center]votre texte[/center]

Alignement à droite

Code:

[right]votre texte[/right]

Justifié

Code:

[justify]votre texte[/justify]

Taille

Code:

[size=15]votre texte[/size]

vous pouvez mettre n'importe quelle valeur de taille allant de 1 à 29
Je suis certain qu'il y a des balises que vous ne connaissez pas
Je suis certain qu'il y a des balises que vous ne connaissez pas
Je suis certain qu'il y a des balises que vous ne connaissez pas
Je suis certain qu'il y a des balises que vous ne connaissez pas
Je suis certain qu'il y a des balises que vous ne connaissez pas
Je suis certain qu'il y a des balises que vous ne connaissez pas
Je suis certain qu'il y a des balises que vous ne connaissez pas
Je suis certain qu'il y a des balises que vous ne connaissez pas

Indice

Code:

X[sub]indice[/sub]

Vous connaissez la voie 9_¾ ?

Exposant

Code:

7[sup]ème[/sup] année

7^ème année

Caché

Code:

[hide]votre texte[/hide]

A savoir que le texte que vous cachez sera caché pour les personnes qui ne postent pas dans le sujet avec vous, mais les admins et les modo peuvent voir le texte caché sans avoir à poster dans le sujet (c'est mieux que de mettre des trucs en noir sur fond noir )

Spoiler

Code:

[spoiler]Je suis certain qu'il y a des balises que vous ne connaissez pas[/spoiler]

Spoiler:

Citer

Code:

[quote]votre texte[/quote]

Citation :

Je suis certain qu'il y a des balises que vous ne connaissez pas

Citer avec un auteur

Code:

[quote="votre auteur"]votre autre texte[/quote]

Enki, le roi de la balise a écrit:

Je suis certain qu'il y a des balises que vous ne connaissez pas

Code

Code:

[code]votre texte avec ses codes[/code]

Code:

 <object width="200" height="200"><param name="movie" value="http://www.youtube.com/v/1_5EZ_OIVvE&hl=en&fs=1"></param><param name="allowFullScreen" value="true"></param><embed src="http://www.youtube.com/v/1_5EZ_OIVvE&hl=en&fs=1" type="application/x-shockwave-flash" allowfullscreen="true" width="200" height="200"></embed></object>

Sans la balise code:


Similaire à la balise "quote", la balise "code" permet de préserver le formatage du texte. Ce qui est bien utile pour afficher du code de programmation ou des lignes html, par exemple, mais je pense pas que vous en ferez ça

Liste

Code:

[list]votre texte[/list]

Je suis certain qu'il y a des balises que vous ne connaissez pas

Lister avec une puce

Code:

[list][*]votre texte[/list]

• Je suis certain qu'il y a des balises que vous ne connaissez pas
  
• Je suis certain qu'il y a des balises que vous ne connaissez pas
  
• Je suis certain qu'il y a des balises que vous ne connaissez pas
  
• Je suis certain qu'il y a des balises que vous ne connaissez pas

Liste numérique

Code:

[list=1][*]votre texte[/list]

1. Je suis certain qu'il y a des balises que vous ne connaissez pas
   
2. Je suis certain qu'il y a des balises que vous ne connaissez pas
   
3. Je suis certain qu'il y a des balises que vous ne connaissez pas
   
4. Je suis certain qu'il y a des balises que vous ne connaissez pas

Liste alphabétique

Code:

[list=a][*]votre texte[/list]

1. Je suis certain qu'il y a des balises que vous ne connaissez pas
   
2. Je suis certain qu'il y a des balises que vous ne connaissez pas
   
3. Je suis certain qu'il y a des balises que vous ne connaissez pas
   
4. Je suis certain qu'il y a des balises que vous ne connaissez pas

Multi liste

Code:

[list]votre premier texte[*]votre texte[/list]
[*]votre texte[/list][/list]

• Je suis certain qu'il y a des balises que vous ne connaissez pas
  
  
  • Je suis certain qu'il y a des balises que vous ne connaissez pas
    
  • Je suis certain qu'il y a des balises que vous ne connaissez pas

Autre liste

Code:

[list][list][*]votre texte
[*]votre texte[/list][/list]

• Je suis certain qu'il y a des balises que vous ne connaissez pas
  
• Je suis certain qu'il y a des balises que vous ne connaissez pas
  
• Je suis certain qu'il y a des balises que vous ne connaissez pas

Défiler haut/bas

Code:

[updown]votre texte[/updown]

Je suis certain qu'il y a des balises que vous ne connaissez pas

Défiler droite/gauche

Code:

[scroll]votre texte[/scroll]

Je suis certain qu'il y a des balises que vous ne connaissez pas

Lien Internet

Code:

[url]http://www.adresse-url-de-votre-site.com[/url]

http://www.adresse-url-de-votre-site.com

Mais ce forum possède une fonctionnalité appelé "Magic Links", celle-ci convertira automatiquement une url en un lien cliquable sans que vous ayez à insérer une balise BBCode. Il suffit d'écrire l'adresse.

Code:

http://www.adresse-url-de-votre-site.com

http://www.adresse-url-de-votre-site.com

Lien Internet dans un texte

Code:

[url=http://www.une-adresse-web-vers-où-vous-voulez-diriger-les-gens-qui-cliqueront-sur-le-texte-ci-apres.com]Le texte ci-après[/url]

Clique, tu seras étonné...

Mail

Code:

[email]ton-adresse-mail@hotmail.com[/email]

brad.pitt@hotmail.com

De toute façon, même chose que pour le lien Internet. Il existe un Magic Link.

Code:

brad.pitt@hotmail.com

brad.pitt@hotmail.com

Images

Code:

[img]http://www.adresse-de-votre-image.jpg[/img]

Le BBCode inclut une balise pour incorporer des images à vos messages. L’image que vous voulez afficher doit déjà être disponible sur internet (elle ne peut pas seulement exister sur votre ordinateur par exemple, à moins que votre ordinateur soit lui-même un serveur internet !)
Vous pouvez héberger gratuitement vos images sur Internet grâce aux hébergeurs d’images tel que www.servimg.com., www.imageshack.us, www.photobucket.com.

Images avec un lien

Code:

[url=http://www.adresse-de-votre-site.com/][img]http://adresse-de-votre-image.png[/img][/url]

Vous pouvez placer une image dans un lien si vous le souhaitez (c’est à vous de vous assurer que l’ordre des balises d’ouverture et de fermeture est correct).


Les couleurs

Code:

[color=red]votre texte[/color]
[color=#FF0000]votre texte[/color]

Vous pouvez utiliser les codes couleurs ou les hexadécimal au choix:

Enki en a marre des BBcodes, vous obtenez la couleur grâce à ce code :

Code:

[color=khaki]texte[/color]

Enki en a marre des BBcodes, vous obtenez la couleur grâce à ce code :

Code:

[color=orangered]texte[/color]

Enki en a marre des BBcodes, vous obtenez la couleur grâce à ce code :

Code:

[color=sienna]texte[/color]

Enki en a marre des BBcodes, vous obtenez la couleur grâce à cet hexadécimal :

Code:

[color=#CC9933]texte[/color]

Enki en a marre des BBcodes, vous obtenez la couleur grâce à cet hexadécimal :

Code:

[color=#6600CC]texte[/color]

Enki en a marre des BBcodes, vous obtenez la couleur grâce à cet hexadécimal :

Code:

[color=#6633FF]texte[/color]

Faire un tableau

Code:

[table] [tr][td] Ligne 1 - Cellule 1 [/td] [td] Ligne 1 - Cellule 2 [/td] [td] Ligne 1 - Cellule 3 [/td][/tr] [tr][td] Ligne 2 - Cellule 1 [/td] [td] Ligne 2 - Cellule 2 [/td] [td] Ligne 2 - Cellule 3 [/td][/tr][/table]

Ca va ch*er cette année	1	2
Une année sombre, ça promet	3	4

Le BBCode pour insérer un tableau dans un message est identique aux balises utilisées en HTML. Pour créer un tableau, vous devez commencer par définir un tableau ’table’ puis lui insérer une ligne ’tr’. Cette ligne peut contenir une ou plusieurs cellules ’td’, de même qu’un tableau peut contenir plusieurs lignes ’tr’.

Faire un tableau avec des cellules

Code:

[table border=1] [tr][td] Ligne 1 - Cellule 1 [/td] [td] Ligne 1 - Cellule 2 [/td] [td] Ligne 1 - Cellule 3 [/td][/tr] [tr][td] Ligne 2 - Cellule 1 [/td] [td] Ligne 2 - Cellule 2 [/td] [td] Ligne 2 - Cellule 3 [/td][/tr][/table]

Ca va ch*er cette année	1	2
Une année sombre, ça promet	3	4

Vous pouvez également rajouter des arguments dans le BBcode ’table’. Ces derniers sont identiques à ceux utiliser pour le HTML. Vous pouvez par exemple ajouter un contour au tableau ci dessus grâce à l’attribut ’border’.

Ne fonctionnant qu'avec certains navigateurs:

Flou

Code:

[blur]votre texte[/blur]

Je suis certain qu'il y a des balises que vous ne connaissez pas

Effacé

Code:

[fade]votre texte[/fade]

Je suis certain qu'il y a des balises que vous ne connaissez pas

Texte renversé verticalement

Code:

[flipv]votre texte[/flipv]

Je suis certain qu'il y a des balises que vous ne connaissez pas 

Texte renversé horizontalement

Code:

[fliph]votre texte[/fliph]

Je suis certain qu'il y a des balises que vous ne connaissez pas 

Nombre aléatoire dans une intervalle donnée

Code:

[rand]50,100[/rand]

Nombre aléatoire (50,100) :

97

Nombre aléatoire avec un maximum donné

Code:

[rand]100[/rand]

Nombre aléatoire (1,100) :

48

édité par Enki

Les boutons du forum


En haut: boutons de navigation

• FORUM pour aller sur l'index de Destination Poudlard (DP) et voir tous les forums qu'il contient
  
• ACCUEIL pour aller sur le portail, sur la page d'accueil du forum
  
• FAQ les questions techniques les plus posées sur le forum de forum actif en général
  
• GALERIE galerie pour poster ses albums photos et les faire partager
  
• SEARCH rechercher un sujet, un mot clé etc dans tout ce qui a été écrit dans DP
  
• SORCIERS liste des membres classées par date de connexion, nombre de messages, date d'inscription, maison ("location"), nom d'utilisateur dans l'ordre alphabétique ou dans l'ordre inverse de l'alphabet
  
• PROFIL c'est pour éditer, c'est à
  dire, changer les options et les préférences de son profil. C'est
  subdivisé en plusieurs pages: Informations | Préférences | Signature | Avatar | Amis et ignorés | Sujets surveillés | Favoris | Brouillons | Feuille de personnage
  
• GROUPE regarder à quel(s) groupe(s) d'utilisateurs on appartient, ou appartiennent les autres (c'est bien pour savoir qui est qui)
  
• ENTRER et QUITTER connecter/ déconnecter; toujours le faire si vous utilisez un ordinateur public ou si vous avez plusieurs compte sinon ça crée des confusions
  
• MP lire ses "hiboux" ou ses "MP" (Messages Privés). Quand vous en envoyez un, pour savoir si la personne a qui vous l'envoyez l'a lu ou pas, vous regardez dans "boite d'envoi", si votre message y est encore, l'autre ne l'a pas lu, si votre message n'y est plus, c'est que l'autre l'a lu alors, votre message a été transféré dans "messages envoyés". Vous pouvez décider d'archiver quelques messages. La capacité de vos boites MP est de 50 message en boite de réception, 30 dans messages envoyés et 60 dans messages archivés. Si vous dépassez la contenance, les messages les plus anciens disparaitront
  

nb: je mets pas le bouton enregistrer car j'imagine que si vous êtes là, c'est que vous l'avez trouvé et très bien compris à quoi il sert


Dans le forum: boutons des messages

Boîte de réception de MP:

- Je veux envoyer un nouveau hibou à quelqu'un:


- Je veux vérifier mon message ou je veux envoyer mon message


- Je veux lire un message déjà envoyé


- Je veux archiver un message et le relire



puis consulter



- Je veux vérifier qu'un message en cours a été lu

le message sera stocké et éditable dans cette section jusqu'à ce qu'il soit lu par votre correspondant




Normalement le fonctionnement des messages MP est assez intuitif, vous devriez comprendre en testant par vous-mêmes.

Faut savoir aussi que les modo et admins peuvent envoyer le même message à tout un groupe d'utilisateur


Dans les forums:

- Je veux répondre à un sujet

Cliquer sur ce bouton



Pas sur celui ci



car il sert à créer un nouveau sujet

- Je veux créer un nouveau sujet:



Mais si vous voulez créer un nouveau message alors oui il faut cliquer sur celui qui se trouve en haut à gauche du forum où on veut déposer un nouveau message


Les icônes de messages les plus importantes:

Voilà comment se présente un message à poster, il y a des boutons tout autour.



Pour connaître leur fonction, regardez après cette capture d'écran

1 permet de citer exactement la personne du message sur lequel pour cliquez pour faire la citation. C'est surtout pour réagir à une phrase directement, les balises [quote][/quote] entoureront automatiquement le corps du message, à vous de sélectionner ce que vous voulez y garder en supprimant le reste

2 permet de rééditer un message déjà envoyé, vous pouvez corriger ce que vous y avez écrit auparavant si vous voulez changer le contenu du message, préciser quelque chose, corriger une faute d'orthographe etc.

En règle générale, si on ajoute une image, une phrase etc, on précise à la fin de son message qu'on a édité, c'est à dire changé le contenu du message en indiquant "Edit:" suivi du message ajouté.
Les admins ont des couleurs d'édit qui leur ont été attribuées pour que vous reconnaissiez dans vos messages leur édit. Ils sont les seuls à avoir le droit d'éditer vos messages.
Les modo et super-modo n'ont pas le droit d'éditer un admin.
Le rouge est la seule couleur d'édit que vous n'avez pas le droit d'utiliser car c'est celle du Juge Lara Impartial.

3 permet de supprimer un message.
Vous pouvez supprimer seulement vos messages.
Seuls les modérateurs peuvent supprimer des messages s'ils sont posté dans les forums qu'ils modèrent et seuls administrateurs peuvent supprimer tout ce qu'ils veulent.
Les modo n'ont pas le droit de supprimer le message d'un admin sans leur permission.

4 selon leur rang, les modo et admins ont différentes autres options qui ne vous concernent pas

5 voir le profil d'un utilisateur

6 permet de communiquer de façon privée avec un utilisateur. Seul le MP est visible et commun pour tous. Les autres options dépendent du paramétrage de l'utilisateur

7 statut de connexion de l'utilisateur

nouveau message

Comment on met une image dans son profil?


1- Se rendre dans son profil
2- Cliquer sur le lien "avatar"
3- Vous avez différentes options:

a) Envoyer l’Avatar depuis votre ordinateur :
Il suffit de cliquer sur "Parcourir" et d’aller le chercher dans votre ordinateur. Il y a une taille et un poids maximum imposé, ce qui rend l'avatar de qualité moyenne.

b) Envoyer l’Avatar à partir d’une URL :
Entrez l’URL de l’image Avatar, elle sera copiée sur ce site.
Copiez l'url d'une image hébergée dans Internet. De la même façon qu'une image sélectionné dans votre ordinateur, la dimension et le poids de votre image ont des quotas maximum à respecter, ce qui fait que l'avatar n'est pas toujours de bonne qualité.

c) Lier l’Avatar à partir d’un autre site :
Entrez l’URL de l’image Avatar que vous voulez lier.
C'est la solution qui permet d'avoir un avatar de bonne qualité et de la dimension que vous aurez choisie. Vous pouvez l'héberger sur imageshack.us, servimg.com ou photobucket si cette image est sur votre ordinateur. L'hébergeur donnera à votre image une adresse url que vous copierez ici.





d) Sélectionner un Avatar à partir de la Galerie :
Laissez-vous guider et trouvez un avatar qui représente au mieux votre personnage de jeune sorcier. (l'option "Galerie d'Avatars" n'est pas activée pour le moment)

Pour insérer un smiley du forum Destination Poudlard dans la signature, il vous suffit de taper le code de l’image que vous souhaitez insérer ; exemple de code du forum pour le blason de serdaigle :serdaigle: (les deux points [:] définissent le code)

La dimension maximum d'un avatar doit être comprise, en pixel, entre 130x130 et 175x260.

Redimensionner votre avatar vous-mêmes
Demander de l'aide pour redimensionner une image sur Destination Poudlard

Comment met-on une image dans un message ?


Quand on compose un message, parmi les options des balises proposées, se trouve une icône « héberger une image ». Un clic sur cette icône vous renvoie sur servimg.com. Vous devez faire importer votre mot de passe (le même que celui du forum) et un compte vous sera automatiquement alloué. Ceci vous permettra d'héberger une image depuis votre ordinateur et de donner à celle-ci l'URL indispensable pour que vous puissiez la faire apparaitre dans un post.

Vous pouvez aussi passer par des hébergeurs externes comme ImageshackPhotobucket, ou par l'hébergeur de votre blog perso.


Une fois que vous avez l’URL, il vous suffit de la copier et de la coller dans la fenêtre de composition de votre message, à l'endroit où vous souhaitez la voir apparaître, en entourant l'adresse du lien direct par les balises: .

Maintenant, les hébergeurs d'images comme Imageshack ou Photobucket, vous propose instantanément plusieurs balises: html, bbcode, thumbbails etc. Vous n'avez plus qu'à copier coller.

Conseil raccourci clavier :

Le raccourci clavier de Copier est Ctrl+c
Le raccourci clavier de Coller est Ctrl+v

Lorsque votre image entourée de ses deux balises est agencée comme vous le désirez, vous pouvez "envoyer" votre message. L'image sera visualisable une fois envoyé (ou en mode WYSIWYG, selon l'option de composition que vous avez choisi pour la rédaction de vos messages sur le forum).

Astuce :

Vérifiez, avant de poster, que votre image est bonne en prévisualisant le message que vous venez d’écrire, en cliquant sur "prévisualiser". ou

Peut-on changer d'avatars autant qu'on veut?
Comment empêcher quelqu'un d'avoir le même avatar que moi?


Vous pouvez changer fréquemment d'avatar si tant est qu'il s'agisse de celui que vous avez réservé à votre arrivée.

Il est interdit de passer d'Adriana Karembeu à Jodie Foster. Il faut choisir. C'est l'une ou c'est l'autre. Lorsque votre est choix est arrêté, vous pourrez changer d'image comme bon vous semble, du moment que cela reste ou Jodie ou Adriana.

Il est recommandé de se rendre sur ce topic pour archiver et réserver les avatars que vous souhaitez garder rien que pour vous, si vous ne souhaitez pas voir votre personnage se promenant dans le forum avec un autre pseudo.

Réserver et archiver ses avatars