Shop Forum More Submit  Join Login
Note :
  • Ne sont cités ci-dessous, que les codes valable pour les comptes gratuits (ceci dit, je pourrai toujours compléter par un paragraphe "prenium account", mais dans ce cas, un peu d'aide ne sera pas de refus!).
  • Si vous oubliez de clore le texte par le </>, tout votre texte sera en gras/souligné/barré ect...
  • Vous pouvez combiner les codes entre eux, par exemple, si vous souhaitez que votre texte soit en gras et souligné, il suffit d'encadrer le texte entre :
    <u><b> et</b></u>
  • Mais vous pouvez aussi intensifier/doubler certains effets comme le <small, le <sub>, les listes, et le <sup>.
    Ex: J'en découvre chaque jour!


CODES UTILISABLE POUR LES PAGES PROFIL, JOURNAL, NOTES, COMMENTAIRES, ARTICLES ET  FORUM


- "Bold Text" : Texte en Gras
Encadrez le mot/la phrase que vous souhaitez mettre en gras par <b> [le mot/phrase en question] </b> .
Marche aussi avec <strong> et </strong> .

- "Underlined Text" : Texte souligné
Encadrez par <u> et </u> .

- "Italic Text" : Texte en italique
Encadrez par <i> et </i>. Marche aussi avec <em> & </em> .

- "Subscript Text" : le texte est minuscule, placé légèrement en-dessous des lignes usuelles.
Encadrez par <sub> & </sub> .

- "Supscript Text" : le texte est (toujours) minuscule, placé légèrement au-dessus des lignes usuelles.
Encadrez par <sup> & </sup>.

- "tt" dit télé-typé: Une police de texte différente de celle utilisée par Deviantart.
Encadrez par <tt> & </tt>.

- "BlockQuote" : Pour mettre en valeur une partie du texte, habituellement utilisée pour citer.
Personnellement, je l'utilise aussi pour tenter de "centrer" quelque peu certains textes (même s'il ajoute une barre latérale à gauche).
Encadrez par <blockquote> & </blockquote> .

- Pour créer des paragraphes :
Il suffit d'encadrer par <p> & </p>.

- "Acronym" : vous permez d'ajouter des descriptions en pop-up sur un mot (ou une partie de texte) souligné/un lien.
Encadrez par <acronym title="La description en pop-up que vous voulez mettre"> < a ref="Lien en question">Le lien </a></acronym>

<acronym title="Lisez-la, apprenez-la, Aimez-la."> <a href="faq.deviantart.com">deviantART FAQ</a></acronym>  deviendra: deviantART FAQ.

- "Abbr" pour Abbreviation : a la même fonction que l'acronyme, en affichant la définition complète du terme mis en abbrégé.
Encadrez par <abbr="LaDéfintionDuTerme"> et </abbr>.

<abbr="Patate Royale Avariée">P.R.A.</abbr>

- "Strike Text" : Texte barré
Encadrez par <strike> et </strike> .

