Insérer une image dans la description d'un sujet

[melusine711]

Bonjour à tous,

Comme mon titre le souligne, j'aimerai insérer une image dans la partie "description" d'un sujet. J'ai fait des recherches sur votre forum d'aide et nombreux sujets disent qu'il est impossible de le faire. Hors il n'est pas impossible de le faire car je l'ai vu fait sur un autre forum de forumactif. J'ai demandé et ils m'ont dit qu'il faut insérer l'image dans la description du sujet. Dans l'arborescence des sujets d'une rubrique chacun d'eux à une image sous le titre du sujet.

Je sais qu'il faut utiliser ce code :

Code:

<td class="row1" onmouseover="this.className="row2"" onmouseout="this.className="row1"" width="100%"><div class="topictitle"><h2 class="topic-title"><a class="topictitle" href="URL du sujet"><span style="color:#6600FF; text-decoration:none;">Titre du sujet</span></a></h2></div><div class="description genmed"><div style="display: none;" class="topicImage"><img src="URL de l'image"></div></div><span class="gensmall"></span> <span class="gensmall"><br> [ <img src="URL Image 2" alt="Aller à la page" title="Aller à la page">Aller à la page: <a href="URL page du sujet">1</a>, <a href="URL page du sujet">2</a>, <a href="URL page du sujet">3</a>]</span></td>


C'est cette partie ci-dessous qui m'intéresse :

Code:

<div class="description genmed" >
      <div class="TopicImage" >
          <img src="URL de l'image" ></img>
      </div>
</div>

mais où l'insérer ? Faut-il du CSS en plus et lequel ou encore des scripts. Bref je cherche depuis 24h mais ne trouve pas et c'est en vain que je me tourne vers vous.

L'admin du forum en question ne peux pas plus m'aider dans le sens ou c'est son ancienne admin qui avait fait des manips. Elle, elle a juste à entrer l'URL de l'image dans la case "description" du sujet.

Merci à tous ceux qui pourraient éventuellement m'aider.

[Matriochka]

Bonsoir,

Quelle est l’URL du forum où tu as vu ceci ?

[melusine711]

http://psp4everdesigns.forumactif.org/

[Matriochka]

Apparemment, les invités n’ont pas accès au forum… Pourrais-tu faire une capture d’écran à l’endroit où tu as vu ça (une capture d’écran complète, pas découpée si possible)?

[melusine711]

Pas de soucis. Voilà :

j'ai hachuré les noms des membres.



J'ai pas mieux car c'est un écran de portable que j'ai donc j'ai pas jusqu'en bas pour la capture d'écran.

[melusine711]

Alors voilà j'ai ma rubrique de tutoriels sur leur forum et je peux assurerà 100% qu'il est possible de mettre une image dans la description du sujet.

Voici ma rubrique avec le 1er de mes sujets :



Dans la description du sujet j'ai entré le texte suivant :


