Auteur Sujet: [Tutoriel] Créer sa galerie  (Lu 12194 fois)

0 Membres et 1 Invité sur ce sujet

Hors ligne Chompir

  • Sorcier Sheikah
  • ****
  • Messages: 7537
    • Voir le profil
[Tutoriel] Créer sa galerie
« le: dimanche 25 mars 2018, 18:34:44 »
Voici un tutoriel servant à aider les artistes du forum à créer une belle galerie et un premier post complet.

  • Qu'est-ce que le bbcode ?
À la manière du html, le bbcode sert à appliquer des balises de mise en forme à votre texte. Vous pouvez par exemple y appliquer du gras, souligner, mettre en italique, centrer, changer la taille ou la couleur du texte etc.

  • Comment ça fonctionne ?
Rien de bien compliqué, il s'agit d'abord de choisir le bbcode à appliquer (parmi les boutons au-dessus de la zone de rédaction de texte).
Quelques exemples :
  • Mettre en gras
  • Mettre en italique
  • Souligner
  • Afficher une image grâce à une URL
  • Mettre une URL à un mot/groupe de mot
  • Mettre une liste à puce
Une fois déterminé, cliquez dessus pour faire apparaître une balise et écrivez dedans pour obtenir le résultat voulu à votre texte.
Le résultat devra ressembler à ça : [balise]Votre texte[/balise]
Selon la balise utilisée, votre texte affichera la mise en forme concernée. Pour plus d'informations sur l'utilisation du bbcode et les différentes balises, cliquez ici.

  • Voici ci-dessous un exemple de sujet à utiliser pour présenter vos œuvres.
Vous trouverez ci-dessous un exemple de code à recopier dans le premier post de vos galeries présenté sous la forme d'une balise "Code". Vous trouverez aussi dans un spoiler, l'effet que vous obtiendrez avec ces balises.

[size=14pt][b]Galerie Littéraire de Quelqu'un[/b][/size]

Bienvenue dans ma galerie, vous trouverez ici chacune de mes fictions. J'espère que vous apprécierez mon travail, n'hésitez pas à le commenter, j'accepte toutes les critiques constructives !


[b]Sommaire[/b]
[list][*][iurl=#fictions]Fan Fictions[/iurl]
[*][iurl=#poemes]Poèmes[/iurl]
[*][iurl=#autres]Autres[/iurl][/list]
___________________

[b]1. [anchor=fictions]Fan Fictions[/anchor][/b]
[list][*][iurl=#fic1]Fiction 1[/iurl]
- [iurl=#chap1]Chapitre 1[/iurl]
- [iurl=#chap2]Chapitre 2[/iurl][/list]

[b]2. [anchor=poemes]Poèmes[/anchor][/b]
[list][*][iurl=#po1]Poème 1[/iurl]
[*][iurl=#po2]Poème 2[/iurl][/list]

[b]3. [anchor=autres]Autres[/anchor][/b]
[list]Vide[/list]

[hr]

[center][size=12pt][anchor=fic1][b]Fiction 1[/b][/anchor][/size][/center]

[*][anchor=chap1]Chapitre 1 :[/anchor]

[i]Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas ac dui in dui aliquam posuere ut ut est. Nam bibendum, libero lacinia elementum elementum, nisi lacus vulputate dolor, a convallis odio urna nec nibh. Nam blandit id justo in faucibus. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Suspendisse et venenatis neque, in commodo diam. Nam maximus lectus rutrum neque suscipit tempor eget in mauris. Nulla tempor ex quis mi venenatis, tempus sollicitudin nulla tristique. Nulla molestie dui a rhoncus tristique. Donec dignissim maximus felis, id blandit ex rhoncus quis. [/i]

[*][anchor=chap2]Chapitre 2 :[/anchor]

[i]Vivamus tristique pharetra diam id gravida. Fusce non sapien in sapien facilisis eleifend. Mauris et feugiat augue. Donec eleifend quam lectus, vitae convallis arcu imperdiet non. Sed tortor lacus, rutrum sed erat vehicula, bibendum maximus felis. Ut dictum pellentesque augue at eleifend. Sed quis erat eu erat volutpat dapibus eu in felis. Donec eu urna arcu. Morbi eu hendrerit tellus, ut lacinia diam. Ut sagittis, ipsum sit amet vehicula efficitur, nisl tellus posuere neque, ac fringilla nibh tellus sed neque. Proin efficitur blandit venenatis. [/i]
[hr]

[center][b][anchor=po1]Poème 1[/anchor][/b][/center]

[center][i]lNunc ut nibh convallis, vestibulum diam et, varius ipsum.[/i]
[i]lMorbi eu est id ligula vehicula finibus.[/i]
[i]Cras molestie condimentum sapien, non bibendum mi.[/i][/center]

[center][b][anchor=po2]Poème 2[/anchor][/b][/center]

[center][i]In accumsan accumsan orci, et rhoncus odio luctus et.[/i]
[i]Vivamus posuere efficitur massa viverra dapibus.[/i]
[i]Vivamus vitae maximus quam.[/i]

[i]Mauris quis erat sapien.[/i]
[i]Phasellus non sollicitudin velit, id vulputate dui.[/i][/center]

(Cliquez pour afficher/cacher)
Vous noterez que j'ai utilisé un système d'ancre et de cible très pratique. En cliquant sur les liens, la page descendra automatiquement jusqu'à la cible concernée, essayez pour voir ! Pour plus de clarté et pour mieux s'y retrouver au niveau du code, je les nomme de façon logique pour me repérer facilement avec les différentes ancres, je vous conseille de faire de même pour ne pas vous perdre.

Pour créer un lien menant à une partie de votre message, il suffit d'utiliser les balises iurl et anchor. La balise iurl a pour rôle de se rendre vers une cible, la balise anchor quant à elle EST une cible (aidez-vous de mon code pour mieux comprendre le fonctionnement). Une ancre fonctionne avec une balise qui doit porter le même nom (de trois caractères minimum). L'ancre fonctionne avec la balise "anchor=" tandis que la balise fonctionne avec la balise "iurl=#". Aidez vous du code ci-dessus pour comprendre.

Pour créer un lien menant directement à un message, il vous suffit de faire un clic droit, de copier/coller le lien du message en utilisant la balise url

  • Comment héberger une de mes créations ?
Rien de bien compliqué pour cela, tout d'abord il suffit de scanner votre dessin s'il s'agit d'une version papier ou d'en prendre une photo, ensuite transférez-la sur votre ordinateur et utilisez un hébergeur d'image style Noelshack ou Imgur. Hébergez vos images depuis votre ordinateur puis récupérez le lien et insérez-le dans votre message dans une balise "img". Attention toutefois, les liens ne sont pas éternels alors pensez à garder vos créations sur votre ordinateur pour ne pas les perdre définitivement.

  • Mon image est trop grande comment la redimensionner ?
Vous pouvez utiliser des logiciels tel que Gimp ou Paint qui propose ses fonctions ou vous pouvez tout simplement utiliser la balise img width= ou img height= et la hauteur ou la largeur que votre image doit avoir, en pixel.
« Modifié: samedi 03 août 2019, 11:52:20 par Chompir »