- Pour faire un joli lien : <a href="adresseDuLien"> Nom du lien</a> (sans l'espace avant le "a" ni après), ce qui donnera par exemple : DeviantArt.


- Les codes "dl", "dd" et "dt" : permettent de créer une liste de terme dont la description suit, de manière à être clairement mise en avant. Notamment utile pour les personnes mal-voyantes pour que leur traducteur vocal marque le temps nécessaire, qu'ils puissent noter la différence.


<dl> début de la liste de définition, <dt> met en avant le terme à définir, <dd> définition du mot, fonctionnent ensemble. Il s'agit de balise pour créer une liste de définition/description.

Ex:

<dl>
<dt>Deviant-art.com</dt>
<dd>Une communauté artistique en ligne.</dd>
<dt>Chat</dt>
<dd>Animal ayant domestiqué l'homme à son service, ne cessant de s'interposer entre l'écran et l'homme.</dd>
</dl>

Deviant-art.com
Une communauté artistique en ligne.
Chat
Animal ayant domestiqué l'homme à son service, ne cessant de s'interposer entre l'écran et l'homme.




SPÉCIFIQUE AUX ARTICLES ET JOURNAUX

- "Ordered listings" : Listes croissante
Pour générer des listes croissants, vous devez commencez par < ol >  puis clore l'entier de la liste par < /ol > .
Entre ces deux codes, il vous faudra encadrer chaque objet par < li > & < /li > .

Exemple
  1. Objet 1
  2. Objet 2
  3. Objet 3
Soit, en code :
<ol><li> Objet 1</li>
<li> Objet 2</li>
<li> Objet 3</li></ol>


- Un-ordered listing : liste en vrac
Vous devez utiliser <ul> et </ul> pour l'entier de la liste, dont vous encadrerez chaque objet par <li> & </li>.

Exemple
  • Objet 1
  • Objet 2
  • Objet 3
Soit en code :
<ul><li>Objet 1</li>
<li>Objet 2</li>
<li>Objet 3</li></ul>



SPÉCIFIQUE AUX JOURNAUX

- Pour centrer: Commencez par <div align="center"> et clore le texte à centrer par: </div>

- "Small Text" : Texte en petit
Encadrez par <small> et </small>

- Vous pouvez aussi faire référence aux oeuvres de DA directement en mentionnant leur :thumb: (en bas à droite de chaque oeuvre), ou au travers de leur lien (le fav.me.) qui permet non seulement d'écourter les liens à rallonge, mais aussi de conserver la même destination même si l'auteur en modifierait le titre.
Si les :thumb: (les mini icones des oeuvres) sont désormais accessibles aux comptes gratuits, elles restent cependant limitées aux articles de journaux (les comptes premium peuvent s'en servir dans les descriptions des deviations -dans une limite de 5-, et dans les commentaires)!
On peut en mettre jusqu'à 200.


SPÉCIFIQUE AUX ARTICLES

- Une limite pour les textes soumis en deviations, de 65 535 signes (et les codes utilisés, comptent aussi, certains signes de ponctuations peuvent compter comme deux "signes").

- Les "Previews" ou images qui accompagnent un texte : il est suggéré d'utiliser ses propres ressources plutôt que celle d'autrui. Dans le cas contraire, il faut bien spécifier qui en est l'auteur en le créditant (en mentionnant son profil sur DA s'il a un compte) et en lui ayant demandé la permission au préalable.
Si vous ne respectez pas ces conditions, vous ne suivez donc pas le code de la propriété intellectuelle du code pénal; et sachez qu'outre la dimension juridique, les artistes n'apprécient pas qu'on se serve de leurs oeuvres comme si elles n'attendaient que ça.

- Heading Tag : Terme pour En-tête/titres/rubrique/chapitre/intitulé.
A encadrer entre <h2> et </h2>, puis <h3> et </h3> ect, selon le nombre de titres que vous aurez.

- <br> : Pour aller à la ligne (ceci dit, cela se fait automatiquement).

- <hr> : Pour créer une barre de séparation.


SPÉCIFIQUE A LA SHOUT-BOX

Vous pouvez utiliser Bold(texte en gras), Italic (italique), Underline (souligné) et :devpseudo: (pour nommer quelqu'un) dans la shout box. Les liens standards comme www.deviantart.com y marchent aussi. Les autres codes ne fonctionneront pas.


DIVERS

- Pour montrer l'icône (l'avatar) d'un membre, il suffit de faire :iconPseudo:, ce code n'est valable que dans les commentaires et les pages du journal.

- Pour désigner l'un des membres en employant que son nom (tout en conservant le lien vers son profil, le même système que l'icone en somme), il suffit de faire :devPseudo:.

-> A noter: toute "mention" d'un tiers (donc d'une oeuvre, d'un article ou d'un membre de Deviantart) sera signalé au principal concerné!