(img entre [] au début puis URL de l'image puis /img entre [] à la fin.)

et vous avez l'image de ce texte ci-dessus.

Il est donc possible de mettre une image dans la description du sujet. Seulement je sais pas comment car moi j'ai mis la même chose sur mon forum et à la place j'ai du texte !

[Mome ETN]

Bonjour,

en effet c'est très facile.
Je reviens dans un instant : je fais quelques captures d'écran de mon propre forum pour vous montrer et j'éditerai.

OK (EDIT)
Voici un de nos forums, pour l'exemple :



Dans le panneau d'admin > général > catégories et forums > puis aller sur un des forums ou sous forum (avec la petite mollette jaune comme un engrenage) ( )
La suite comme indiqué sur l'image ci-dessous, en copiant-collant l'url de l'image choisie



Cordialement

[melusine711]

Merci Mome ETN mais ce n'est pas d tout cela. ça je le fais tous les jours avec mes rubriques de mon forum.

Ce que tu me montre c'est pour une rubrique du forum. Moi ce que je cherche c'est carrément dans les sujets d'une rubrique.

Merci tout de même pour ton aide.

[Mome ETN]

Ah, OK. Et bien si quelqu'un a la réponse... j'en apprendrais plus moi aussi.
Bonne soirée

[melusine711]

Ben j'espère que quelqu'un aura une réponse car moi j'ai fait des essais de beaucoup de choses mais le résultat sur mon forum c'est du texte à la place de l'image.

Je suis sûre d'une chose : cela doit se jouer dans du CSS avec du HTML et voir peut-être du javascript. Maintenant je sature d'essayé de trouver. J'ai essayé plusieurs "formules" (sauf le javascript car je ne connais aucunement ce jargon hihi!) mais échec total.

Merci quand même d'avoir essayé.

Voici ce que cela donne lorsque j'applique le code de l'insertion de l'image :


du texte et non une image.

[Bad_girls]

Bonjour!

Petite question... As-tu essayé le HTML plutôt que le BBCode pour ton image?

Perso j'ai fait comme a expliqué Mome ETN et ça donne donne exactement comme ta capture d'écran....



Mais s'il existe une autre façon de faire, alors je serai très intéressée de la découvrir moi aussi!

Donc je surveille le sujet et je me réjouis de lire d'autres façons de pratiquer l'inserton d'une image

Cordialement.

[melusine711]

Merci pour ta réponse Bad_girl mais ce que tu me présente ne sont pas les sujets d'une rubrique mais la catégorie. Regarde bien ma capture et celle du forum dans lequel ils mettent l'image dans la description du sujet et regarde ta capture.

D'une part ce que tu me présentes c'est ce que tu as sur ta page d'accueil de ton forum : une catégorie parmi tant d'autres mises en place. Moi et le forum en question ce sont les sujets qui se trouvent dans la catégorie en question.

D'autre part ces sujets en question diffèrent des catégories car comme tu peux le remarquer entre le titre du sujet et mon icône tout à droite (icône des sujets) il y a une toute petite case où ici normalement on met si l'on veux une icône de message. Je pourrai éventuellement mettre dans cette case "icône de message" mon image mais on est limité dans notre PA en ajout d'"icône de message" donc il y arrivera un moment ou lorsque j'aurai une trentaine de tutos à proposer (ce qui est le cas actuellement) je ne pourrai plus y ajouter d'image.

Je sais que c'est possible de faire (au vue de l'aperçu du forum qui le pratique) ce que je demande et je souhaiterai prouver qu'il est vraiment possible de le faire. Pour l'instant je cherche toujours.

Je sais que cela se passe autour du "description genmed" ou encore "topicTitle" et peut-être "TopicImage" en créant une class avec une div mais mon cerveau a saturé suite à maint et maint essai avec du CSS et du HTML mais le javascript ça je connais pas. J'ai même essayé avec du "input" mais rien. Je cherche toujours alors si quelqu'un aurai la soluce ou voir un petit coup de pouce je me sentirai moins seule ! Lol !

