Placer le titre des forums dans leur description

[Invité]

Détails techniques

Version du forum : phpBB2
Poste occupé : Fondateur
Navigateur(s) concerné(s) : Google Chrome
Personnes concernées par le problème : Moi uniquement
Lien du forum : http://hetaliaworldacademy.forumactif.org

Description du problème

Bonjour à tous !

Ce forum est une véritable Bible pour tous les administrateurs, et voilà que c'est à mon tour de venir y partager mes petits ennuis...

Je ne rencontre pas de problème à proprement parler, mais il y a une modification d'affichage que je tente d'effectuer, sans succès.
Je souhaiterais placer le titre des forums en haut de leur description, comme sur la capture suivante :

Spoiler:

Cela est-il possible sous forumactif ? Si oui, comment faire ? Y'a-t'il un tuto auquel se référer ? Je crains qu'il ne s'agisse de quelque chose à modifier dans les templates, et je ne maîtrise pas ces bêtes-là.
J'ai déjà réussi à mettre les descriptions en colonnes, il ne me manque plus que ces vilains titres récalcitrants.

Merci beaucoup !

[MlleAlys]

Bonjour ^^

..	Bienvenue sur le Forum des Forums ForumActif Vu que vous êtes nouveau, voici quelques sujets importants : Sécurité : mail de fondation - Ce qu'il ne faut pas faire Questions/Réponses fréquentes - Listing Trucs et astuces - Listing La fonction Rechercher La FAQ de ForumActif.com N'hésitez pas à ouvrir un nouveau sujet si vous ne trouvez pas votre réponse

Le lien du forum mis dans les détail ne semble pas correspondre à la capture, sur quel forum se pose le problème ?
Le template concerné par l'affichage des catégories est index_box, et est ici déjà modifié, pourriez vous en fournir le code s'il vous plait ? (sous hide si besoin) ^^

[Invité]

Bonjour, et merci de votre réponse ! ^^

Il s'agit d'une modification que je souhaiterais effectuer sur mon forum, mais je ne suis pas encore parvenu à le faire ! Le modèle de la capture d'écran est ce forum, il s'agit en quelque sorte de mon objectif !

Voici mon index_box :

[MlleAlys]

C'est votre forum test qu'il est intéressant d'avoir pour ce genre de problème, afin de pouvoir inspecter les éléments, les codes, etc
Le template à modifier est donc également celui du forum de test, il me semble que ce n'est pas celui que vous avez donné, ici ce que vous voulez faire n'a pas de rapport direct avec l'autre ^^"

Pour afficher vos codes dans un message, il est préférable de les mettre entre balises code, comme ça :

Code:

[code]LE CODE ICI[/code]

Avec un hide si besoin ça donne ça :

Code:

[hide][code]LE CODE ICI[/code][/hide]

ça permet de prendre moins de place et de garder la mise en forme du code pour qu'il soit plus lisible et compréhensible ^^

[Invité]

Décidément, je suis un peu dur de la feuille ! Désolé et encore désolé ! orz
Voici donc mon forum test, sur lequel j'ai commencé à modifier les descriptions de forums, sans toucher encore aux templates.

index_box du forum test (qui est normalement le même que celui du forum normal) :


Dois-je fournir le css et html des descriptions de catégories ?

[Invité]

Un petit up plein de foi, d'amour et... de chocolat. Joyeuses Pâques en passant !

[MlleAlys]

Alors, j'ai vu que vous aviez un code css pour afficher les titres des forums à droite dans cette mise en forme :

Code:

a.forumlink {
  font-family: Courier New;
  font-size: 15px;
  font-style: bold;  /*cette ligne n'est pas correcte et donc ne sert à rien*/
  letter-spacing: 5px;
  margin: 1px 1px 1px 0;
  text-align: right;  /*ici pour aligner à droite*/
  text-decoration: none!important;
  text-shadow: #BC70A0 0 0 1px;
  text-transform: uppercase;
}

Pour ce qui est de font-style: bold; la propriété n'est pas correcte, font-style permet de mettre un texte en italique, pour mettre un texte en gras ("bold"), il faut utiliser font-weight, ce qui donnerait font-weight: bold;
Mais comme les titres des catégories est déjà en gras cette ligne n'est pas utile ^^

Pour ce qui est de l'alignement à droite, il ne s'applique pas ici car le titre n'est pas un élément "bloc" mais un élément "en ligne"... il n'y aurait pas de sens à dire qu'un mot au milieu d'une phrase doit être aligné à droite, c'est tout un bloc qu'il faut aligner ! Pour afficher le titre comme un bloc et donc pouvoir aligner le texte à droite, vous pouvez compléter le code précédent avec display:inline-block; (un bloc dans la ligne et fait) et width:100%; (pour que le bloc prenne toute la largeur displonible)
Ce qui donne finalement :

Code:

a.forumlink {
  display: inline-block;
  width:100%;
  margin: 1px 1px 1px 0;
  text-align: right;
  font-family: Courier New;
  text-transform: uppercase;
  font-size: 15px;
  letter-spacing: 5px;
  text-decoration: none!important;
  text-shadow: #BC70A0 0 0 1px;
}

Le titre est alors aligné à droite.



Si cependant ce résultat ne vous convient pas et que vous souhaitez avoir le titre à côté de l'image de la description comme sur votre modèle et non pas au dessus comme le résultat de la première option, je pense que le plus simple ici est d'écrire le titre du forum vous même dans sa description, en ajoutant

Code:

<a class="forumlink" href="LIEN DU FORUM" style="display: block;">LE TITRE DU FORUM</a>

directement à l'endroit voulu dans la description du forum.
Par exemple pour le premier :

Code:

<a class="forumlink" href="/f4-faire-partie-de-la-secte" style="display: block;">Faire partie de la secte</a>

Comme la classe "forumlink" est ici appliquée au lien, la mise en forme déjà précisée dans css s'appliquera également.
Et pour éviter d'avoir du coup les deux titres, on peut compléter votre code :

Code:

a.forumlink {
  font-family: Courier New;
  font-size: 15px;
  font-style: bold;  /*cette ligne n'est pas correcte et donc ne sert à rien*/
  letter-spacing: 5px;
  margin: 1px 1px 1px 0;
  text-align: right;  /*on ne veut plus aligner à droite donc la ligne ne sert à rien*/
  text-decoration: none!important;
  text-shadow: #BC70A0 0 0 1px;
  text-transform: uppercase;
}

avec display: none;
ce qui veut dire que les liens de type forumlink ne s'afficheront pas. Mais comme dans celui de la description on a bien précisé style="display: block;" celui là s'affichera ^^
On retire au passage les deux lignes indésirables, ce qui donne :

Code:

a.forumlink {
  display: none;
  margin: 1px 1px 1px 0;
  font-family: Courier New;
  text-transform: uppercase;
  font-size: 15px;
  letter-spacing: 5px;
  text-decoration: none!important;
  text-shadow: #BC70A0 0 0 1px;
}

[Invité]

C'est parfait ! La seconde solution est exactement ce que je souhaitais faire !

Voici les résultats si quelqu'un est intéressé :

Par contre, cela affecte aussi les sous-forums. Ne pas oublier de leur apposer manuellement un lien aussi, ou ils ne comporteront pas de titre (donc impossible de les ouvrir).

Merci beaucoup pour tout, @MlleAlys ! Bonne soirée !