Bonjour à tous !
Aujourd'hui, un tutoriel plutôt simple mais pas forcément connu de tous, qui vous permettra de comprendre comment coder sur son forum à l'aide des pages HTML, mais aussi comment les mettre sur un autre forum, en l'occurence, ici, Ocean Home.
Niveau : Débutant et +
Durée : Entre 5 et 10 minutes.
I — Comprendre l'utilité et ce qui est nécessaire pour réaliser le tuto.
A première vue, vous pouvez vous demander pourquoi coder sur son forum, et pas sur OH. Il y a une raison technique très simple : les hover (animations qui peuvent faire bouger une image, ou changer de couleur un texte au survol de la souris, ce genre de choses) nécessitent le CSS et ne fonctionnent pas lorsque l'on pose cela de manière " brute " sur un sujet du forum. Vous avez donc besoin de votre propre page HTML pour que cela fonctionne, et la manière la plus simple, c'est d'avoir son propre ForumActif ! De plus, cela vous assure que vos codages et sujets ne seront pas supprimés, car ils seront bien au chaud dans vos propres pages HTML. Pour cela, ce n'est pas compliqué : allez sur le site et créez votre forum. Une fois connecté, vous pouvez passer à l'étape suivante.
II — Accès aux fiches.
Une fois connecté en tant que Fondateur (ou Administrateur), descendez tout en bas du forum jusqu'à voir « Panneau d'Administration ». Accédez-y.
- 1:
Rendez-vous dans l'onglet « Modules ».
- 2:
Descendez tout en bas de la page jusqu'à voir « HTML & Javascript » à gauche, et cliquez sur « Gestion des pages HTML ».
- 3:
Voilà pour la première étape ! Comme vous voyez, c'est très facile d'accès, il faut juste savoir où c'est et ça passe tout seul. Sélectionnez « Création en mode avancé (HTML) » pour enfin pouvoir commencer à coder.
NOTE : Évitez de prendre le mode simple. S'il paraît plus attirant pour les débutants, il m'a déjà, personnellement, causé quelques problèmes dans mon code, je ne vous le conseille donc pas. De la même manière, n'éditez jamais en mode simple.
III — Commencer à coder / Mettre son code.
Maintenant que vous avez votre nouvelle page ouverte, vous pouvez commencer ! Mettez le CSS, et ensuite l'HTML.
-> Si vous avez simplement un code à copier/coller, vous avez tout simplement à sauvegarder une fois que c'est réalisé. Retournez sur l'onglet précédent et cliquez sur le petit œil, à côté de votre tout nouveau codage : une nouvelle page va s'ouvrir, et vous aurez l'aperçu ! Cette page vous servira pour la suite*, ce n'est pas encore fini, car il faut la placer sur le forum grâce à un code.
-> Si vous souhaitez réaliser votre propre code, n'oubliez jamais de mettre ce code au tout départ :
- Code:
-
<!doctype html>
Il précise que c'est un document en HTML.
- Code:
-
<meta charset="UTF-8">
Il indiquera à votre navigateur qu'il doit afficher les accents graves, aigus, et j'en passe pour éviter de se retrouver avec des caractères qui n'ont aucun sens.
Et, lorsque vous codez en CSS, n'oubliez pas de le mettre dans ces balises (puisque vous aviez précisé précédemment que c'était en HTML) :
- Code:
-
<style type="text/css">CSS RÉDIGÉ ICI</style>
IV — Placer le code sur un forum extérieur.
Pour faire cela, vous allez utiliser un iframe.
- Code:
-
<iframe src="LIEN DE LA PAGE*" style=" border: 0;"></iframe>
Si besoin, ajoutez une balise pour centrer, tout simplement
- Code:
-
<center><iframe src="LIEN DE LA PAGE" style=" border: 0;"></iframe></center>
Pour finir, n'hésitez pas à adapter les dimensions selon votre rendu, avec ce codage :
- Code:
-
<center><iframe src="LIEN DE LA PAGE" style=" border: 0; width: LARGEUR SOUHAITÉE; height: HAUTEUR SOUHAITÉE;"></iframe></center>
Voilà ! N'hésitez pas à vous adressez à moi si vous avez des questions