Le Deal du moment : -16%
Le nouveau Aspirateur Robot Roborock S7 à ...
Voir le deal
407.45 €

Aller en bas
Mäven
Mäven
Râleuse (Admin)
Informations : Présente quelques heures par semaine =)
----
Idea Viens papoter avec nous sur le discord

Messages : 3991
https://tambouille-raleuses.forumactif.com/

[Toutes versions] Personnaliser les balises "hide" Empty [Toutes versions] Personnaliser les balises "hide"

Mer 5 Juin 2019 - 14:27

Personnaliser les balises "hide"


Bonjour !

Idea Si tu n'arrives pas à voir l'image correctement dans les spoilers, j'ai mis les liens des images pour les voir en grand dans ton navigateur à coté Smile

Par défaut, les balises "hide" sont carrées avec la couleur de fond paramétrée dans le panneau d'administration et avec quelques variantes selon la version.

PhpBB2 :
Spoiler:
PhpBB3 :
Spoiler:
PunBB :
Spoiler:
Invision :
Spoiler:
ModernBB :
Spoiler:
AwesomeBB :
Spoiler:

Idea Tous les codes donnés sont à placer dans la feuille de style CSS de ton forum : PA > Affichage > Couleurs > Feuille de style CSS

Toutes les versions

Ce qu'il faut retenir

Les codes en HTML sont construits comme ceci :
Code:

<dl class="codebox hidecode">
<dt style="border: none;"></dt>
<dd>
Contenu du Hide
</dd>
</dl>

Tout va se passer avec ces classes et balises :
codebox ou  hidecode : qui est l'ensemble de la boîte contenant le texte caché (hide)
dd qui est la balise à laquelle on va appliquer le style du contenu même.

Exemple

Bien plus simple que pour les code, les citations ou les spoiler, toute la mise en page se fait avec la classe codebox ou la classe hidecode ainsi qu'avec la balise dd à l'intérieur de ces classes.
La seule différence entre l'utilisation de ces 2 classes est que le style appliqué sur la classe codebox s'appliquera aussi aux citation, code et spoiler alors que la classe hidecode n'appliquera le style qu'aux hide.

Donc, pour avoir une largeur plus petite que le message on applique le style comme ceci :
Code:
.codebox{
  width:70%;
}
ou
Code:
.hidecode{
  width:70%;
}
Spoiler:

Et si on veut le contenu écarté de 10px du bord, un fond marron, un texte en justifié, en italique et à 13px on va avoir :
Code:
.codebox dd{
   padding:10px;
  background:brown !important;
font-style:italic;
  font-size:13px;
  text-align:justify;
}
ou
Code:
.hidecode dd{
   padding:10px;
  background:brown !important;
  font-style:italic;
  font-size:13px;
  text-align:justify;
}
Spoiler:

Exclamation Petite différence entre les versions concernant propriétés ( comme la couleur de fond par exemple) :
• sur phpBB2 et Invision elle s'applique à la balise dd,
• sur phpBB3, ModernnBB et AwesomeBB elle  s'applique à la classe codebox ou hidecode ,
• sur punBB elle s'applique aux deux (on peut en mettre 2 différentes)

Avertir qu'il y a du contenu caché

Suite à une question de Flitzz, voilà comment montrer aux utilisateurs qu'il ya  du contenu caché, sans lui montrer ce contenu.

Dans le message, il faut poster comme ceci :
Code:
[hide]Je suis le contenu du Hide[/hide]
<span class="txt-hide">Il y a du contenu caché</span>

Et dans la CSS on ajoute :
pour phpBB2 :
Code:
.codebox + * .txt-hide{display: none;}
Pour toutes les autres versions (phpBB3, PunBB, Invision, ModernBB et AwesomeBB) :
Code:
.codebox + .txt-hide{display: none;}

Ce qui donne :
Quand c'est caché:

Quand on peut voir:



Et voilà ! Tu sais maintenant comment personnaliser les balises "hide" sur ton forum !
Beaucoup de choses sont faisables Smile Si tu as des questions ou besoin d'aide pour personnaliser le tout, n'hésite pas à demander une aide. Nous t'aiderons avec plaisir.



Dernière édition par Mäven le Mer 5 Juin 2019 - 16:22, édité 2 fois
Flitzz
Flitzz
Pseudo Discord : TicTac
Messages : 772
http://sur-nos-ecrans.forumactif.com/

[Toutes versions] Personnaliser les balises "hide" Empty Re: [Toutes versions] Personnaliser les balises "hide"

Mer 5 Juin 2019 - 15:09
Salut Mary,

c'est à mettre dans la CSS, si je suis pas trop idiot ....

et par exemple si je veux que la personne sache qu'il y a un hide, je peux rajouter un titre du genre je suis sous hide un peu comme pour un spoiler mais sans que ça n'ouvre le hide ?
Mäven
Mäven
Râleuse (Admin)
Informations : Présente quelques heures par semaine =)
----
Idea Viens papoter avec nous sur le discord

Messages : 3991
https://tambouille-raleuses.forumactif.com/

[Toutes versions] Personnaliser les balises "hide" Empty Re: [Toutes versions] Personnaliser les balises "hide"

Mer 5 Juin 2019 - 16:06
Coucou !

Ah oui ! Je ne l'ai pas précisé, dans aucun des tutos :O Je vais aller le faire : oui c'est bien dans la CSS du forum (PA > Affichage > Couleurs > Feuille de style CSS).

Pour faire ce que tu souhaites, en fait ce n'est pas possible automatiquement.
Par contre, tu peux faire afficher un texte manuellement et le faire disparaitre quand le hide est affiché : Miettes a trouvé comment faire facilement.

Pour cela, dans ton message il faut que tu fasses comme ceci :
Code:
[hide]Je suis le texte sous hide[/hide]
<span class="txt-hide">Il y a du contenu caché</span>

Et dans la CSS de ton forum :
Code:
.codebox + .txt-hide{display: none;}

Est-ce que ça répond à ta question ? Smile
Je vais aller l'ajouter au tutoriel

_________________
Flitzz
Flitzz
Pseudo Discord : TicTac
Messages : 772
http://sur-nos-ecrans.forumactif.com/

[Toutes versions] Personnaliser les balises "hide" Empty Re: [Toutes versions] Personnaliser les balises "hide"

Mer 5 Juin 2019 - 16:23
RE,

Ah d'accord,

merci c'est super comme petit plus !!
Mäven
Mäven
Râleuse (Admin)
Informations : Présente quelques heures par semaine =)
----
Idea Viens papoter avec nous sur le discord

Messages : 3991
https://tambouille-raleuses.forumactif.com/

[Toutes versions] Personnaliser les balises "hide" Empty Re: [Toutes versions] Personnaliser les balises "hide"

Mer 5 Juin 2019 - 16:24
J'ai ajouté avec un screen et des explications sur le tutoriel Smile

Merci à toi pour ta question Very Happy

_________________
Flitzz
Flitzz
Pseudo Discord : TicTac
Messages : 772
http://sur-nos-ecrans.forumactif.com/

[Toutes versions] Personnaliser les balises "hide" Empty Re: [Toutes versions] Personnaliser les balises "hide"

Mer 5 Juin 2019 - 16:30
I love you de rien, c'est avec plaisir.
Contenu sponsorisé

[Toutes versions] Personnaliser les balises "hide" Empty Re: [Toutes versions] Personnaliser les balises "hide"

Revenir en haut
Permission de ce forum:
Vous pouvez répondre aux sujets dans ce forum
Les coups de ♥ des Râleuses



Post-It des Râleuses