Plate-forme C-G2

Communauté G2

Heures au format UTC + 1 heure

Nous sommes actuellement le Mar 07 Sep 2010, 04:22




Publier un nouveau sujet Répondre au sujet  [ 1 message ] 
Auteur Message
 Sujet du message: Tutoriel d'utilisation des BBcodes
MessagePublié: Mer 01 Avr 2009, 15:58 
Hors-ligne
Admin - Webmestre
Admin - Webmestre
Avatar de l’utilisateur

Inscrit le: Dim 14 Jan 2007, 20:12
Messages: 3243
Localisation: Chez les Marxistes !!!
Attention à bien respecter l'ordre d'ouverture et de fermeture des balises, elles doivent être enclavées obligatoirement, en quinconce ça décalera l'application des codes.


Balise BBcode "Quote"


Code:
Citation simple
[quote]Texte à citer[/quote]

Citation avec patronyme
[quote="pseudo"]Texte à citer[/quote]


Résultat citation simple
Citation:
Texte à citer


Résultat citation avec patronyme
pseudo a écrit:
Texte à citer


NDLR : un fil de discussion peut être suivi grâce à cette fonction et permet l'affichage de plusieurs citations sous forme de pyramide.
Lors d'une réponse à un sujet par exemple, on peut faire un défilement vers le bas et cliquer sur un message antérieur d'un autre auteur pour l'ajouter à l'emplacement du curseur dans la zone de saisie du texte...



_______________________________________________________________________________________________





Balise BBcode "Code"



Code:
[code][/code]


Le résultat sont les fenêtres utilisées dans ce tutoriel pour afficher les codes.

NDLR : La balise "code" permet d'inclure du code html brut pour indiquer à quelqu'un un code à appliquer quelque part par exemple pour une mise en page. Une fonction similaire est possible en désactivant les bbcodes par exemple, mais à ce moment là ça concernera tout le message et non plus une zone du texte



_______________________________________________________________________________________________




Balise BBcode "List/List="



Code:
Liste simple

[list]
Texte à lister 1
Texte à lister 2
etc...
[/list]


Liste 1,2,3...

[list=1]
[*]Texte à lister 1
[*]Texte à lister 2
[*]etc...
[/list]


Liste a,b,c...

[list=a]
[*]Texte à lister 1
[*]Texte à lister 2
[*]etc...
[/list]


Résultat liste simple

    Texte à lister 1
    Texte à lister 2
    etc...


Résultat liste 1,2,3...

  1. Texte à lister 1
  2. Texte à lister 2
  3. etc...


Résultat liste a,b,c...

  1. Texte à lister 1
  2. Texte à lister 2
  3. etc...

NDLR : Les différentes formes de liste sont très utiles lors de présentations, mise en page ou tutoriels...



_______________________________________________________________________________________________




Balise BBcode "Img"



Code:
Image simple
[img]http://miniprofile.xfire.com/bg/sh/type/1/zingk69.png[/img]

Pour les images avec lien voir ci-dessous "url&img"


Résultat image simple

Image

NDLR : Vous devez coller le lien direct de l'image/photo (Direct Link), vous pouvez suivre le tutoriel Imageshack pour apprendre à uploader une image/photo en ligne



_______________________________________________________________________________________________




Balise BBcode "URL/URLNO"



Code:
Lien simple
[url]http://iefr.c-g2.com[/url]

