Problème image titre catégorie dans les forums

[Invité]

Détails techniques

Version du forum : phpBB2
Poste occupé : Fondateur
Navigateur(s) concerné(s) : Google Chrome
Capture d'écran du problème :

Voir l'image:

Personnes concernées par le problème : Tous les utilisateurs
Lien du forum : (lien masqué, vous devez poster pour le voir)

Description du problème

Bonjour

J'ai souhaité mettre des images à la place du titre de mes catégories. J'ai donc utilisé le code suivant :

Code:

<img src="lien image" class="imgcategories" />

J'ai ajouté la class "imgcategories" afin de pouvoir aligner l'image comme je le souhaitais avec un margin. Cependant je me suis rendue compte que lorsque je me rendais sur un forum ou même un sujet, l'image de la catégorie déformait tout.

J'aurais aimé soit : que l'image du titre de la catégorie n'apparaisse que sur la page d'accueil et que dans les forums/sujets le titre de la catégorie apparaisse en format texte comme habituellement

Soit : que je puisse modifier la taille de l'image du titre de la catégorie dans les forums et sujets afin de l'adapter et de l'empêcher de déformer le reste (selon ce qui est possible de mettre en oeuvre)

J'ai tenté de mettre en place ce tutoriel mais puisque mon template index-box est modifié je n'arrive pas à avoir le rendu attendu... j'ai essayé avec différentes possibilités mais rien n'y fait. En effet lorsque je met en place les différents codes, cela fait complétement disparaître le titre de la catégorie dans les sous forums (plus d'affichage ni du texte ni de l'image). Mais j'aimerais que les titres des catégories restent visibles pour que l'on puisse continuer à cliquer dessus.

Voici mon code index-box si besoin

Code:

<!-- BEGIN catrow --><!-- BEGIN tablehead -->  

    <div class="tleCAT">{catrow.tablehead.L_FORUM}</div>
    <div class="mdlCAT"><!-- END tablehead -->

    <!-- BEGIN cathead -->
    <!-- END cathead -->
  
    <!-- BEGIN forumrow -->
      <div class="FRM"><div class="tleFRM"><a href="{catrow.forumrow.U_VIEWFORUM}">{catrow.forumrow.FORUM_NAME}</a></div><div class="lmsgFRM">{catrow.forumrow.LAST_POST}<div class="imgFRM"><img src="{catrow.forumrow.FORUM_FOLDER_IMG}" /></div></div><div class="avaFRM"><!-- BEGIN avatar -->{catrow.forumrow.avatar.LAST_POST_AVATAR}<!-- END avatar --></div><div class="descFRM">{catrow.forumrow.FORUM_DESC}</div><div class="sfFRM"><div>{catrow.forumrow.L_LINKS}{catrow.forumrow.LINKS}</div></div><script type="text/javascript">$('.sfFRM').each(function(){$(this).html($(this).html().replace(/>, /g,"><br /> "));});</script></div>
    <!-- END forumrow -->
  
    <!-- BEGIN catfoot -->
    <!-- END catfoot -->
    <!-- BEGIN tablefoot -->
    </div>
    <div class="btmCAT"></div>
    <!-- END tablefoot --><!-- END catrow -->

Merci d'avance et bonne journée

[Pinguino]

Bonjour,

Je ne peux répondre à votre question initiale.

Par contre, je vous conseille d'insérer une balise ALT avec une brève description de la catégorie. Cela permet d'éviter ce type d'erreur notamment :

[Invité]

Bonjour,

Je ne peux répondre à votre question initiale.

Par contre, je vous conseille d'insérer une balise ALT avec une brève description de la catégorie. Cela permet d'éviter ce type d'erreur notamment :

Bonjour Pinguino,

C'est noté je vais essayer de faire ça merci

[Invité]

up ?

[Invité]

petit up ?

[Invité]

Après plusieurs bidouillages et recherches, j'ai trouvé la solution Pour les personnes que cela pourrait intéresser j'ai utilisé ce tutoriel

J'ai du bidouillé un petit peu puisque mon template index-box était modifié. Si votre template index-box est modifié, voici la marche à suivre (du moins c'est comme ça que j'ai réussi à régler mon problème!)

Chercher dans votre template index-box ce bout de code :

Code:

{catrow.tablehead.L_FORUM}

Si ce code a été entouré d'une div, alors on aura quelques ajustements à faire par rapport au code du tutoriel. Par exemple dans mon cas :

Code:

<div class="tleCAT">{catrow.tablehead.L_FORUM}</div>

Il faut donc ensuite modifier le premier code du tutoriel, celui-ci :

Code:

a.forumlink span, a.forumtitle span { display: none; }
a.forumlink img, a.forumtitle img { display: inline!important; }

par :

Code:

.tleCAT span { display: none; }
.tleCAT img { display: inline!important; }

On modifie le a.forumlink bidule par le nom de notre div. Il ne faudra pas ensuite oublier d'appliquer le dernier code à chacune de nos catégories

Je ne sais pas si c'est très clair mais si ça peut permettre d'aider d'autres personnes, autant que cela serve De ce fait on peut clôturer mon sujet, le problème est résolu

Bonne soirée