Merci encore pour ton intervention. Dans l'aperçu de mon forum ci-dessus ce serait tout de même mieux d'avoir l'aperçu de chacun des tutos en dessous de chacun d'eux au lieu de voir que le titre du sujet ! Quand il y en a 30 voir plus (je connais quelqu'un qui en à plus de 300 !) afin de choisir lequel faire il faut cliquer sur chaque sujet pour ce rendre compte de ce qu'il est proposé. Perte de temps. J'avais donc trouvé très agréable de voir les vignettes et éviter de cliquer partout. On est plus attiré par l'image d'un tuto que par son titre qui est généralement en anglais ! Hihi !

[melusine711]

Petit up

[Dragon12901]

Bonjour,

J'ai chercher cette solution et l'ai demander durant des mois sans aucune réponse tu devrais trouver mon sujet d'ailleurs ou je n'étais pas seul à chercher dsl de te démotiver.

Donc si ya réponse je prend de-suite

EDIT : je t'ai retrouver mon ancien sujet :

https://forum.forumactif.com/t340623-image-sur-un-sujet?highlight=image+dans+sujet

[melusine711]

Oui tu avais posé la question dans ton sujet mais moi au contraire de toi je sais que c'est faisable alors qu'à toi on t'avais dit que pour ta demande c'était impossible ! C'est d'ailleurs en lisant TON sujet que je me suis dit qu'il fallait "montrer" que c'était faisable. Donc je souhaite laisser mon sujet. J'ai la preuve que l'on peut le faire (regarde ma capture d'écran du forum en question).

Je sais que c'est possible seulement je ne trouve pas moi même comment faire et crois-moi j'ai essayé à me faire fumer le cerveau.

Tu ne me démotives pas car je sais que c'est faisable. Le seul soucis c'est que l'admin de ce forum n'est plus là pour me dire comment et les nouveaux admins ne savent pas comment elle a fait. Et pourtant elle ne connaisait pas grand chose en tout ça. Elle a juste "bidouillé" comme on m'a dit. Et moi je sais plus que bidouillé dans mon PA mais rien ! Aucun résultat ! Ils entrent juste ceci dans la description du sujet :



Moi quand je fais cela j'ai que du texte et non l'image.

Je te dis juste reste sur ce sujet : peut-être qu'un jour on aura la réponse car moi je n'abandonne pas : je cherche et teste toujours mais sans résultat positif.

[Matriochka]

Ne désespérez pas, c’est forcément possible, en effet.

Je ne laisse pas tomber le sujet, j’ai fait plusieurs tests pour tester, j’ai même tenté des scripts, du bidouillage… Mais le forum que tu montres est interdit aux invités, alors je ne peux pas voir comment ils s’y sont pris pour vous guider… Et avec le code donné plus haut, ça ne donne pas grand chose.

Il doit y avoir une modification à faire côté template / CSS… Je continue de chercher.

[melusine711]

Merci Matriochka ! Contente que je reste pas seule ! Hihi !

Moi aussi je suis allée voir du côté des templates mais je sais pas lequel est à prendre en compte. Les script malheureusement je ne connais pas.

Moi j'ai accès au forum car je suis l'une de leur membre car je leur propose me tutoriels persos et j'affirme que pour poster donc mes tutoriels persos, j'entre l'URL donné ci-dessus dans la description du sujet et j'ai mon image voulue à l'endroit voulu. Et c'est en cherchant une solution sur ce forum (suite à mon fumage de cerveau) que j'ai vu le sujet de Dragon12901 où on lui disait que c'était impossible de le faire qui m'as décidée à demander et montrer que c'était possible.

Merci encore. Je cherche toujours en entrant maintes et maintes choses mais pas de résultats pour le moment.

[Matriochka]

Si c’est bien dans les templates, alors ça se fera sans doute dans topic_list_box, qui génère l’affichage de la liste des sujets. Je te donne une réponse dès que possible Ça me permettra en même temps de découvrir car je n’avais jamais pensé à faire ça dans la description d’un sujet.

[Dragon12901]

Pas de souci, je reste la car moi aussi j'ai cette technique à coeur, mais je ne peut passer mes journées à mettre un Up

[Dragon12901]

Tiens je tes trouver sa sur FdF mais..... li le

https://forum.forumactif.com/t265850-mettre-une-image-dans-un-titre-sujet-comme-pour-les-categories-abandonne

[melusine711]

Merci Dragon 12901. Apparemment, si j'ai bien compris, aknail a carrément réussi à mettre une image dans le TITRE du sujet sauf qu'il y a quelques désagréments qui auraient pu certainement être corrigés s'il avait mis les codes qu'il a utilisé pour le faire. Cela nous aurait peut-être aidé. J'ai remarqué tout de même que certaines personnes demandent de l'aide, arrive à trouver seules et du coup mettent le sujet en résolu sans explication aucune de la façon dont ils ont procédés. C'est bien dommage car cela pourrait certainement aider d'autres personnes intéressées surtout si la solution a été trouvée et qu'elle fonctionne.

Bon aujourd'hui je vais essayé de "m'attaquer" au template topic_list_box. Enfin si j'arrive à le comprendre !

[melusine711]

Allez un petit up.

[melusine711]

Alors je me suis penchée sur le template topics_list_box et je pense que le point concerné pour un éventuel changement serait celui-ci (ligne 54 du template) :

Code:

<td class="{topics_list_box.row.ROW_CLASS}" onmouseover='this.className="row2"' onmouseout='this.className="{topics_list_box.row.ROW_CLASS}"' width="100%">
         <div class="topictitle">
            {topics_list_box.row.NEWEST_POST_IMG}{topics_list_box.row.PARTICIPATE_POST_IMG}{topics_list_box.row.TOPIC_TYPE}
            <h2 class="topic-title">
               <a class="topictitle" href="{topics_list_box.row.U_VIEW_TOPIC}">{topics_list_box.row.TOPIC_TITLE}</a>
            </h2>
         </div>
         <!-- BEGIN switch_description -->
         <span class="genmed">
            <br />
            {topics_list_box.row.topic.switch_description.TOPIC_DESCRIPTION}
         </span>
         <!-- END switch_description -->

Et particulièrement à la fin au "BEGIN switch description". Après je ne sais pas "comment" et "quoi" exactement changer. C'est peut-être un début.

Edit : une petite question : le javascript où doit-on le mettre ?
- Peut-on le mettre directement dans un template ?
- Ou doit-on passer par le PA "Gestion des codes javascript" ?

Car j'ai trouvé ceci en javascript :

Code:

<script type="text/javascript">
      jQuery(document).ready(function(){jQuery(".description").each(function(){var content = jQuery(this).html();var detector = /\[img\](.*)\[\/img\]/ ;var url = detector.exec(content );content = content.replace(url[0],"<div class='topicImage'><img src='"+url[1]+"'/></div>");jQuery(this).html(content);});jQuery("div.topictitle").mouseover(function(){jQuery(this).parent().find(".topicImage").fadeIn(200);});jQuery("div.topictitle").mouseout(function(){jQuery(this).parent().find(".topicImage").fadeOut(200);});});
    </script>

Javascript trouvé en utilisant la fonction "Developpeur Web"-"Examiner" de l'outil de firefox sur la page du forum qui pratique l'insertion d'image dans la description.

Alors je ne sais pas si c'estça aussi qu'il faudrait envisager de voir.

Edit de nouveau : j'ai donc insérer ce code javascript dans mon PA "Gestion des codes javascrip" mais aucun résultat. Soit le code n'est pas pour cela (ce qui m'étonnerait fort) soit je le place pas au bon endroit ou alors soit il doit être associé avec du HTML ou encore du CSS.

On va y arriver les amis ! Je ne désespère pas.

[Dragon12901]

Je ne c'est pas si sa peut t'aider, mais quand je remplace une description pour pour y mettre un menu déroulant par exemple, je mais sa,

Code:

$(function$(function() {
          document.forms.post && document.forms.post.description && $('<select name="description"><option></option><option style="color:#F7EF00">
        [VU]</option><option style="color:#0B9D00">
        [NON VU]</option><option style="color:#F70000">
        [EN OPTION]</option></select>').val(document.forms.post.description.value).replaceAll(document.forms.post.description).closest("tr").find(".row1 .gen b").text("Balises")
        });

Dé-fois que sa puise t'aider, à trouver notre problème lol xp.

[melusine711]

Tu l'as inséré où ce script ? Tu ne lui a rien associé ?

[Dragon12901]

Tu le place dans ton PA/MODULE/GESTION DES JAVA SCRIPTS
et tu le place " sur toutes les pages "

Tu verra que tu n'aura plus de "description" mais un menu déroulant avec les menu que tu souhaite, après avec sa si tu peut y faire quelque chose pour créé un script à partir de se que je tes mis ! Je c'est pas j'essaye de fournir des solution pour une finalisation de notre problème lol

[Dragon12901]

Tu le place dans ton PA/MODULE/GESTION DES JAVA SCRIPTS
et tu le place " sur toutes les pages "

Tu verra que tu n'aura plus de "description" mais un menu déroulant avec les menu que tu souhaite, après avec sa si tu peut y faire quelque chose pour créé un script à partir de se que je tes mis ! Je c'est pas j'essaye de fournir des solutions pour une finalisation de notre problème lol

EDIT :
Oups mauvaise manip dsl.

[melusine711]

Ok merci je vais tester. Je te dis ce que cela me donnes avec ton code. Ensuite j'essaierai de voir en essayant de le bidouiller. Je suis sûre que je suis pas loin de la soluce mais c'est vrai qu'il y a des termes que je comprends pas et n'ose toucher car j'ai pas envie de perdre mon forum.

J'ai passé l'après-midi à m'instruire sur les librairies jQuery mais c'est toujours du charabia pour moi. Mais je suis sûre aussi que le script que j'ai fourni plus haut doit pouvoir nous aider car il y a des mots qui reviennent dedans comme "topicTitle", "description", "topicImage" et même les balises [img][/img]. La variable "detector" je suis sûre qu'il faut en faire quelque chose je sais pas, peut-être en CSS. Je suis un peu perdue sans une ligne de départ.

Je pense que nous avons déjà pas mal d'éléments pour travailler dessus. Après faut arriver à interpréter tout ça.

[melusine711]

Alors j'ai réussi à contacter l'ancienne admin du forum en question et ..... elle va m'aider. Apparemment ce serait un script qu'elle a fait. Mais elle ne sait plus comment, il faut qu'elle recherche. Elle ne sait pas si elle va retrouver alors en attendant on continue de chercher ! Car c'est pas sûre qu'elle retrouve !

[Dragon12901]

Nikel sa