Les titres de vos "Deviations" ne doivent pas contenir de caractères spéciaux qui ne sont pas reconnu dans le langage HTML. Oubliez les accents, cédilles spécifiques à la langue française, mais aussi certaines ponctuations!
[Édit] : - [du 11/10/2013]: J'ai finalement remplacé ma pirouette des espaces (puisque la balise "code" permettant d'afficher le méta-langage utilité pour la typographie ne fonctionne pas dans les articles), en mettant directement les codes en gras (le texte entre "<>"). Pour vous, ça ne change pas grand chose, pour moi, ça a été un plus gros casse-tête (je vous dis pas la tronche de l'article avec la mise en page et tout ces codes partout). Mais au moins, vous pourrez directement copier/coller les codes à partir de cet article sans avoir à retirer les espaces. J'ai aussi actualisé certaines petites choses, mais il doit sûrement m'en manquer. Deviantart est ultra prolifique au niveau de ses mises à jour... Du coup, c'est assez difficile d'être vraiment à la page. 

- [du 27/01/2010] J'avais déjà fait un précédent tutorat très général concernant l'utilisation de Deviantart. Mais il me parait plus judicieux d'en faire une page spécifique aux codes d'écriture pour aider tout le monde tout en ajoutant ce qu'il pourrait manquer à mon ancien tuto :


Traduit des  FAQ #104: What HTML formatting can we use on deviantART? And what is the format for these codes?, FAQ #63: What sort of things can I use for Preview images? , :faq627:, FAQ #66: What journal features do I have access to? & FAQ #9: What are the limits for Thumbnails and Emoticons?

P.S. : Si vous constatez qu'un de ces codes ne fonctionnent pas/plus, ou qu'un autre utile devrait y être mentionné: n'hésitez pas à commenter!



AUTRES TUTOS FR qui pourraient vous être utiles! Mais aussi des groupes francophones qui vous aideront à mieux comprendre Deviantart et d'autres communautés francophones:

    :icontutofrench: :iconinternationalfaq: :iconbloc-notes: -- :iconkamifrenchcreation: :iconfranceofficiel: :iconfrenchconnexion: :iconfrance-expression: :iconrepaire-de-talents: :icondeviantartistsfr:




Et puis, figurez-vous que sur DA, je ne fais pas QUE DES TUTOS (bah oui!) ;):
 Pencil's Muse Scape by Cidiene Odenwald - The soft Autumn path by Cidiene Origin by Cidiene Fleur Solaire by Cidiene Turquoise by Cidiene Zolnerowich Family by Cidiene
Add a Comment:
 