Lien amélioré
[url=http://iefr.c-g2.com]Association IEFR[/url]

Lien vers nouvel(le) onglet/page
[URLNO=http://iefr.c-g2.com]Association IEFR[/URLNO]


Résultat lien simple
http://iefr.c-g2.com

Résultat lien amélioré
Association IEFR

Résultat lien vers nouvel(le) onglet/page
[URLNO=http://iefr.c-g2.com]Association IEFR[/URLNO]

NDLR : le lien simple, s'il contient http:// ou www, n'a pas forcément besoin de la balise url simple. Il peut être écrit directement.



_______________________________________________________________________________________________




Balise BBcode "URL/URLNO= & Img"



Code:
Lien image simple
[url=http://www.xfire.com/profile/zingk69/][img]http://miniprofile.xfire.com/bg/sh/type/1/zingk69.png[/img][/url]

Lien image vers nouvel(le) onglet/page
[URLNO=http://www.xfire.com/profile/zingk69/][img]http://miniprofile.xfire.com/bg/sh/type/1/zingk69.png[/img][/URLNO]


Résultat lien image simple
Image

Résultat lien image vers nouvel(le) onglet/page
[URLNO=http://www.xfire.com/profile/zingk69/]Image[/URLNO]

NDLR : il est préférable d'utiliser la balise URLNO= ;)



_______________________________________________________________________________________________




Balise BBcode "Cadre="



Code:
Mise en page avec cadre
[Cadre=Titre d'un film par exemple]Synopsis du dit film par exemple

Un jour un jeune vieillard assis debout sur un banc de pierre en bois
bla  bla bla bla bla
bla bla bla iuGVIAGUHÖHOIVBhvoiHihoihdohbgôiqhshbqhbq
hijoijtojorthioihthsothio^qitaijqhiopjirtophsrijtophj^rjthqa
oihtoij^srthihtoijtohrpitjpjthpjit$ph$prjt$hpojpojhpojtphiojthpijh$pj$rphj$pjo$pthj$pojh
bisous bisous....et là un cri !!!![/Cadre]


Résultat mise en page avec cadre

Titre d'un film par exempleSynopsis du dit film par exemple

Un jour un jeune vieillard assis debout sur un banc de pierre en bois
bla bla bla bla bla
bla bla bla iuGVIAGUHÖHOIVBhvoiHihoihdohbgôiqhshbqhbq
hijoijtojorthioihthsothio^qitaijqhiopjirtophsrijtophj^rjthqa
oihtoij^srthihtoijtohrpitjpjthpjit$ph$prjt$hpojpojhpojtphiojthpijh$pj$rphj$pjo$pthj$pojh
bisous bisous....et là un cri !!!!


NDLR : Faites pas attention il est tard et ce tutoriel est long à faire :lol:
Bref, ce BBcode est très utile pour mettre en page facilement ^^



_______________________________________________________________________________________________




Balise BBcode "Center"



Code:
Mise en page centrée
[Center]Texte avec tous les autres BBcodes possibles[/Center]


Résultat mise en page centrée
Texte avec tous les autres BBcodes possibles


NDLR : Sert à centrer les textes, images, vidéos, etc .... peut s'appliquer en fin de texte, il suffit de mettre en surbrillance l'ensemble et de cliquer sur la balise pour que tout le message soit centré



_______________________________________________________________________________________________




Balise BBcode "Dailymotion"



Code:
Insertion d'une vidéo simple dailymotion
[Dailymotion]x8sbfx_lete-en-vallee-daulps_travel[/Dailymotion]



Le code se trouvant ci-dessous est celui que l'on peut récupérer sous une vidéo sur le site dailymotion. Dans tout ce code nous n'avons besoin que de la partie en bleu entre ...swf/ et &related...
Sur certains code cela peut différer, mais en général il sera dans ce format et peut-être plus court.



<div><object width="480" height="377"><param name="movie" value="http://www.dailymotion.com/swf/x8sbfx_lete-en-vallee-daulps_travel&related=1"></param><param name="allowFullScreen" value="true"></param><param name="allowScriptAccess" value="always"></param><embed src="http://www.dailymotion.com/swf/x8sbfx_lete-en-vallee-daulps_travel&related=1" type="application/x-shockwave-flash" width="480" height="377" allowFullScreen="true" allowScriptAccess="always"></embed></object><br /><b><a href="http://www.dailymotion.com/video/x8sbfx_lete-en-vallee-daulps_travel">L'été en vallée d'Aulps</a></b><br /><i>envoyé par <a href="http://www.dailymotion.com/valleedaulps">valleedaulps</a></i></div>



Résultat d'insertion d'une vidéo simple dailymotion


NDLR : Le contenu des vidéos postées peut à tout moment être supprimé par les modérateurs ou administrateurs, si ces dernières ne respectent pas les règles établies par l'administration du forum.



_______________________________________________________________________________________________




Balise BBcode "Web"



Code:
Insertion d'une Iframe (cadre avec un site web) dans le corps d'un message
[Web]http://www.planete-urgence.org[/Web]


Résultat d'insertion d'une Iframe (cadre avec un site web) dans le corps d'un message


NDLR : Les Iframes sont pratiques, mais demandent pas mal de ressources et ne sont pas conseillées pour les petites connexions



_______________________________________________________________________________________________




Balise BBcode "Youtube"



Code:
Insertion d'une vidéo simple youtube
[Youtube]MA7Hg7vXHGo[/Youtube]


Le code se trouvant ci-dessous est celui que l'on peut récupérer sous une vidéo sur le site youtube. Dans tout ce code nous n'avons besoin que de la partie en bleu entre .../v/ et &hl=fr&fs...
Sur certains code cela peut différer, mais en général il sera dans ce format et peut-être plus court.



<object width="425" height="344"><param name="movie" value="http://www.youtube.com/v/MA7Hg7vXHGo&hl=fr&fs=1"></param><param name="allowFullScreen" value="true"></param><param name="allowscriptaccess" value="always"></param><embed src="http://www.youtube.com/v/MA7Hg7vXHGo&hl=fr&fs=1" type="application/x-shockwave-flash" allowscriptaccess="always" allowfullscreen="true" width="425" height="344"></embed></object>



Résultat d'insertion d'une vidéo simple youtube



NDLR : Le contenu des vidéos postées peut à tout moment être supprimé par les modérateurs ou administrateurs, si ces dernières ne respectent pas les règles établies par l'administration du forum.


_______________________________________________________________________________________________


Ce tutoriel est susceptible d'être modifié ou complété à tout moment.
Si vous pensez pouvoir apporter des informations supplémentaires, merci de les noter en réponse à ce tutoriel.
Il à était fait par mes soins ( zingk - http://www.c-g2.com ) et je le mets librement en circulation en vous fournissant ci-dessous le code de mise en page qui sera mis à jour en même temps que le message


Code:
[color=#BF4000]Attention à bien respecter l'ordre d'ouverture et de fermeture des balises, elles doivent être enclavées obligatoirement, en quinconce ça décalera l'application des codes.[/color]


[center][size=150][color=#4080FF][b]Balise BBcode "Quote"[/b][/color][/size][/center]

[code]
Citation simple
[quote]Texte à citer[/quote]

Citation avec patronyme
[quote="pseudo"]Texte à citer[/quote][/code]

Résultat citation simple
[quote]Texte à citer[/quote]

Résultat citation avec patronyme
[quote="pseudo"]Texte à citer[/quote]

[u]NDLR :[/u] un fil de discussion peut être suivi grâce à cette fonction et permet l'affichage de plusieurs citations sous forme de pyramide.
Lors d'une réponse à un sujet par exemple, on peut faire un défilement vers le bas et cliquer sur un message antérieur d'un autre auteur pour l'ajouter à l'emplacement du curseur dans la zone de saisie du texte...



[center]_______________________________________________________________________________________________[/center]




[center][size=150][color=#4080FF][b]Balise BBcode "Code"[/b][/color][/size][/center]


[code][code][/code][/code]

Le résultat sont les fenêtres utilisées dans ce tutoriel pour afficher les codes.

[u]NDLR :[/u] La balise "code" permet d'inclure du code html brut pour indiquer à quelqu'un un code à appliquer quelque part par exemple pour une mise en page. Une fonction similaire est possible en désactivant les bbcodes par exemple, mais à ce moment là ça concernera tout le message et non plus une zone du texte



[center]_______________________________________________________________________________________________[/center]



[center][size=150][color=#4080FF][b]Balise BBcode "List/List="[/b][/color][/size][/center]


[code]Liste simple

[list]
Texte à lister 1
Texte à lister 2
etc...
[/list]


Liste 1,2,3...

[list=1]
[*]Texte à lister 1
[*]Texte à lister 2
[*]etc...
[/list]


Liste a,b,c...

[list=a]
[*]Texte à lister 1
[*]Texte à lister 2
[*]etc...
[/list][/code]

Résultat liste simple

[list]
Texte à lister 1
Texte à lister 2
etc...
[/list]


Résultat liste 1,2,3...

[list=1]
[*]Texte à lister 1
[*]Texte à lister 2
[*]etc...[/list]


Résultat liste a,b,c...

[list=a]
[*]Texte à lister 1
[*]Texte à lister 2
[*]etc...[/list]

[u]NDLR :[/u] Les différentes formes de liste sont très utiles lors de présentations, mise en page ou tutoriels...



[center]_______________________________________________________________________________________________[/center]



[center][size=150][color=#4080FF][b]Balise BBcode "Img"[/b][/color][/size][/center]


[code]
Image simple
[img]http://miniprofile.xfire.com/bg/sh/type/1/zingk69.png[/img]

Pour les images avec lien voir ci-dessous "url&img"
[/code]

Résultat image simple

[img]http://miniprofile.xfire.com/bg/sh/type/1/zingk69.png[/img]

[u]NDLR :[/u] Vous devez coller le lien direct de l'image/photo (Direct Link), vous pouvez suivre le tutoriel Imageshack pour apprendre à uploader une image/photo en ligne



[center]_______________________________________________________________________________________________[/center]



[center][size=150][color=#4080FF][b]Balise BBcode "URL/URLNO"[/b][/color][/size][/center]


[code]
Lien simple
[url]http://iefr.c-g2.com[/url]

Lien amélioré
[url=http://iefr.c-g2.com]Association IEFR[/url]

Lien vers nouvel(le) onglet/page
[URLNO=http://iefr.c-g2.com]Association IEFR[/URLNO]
[/code]

Résultat lien simple
[url]http://iefr.c-g2.com[/url]

Résultat lien amélioré
[url=http://iefr.c-g2.com]Association IEFR[/url]

Résultat lien vers nouvel(le) onglet/page
[urlno=http://iefr.c-g2.com]Association IEFR[/urlno]

[u]NDLR :[/u] le lien simple, s'il contient http:// ou www, n'a pas forcément besoin de la balise url simple. Il peut être écrit directement.



[center]_______________________________________________________________________________________________[/center]



[center][size=150][color=#4080FF][b]Balise BBcode "URL/URLNO= & Img"[/b][/color][/size][/center]


[code]
Lien image simple
[url=http://www.xfire.com/profile/zingk69/][img]http://miniprofile.xfire.com/bg/sh/type/1/zingk69.png[/img][/url]

Lien image vers nouvel(le) onglet/page
[urlno=http://www.xfire.com/profile/zingk69/][img]http://miniprofile.xfire.com/bg/sh/type/1/zingk69.png[/img][/urlno]
[/code]

Résultat lien image simple
[url=http://www.xfire.com/profile/zingk69/][img]http://miniprofile.xfire.com/bg/sh/type/1/zingk69.png[/img][/url]

Résultat lien image vers nouvel(le) onglet/page
[urlno=http://www.xfire.com/profile/zingk69/][img]http://miniprofile.xfire.com/bg/sh/type/1/zingk69.png[/img][/urlno]

[u]NDLR :[/u] il est préférable d'utiliser la balise URLNO= ;)



[center]_______________________________________________________________________________________________[/center]



[center][size=150][color=#4080FF][b]Balise BBcode "Cadre="[/b][/color][/size][/center]


[code]
Mise en page avec cadre
[Cadre=Titre d'un film par exemple]Synopsis du dit film par exemple

Un jour un jeune vieillard assis debout sur un banc de pierre en bois
bla  bla bla bla bla
bla bla bla iuGVIAGUHÖHOIVBhvoiHihoihdohbgôiqhshbqhbq
hijoijtojorthioihthsothio^qitaijqhiopjirtophsrijtophj^rjthqa
oihtoij^srthihtoijtohrpitjpjthpjit$ph$prjt$hpojpojhpojtphiojthpijh$pj$rphj$pjo$pthj$pojh
bisous bisous....et là un cri !!!![/Cadre]
[/code]

Résultat mise en page avec cadre

[cadre=Titre d'un film par exemple]Synopsis du dit film par exemple

Un jour un jeune vieillard assis debout sur un banc de pierre en bois
bla  bla bla bla bla
bla bla bla iuGVIAGUHÖHOIVBhvoiHihoihdohbgôiqhshbqhbq
hijoijtojorthioihthsothio^qitaijqhiopjirtophsrijtophj^rjthqa
oihtoij^srthihtoijtohrpitjpjthpjit$ph$prjt$hpojpojhpojtphiojthpijh$pj$rphj$pjo$pthj$pojh
bisous bisous....et là un cri !!!![/cadre]

[u]NDLR :[/u] Faites pas attention il est tard et ce tutoriel est long à faire :lol:
Bref, ce BBcode est très utile pour mettre en page facilement ^^



[center]_______________________________________________________________________________________________[/center]



[center][size=150][color=#4080FF][b]Balise BBcode "Center"[/b][/color][/size][/center]


[code]
Mise en page centrée
[Center]Texte avec tous les autres BBcodes possibles[/Center]
[/code]

Résultat mise en page centrée
[center]Texte avec tous les autres BBcodes possibles[/center]

[u]NDLR :[/u] Sert à centrer les textes, images, vidéos, etc .... peut s'appliquer en fin de texte, il suffit de mettre en surbrillance l'ensemble et de cliquer sur la balise pour que tout le message soit centré



[center]_______________________________________________________________________________________________[/center]



[center][size=150][color=#4080FF][b]Balise BBcode "Dailymotion"[/b][/color][/size][/center][center][/center]


[code]
Insertion d'une vidéo simple dailymotion
[Dailymotion]x8sbfx_lete-en-vallee-daulps_travel[/Dailymotion]
[/code]


Le code se trouvant ci-dessous est celui que l'on peut récupérer sous une vidéo sur le site dailymotion. Dans tout ce code nous n'avons besoin que de la partie en [color=#4080FF]bleu[/color] entre    [b]...swf/   et   &related...[/b]
Sur certains code cela peut différer, mais en général il sera dans ce format et peut-être plus court.



[color=#808040]<div><object width="480" height="377"><param name="movie" value="http://www.dailymotion.com/swf/x8sbfx_lete-en-vallee-daulps_travel&related=1"></param><param name="allowFullScreen" value="true"></param><param name="allowScriptAccess" value="always"></param><embed src="http://www.dailymotion.com/swf/[/color][color=#4080FF][b]x8sbfx_lete-en-vallee-daulps_travel[/b][/color][color=#808040]&related=1" type="application/x-shockwave-flash" width="480" height="377" allowFullScreen="true" allowScriptAccess="always"></embed></object><br /><b><a href="http://www.dailymotion.com/video/x8sbfx_lete-en-vallee-daulps_travel">L'été en vallée d'Aulps</a></b><br /><i>envoyé par <a href="http://www.dailymotion.com/valleedaulps">valleedaulps</a></i></div>[/color]



Résultat d'insertion d'une vidéo simple dailymotion
[dailymotion]x8sbfx_lete-en-vallee-daulps_travel[/dailymotion]

[u]NDLR :[/u] Le contenu des vidéos postées peut à tout moment être supprimé par les modérateurs ou administrateurs, si ces dernières ne respectent pas les règles établies par l'administration du forum.



[center]_______________________________________________________________________________________________[/center]



[center][size=150][color=#4080FF][b]Balise BBcode "Web"[/b][/color][/size][/center]


[code]
Insertion d'une Iframe (cadre avec un site web) dans le corps d'un message
[Web]http://www.planete-urgence.org[/Web]
[/code]

Résultat d'insertion d'une Iframe (cadre avec un site web) dans le corps d'un message
[web]http://www.planete-urgence.org[/web]

[u]NDLR :[/u] Les Iframes sont pratiques, mais demandent pas mal de ressources et ne sont pas conseillées pour les petites connexions



[center]_______________________________________________________________________________________________[/center]



[center][size=150][color=#4080FF][b]Balise BBcode "Youtube"[/b][/color][/size][/center]


[code]
Insertion d'une vidéo simple youtube
[Youtube]MA7Hg7vXHGo[/Youtube]
[/code]

Le code se trouvant ci-dessous est celui que l'on peut récupérer sous une vidéo sur le site youtube. Dans tout ce code nous n'avons besoin que de la partie en [color=#4080FF]bleu[/color] entre    [b].../v/   et   &hl=fr&fs...[/b]
Sur certains code cela peut différer, mais en général il sera dans ce format et peut-être plus court.



[color=#808040]<object width="425" height="344"><param name="movie" value="http://www.youtube.com/v/[/color][color=#4080FF][b]MA7Hg7vXHGo[/b][/color][color=#808040]&hl=fr&fs=1"></param><param name="allowFullScreen" value="true"></param><param name="allowscriptaccess" value="always"></param><embed src="http://www.youtube.com/v/MA7Hg7vXHGo&hl=fr&fs=1" type="application/x-shockwave-flash" allowscriptaccess="always" allowfullscreen="true" width="425" height="344"></embed></object>[/color]



Résultat d'insertion d'une vidéo simple youtube
[youtube]MA7Hg7vXHGo[/youtube]


[u]NDLR :[/u] Le contenu des vidéos postées peut à tout moment être supprimé par les modérateurs ou administrateurs, si ces dernières ne respectent pas les règles établies par l'administration du forum.


[center]_______________________________________________________________________________________________[/center]

_________________
Image

"J'arrêterais de faire de la politique quand les politiques arrêteront de nous faire rire...." (Coluche)


Rapporter ce message
Haut
 Profil Envoyer un e-mail  
Répondre en citant  
Afficher les messages depuis:  Trier par  
Publier un nouveau sujet Répondre au sujet  [ 1 message ] 

Heures au format UTC + 1 heure


Qui est en ligne ?

Utilisateurs parcourant actuellement ce forum : Aucun utilisateur enregistré et 0 invités


Vous pouvez publier de nouveaux sujets dans ce forum
Vous pouvez répondre aux sujets dans ce forum
Vous ne pouvez pas éditer vos messages dans ce forum
Vous ne pouvez pas supprimer vos messages dans ce forum
Vous ne pouvez pas insérer de pièces jointes dans ce forum

Rechercher pour:
Sauter vers:  
cron
Powered by phpBB © 2000, 2002, 2005, 2007 phpBB Group
phpBB3 style by NeXur. and Modified by http://sjpphpbb.net
Translated by Xaphos © 2007, 2008, 2009 phpBB.fr