:iconstoryshiftchara848:
StoryShiftChara848 Featured By Owner Sep 15, 2018
<sup>hay</sup>
Reply
:iconstoryshiftchara848:
StoryShiftChara848 Featured By Owner Sep 15, 2018
pk sa marche pas
Reply
:iconstoryshiftchara848:
StoryShiftChara848 Featured By Owner Sep 15, 2018
<tt>gasp<tt><tt><tt><tt><tt><tt><tt><tt><tt><tt><tt><tt><tt><tt><tt><tt><tt><tt><tt>
Reply
:iconstoryshiftchara848:
StoryShiftChara848 Featured By Owner Sep 15, 2018
<tt>gasp</tt>
Reply
:iconstoryshiftchara848:
StoryShiftChara848 Featured By Owner Sep 15, 2018
<tt> gasp
Reply
:iconstoryshiftchara848:
StoryShiftChara848 Featured By Owner Sep 15, 2018
<tt> gasp </tt>
Reply
:iconspikedfire:
SpikedFire Featured By Owner May 19, 2018  Hobbyist General Artist
J'avais pris le truc en modèle et j'ai oublié de l'enlever, désolée xDD
Reply
:iconspikedfire:
SpikedFire Featured By Owner May 19, 2018  Hobbyist General Artist
<sup> & </sup>.
Merci pour ce tutoreil, ça va m'aider 8D
Reply
:iconzephara:
Zephara Featured By Owner Apr 11, 2018  Hobbyist Traditional Artist
Ce sera ma bible mile merci ! :D
Reply
:iconfelifan:
felifan Featured By Owner Feb 16, 2018  Hobbyist Artisan Crafter
merci pour ce tuto :)
Reply
:iconyokitho:
Yokitho Featured By Owner Dec 7, 2017  Hobbyist
+ llama emoticon 
Reply
:iconatmu:
Atmu Featured By Owner Aug 26, 2017
Je n'arrive pas à mettre en character gras ni en italique, pourrais-je avoir un exemple concret sur la procédure ?
Reply
:iconcascade-d-argent:
Cascade-d-Argent Featured By Owner Jul 3, 2017  Hobbyist Digital Artist
le code pour centrer marche plus sur ma page :// c'est normal?
Reply
:iconmoonfl0un:
MoonFl0un Featured By Owner Jun 5, 2017
hey, désolée le post date, mais quelqu'un saurait insérer un lien sur une image ? genre on clique sur l'image et ça dirige vers le lien ;v;
Reply
:iconcascade-d-argent:
Cascade-d-Argent Featured By Owner Jul 3, 2017  Hobbyist Digital Artist
faut les tumb mais je crois que t'as réussi nan?
Reply
:iconflowrant:
Flowrant Featured By Owner May 8, 2017  Hobbyist Traditional Artist
Merci pour ce tuto :happybounce:  Cela m'a aider à mettre ma page en ordre :D
Reply
:iconliliart1:
LiliArt1 Featured By Owner Edited Dec 15, 2016
Ça marche pas pour moi :c
Reply
:iconchirafu:
chirafu Featured By Owner Dec 16, 2016  Hobbyist Digital Artist
qu'est-ce qui ne fonctionne pas ? :<
Reply
:iconchirafu:
chirafu Featured By Owner Dec 17, 2016  Hobbyist Digital Artist
pour moi ça fonctionne :T c'est parce que ton compte n'a pas un core (truc premium) (enfin je crois)
mais sinon si tu veux que ta phrase soit entièrement en gras (ou autre) tu dois juste mette < b > sans mettre < /b>
à la fin

si tu les mets des deux cotés ça fait ça : (entre hijhlmnop )

abcdefg hijhlmnop qrstuvw..

sinon essaye d'écrire en petit comme ça, je trouve ça mimi *^^*
Reply
:iconliliart1:
LiliArt1 Featured By Owner Dec 17, 2016
Je fais <b> Je marque ma phrase </b>
Reply
:iconcascadingpassion:
CascadingPASSION Featured By Owner Jul 3, 2017  Hobbyist Interface Designer
je marque ma phrase
faut pas mettre d'espace :w:
Reply
:iconliliart1:
LiliArt1 Featured By Owner Jul 3, 2017
<b>J'essaie<b>
Reply
:iconcascadingpassion:
CascadingPASSION Featured By Owner Jul 4, 2017  Hobbyist Interface Designer
ho c'est vraiment étrange :// le b se mets en gras mais pas le mot c'est très étrange :// je sais pas quoi faire pour t'aider désolé :w:
Reply
:iconliliart1:
LiliArt1 Featured By Owner Jul 5, 2017
C'est pas grave je crois avoir trouvé une méthode pour ça :)
Reply
:iconcascadingpassion:
CascadingPASSION Featured By Owner Jul 11, 2017  Hobbyist Interface Designer
tant mieux ^^
Reply
:iconliliart1:
LiliArt1 Featured By Owner Jul 3, 2017
<Ah c'est bon je crois avoir trouvé comment faire, merci ! ^^
Reply
:iconstoryshiftchara848:
StoryShiftChara848 Featured By Owner Sep 15, 2018
<comment
Reply
:iconstoryshiftchara848:
StoryShiftChara848 Featured By Owner Sep 15, 2018
<tt>alo</tt>
Reply
(1 Reply)
:iconundernaf452:
Undernaf452 Featured By Owner Dec 5, 2016
bonjour
Reply
:iconbelonne:
Belonne Featured By Owner Nov 1, 2016
Merci pour ce tuto, je touche un peu au codage, mais sur forum. Du coup même sans être totalement une débutante, c'est super de voir des tutos pour se rendre compte de ce qui est possible ou non sur DA. Surtout qu'il est très clair.
Reply
:icongratteloup:
gratteloup Featured By Owner Oct 7, 2016
...Salut, et comment fait-on pour écrire en énorme , genre vraiment énorme... J'ai déjà vu ça mais ne sais pas comment faire
Reply
:iconkaguyart:
kaguyart Featured By Owner Sep 17, 2016  Hobbyist Traditional Artist
merci
Reply
:iconsatoru--kun:
Satoru--kun Featured By Owner Aug 22, 2016  Hobbyist Digital Artist
Très utile ! merci
Reply
:iconlonares:
lonares Featured By Owner Jul 8, 2016  Hobbyist General Artist
j'arrive pas.... ;__________________; a aucun...
Reply
:iconthirrinaki:
Thirrinaki Featured By Owner May 8, 2016  Hobbyist Traditional Artist
merci pour ce post c'est super utile!
Reply
:iconmillaby:
millaby Featured By Owner Apr 12, 2016
Merci ♥
Reply
:iconblackskychild:
BlackSkychild Featured By Owner Jan 2, 2016  Hobbyist Digital Artist
Très utile merci!
Reply
:iconelis-lis:
Elis-Lis Featured By Owner Dec 27, 2015  Hobbyist General Artist
Merci beaucoup! :3
Reply
:iconhikarinokusari:
HikariNoKusari Featured By Owner Oct 27, 2015  Hobbyist Traditional Artist
Merci, c'est vraiment utile ! 
Reply
:iconmokolat-illustr:
Mokolat-Illustr Featured By Owner Aug 28, 2015
Oh que l'acronyme est pratique!
Merci! ♥
Reply
:iconmelusineaislingart:
MelusineAislingArt Featured By Owner Aug 20, 2015  Professional Traditional Artist
Eeeuh coucou, je n'ai pas bien saisi si on peut ajouter une mini-image d'une déviation à un commentaire et comment on fait... Notamment pour remercier d'un fav (c'est plus joli qu'un lien, même si on ne voit que le titre) à moins que ce ne soit possible que pour les "premium" auquel cas fais comme si je n'étais pas passée par là.... :p
Reply
:iconkibaura:
Kibaura Featured By Owner Jun 24, 2015  Hobbyist Writer
Un tuto très utile ! Merci :)
Reply
:iconapolline555:
apolline555 Featured By Owner Edited Apr 9, 2015  Hobbyist Digital Artist
merci pour les commandes ^^
Reply
:iconyosonoaijin:
YosoNoAijin Featured By Owner Nov 24, 2014
Hey ! :3
J'aurai juste une petite question, dans nos profil, comment pouvons nous faire pour mettre le texte centré ? Merci d'avance. x3
Reply
:iconlatchdrom:
LatchDrom Featured By Owner Edited Sep 13, 2014  Hobbyist Photographer
Super, merci pour le tuto! Je m'étais toujours demandé comment certains deviants arrivaient à mettre une icône en citant un autre deviant, maintenant c'est fait grâce à toi :iconcidiene:
Merci!
Reply
Add a Comment:
 
×

:iconcidiene: More from Cidiene





Details

Submitted on
January 26, 2010
File Size
9.8 KB
Link
Thumb

Stats

Views
32,487 (7 today)
Favourites
522 (who?)
Comments
150