Afficher le lien de dernière réponse sur une seule ligne

Bonjour, bonsoir !

Dans ce tutoriel très rapide et très simple je vous propose une variante de ce tutoriel rédigé par Taktiik en l'adaptant à un autre changement de mise en forme sur lequel il n'est pas possible d'agir autrement qu'avec du javascript ou, dans le cas présent, du JQuery.
Il s'agit de l'affichage du lien de dernière réponse, c'est à dire traditionnellement ceci :


Pour le changer en cela :




Pour l'explication, la variable qui affiche ces informations de dernier message est unique, et il n'est donc pas possible d'en isoler les éléments de date, titre et auteur. Ils se mettent automatiquement à la ligne.
Nous allons donc simplement utiliser le JQuery, identique à celui de la mise à la ligne des sous-forum, pour changer le code de retour à la ligne (br) en un "rien du tout" x).

Voici la fameuse variable qui correspond à votre "dernier message" :

Code:

{catrow.forumrow.LAST_POST}

Généralement, cette mise en forme en une ligne sera judicieuse si vous avez modifié le reste, si vous voulez gagner de la place par exemple, ou bien mettre cet élément juste en dessous d'un autre (icône par exemple, ou le titre lui-même, pourquoi pas). Votre élément est donc déjà posé seul quelque part. Voici comment l'afficher.
Mettez le code suivant :

Code:

<div class="last_mess"><span class="gensmall" id="last">{catrow.forumrow.LAST_POST}</span></div>
<script type="text/javascript">
jQuery('#last').html(jQuery('#last').html().replace(/<br>/g,'<span style="display: inline-block; padding: 0 2px;">-</span>')).removeAttr('id');
  </script>

Une petite explication s'impose :
1) Votre "bloc" de dernier message pourra être personnalisé en utilisant la class "last_mess", par exemple de la façon suivante :

Code:

.last_mess
{
background: white;
padding: 2px;
border-top: 1px solid grey;
color: black;
text-align: center;
}

2) L'id "#last" est utilisée uniquement par le JQuery, car on lui dit en gros "identifie l'élément ayant l'id "#last" puis remplace dans cet élément ... (+ la consigne).

3) Dans mon cas je ne me suis pas contenté de remplacer le "br" par un vide, sinon la date, le titre et l'auteur étaient collés l'un à côté de l'autre, sans espacement. J'ai donc remplacé le "br" (retour à la ligne) par un "span" à qui j'ai directement donné des propriétés css, et qui contient un tiret "-" qui sert de séparation entre les infos.

Code:

<span style="display: inline-block; padding: 0 2px;">-</span>

Vous pouvez remplacer le tiret par autre chose, un symbole, une image... sachez juste qu'il se répètera, puisque présent deux fois : entre le titre et la date, puis la date et l'auteur. Le css est directement à l'intérieur, par l'attribut "style", et dans mon cas il sert à mettre une petite marge de part à d'autre du tiret.

Voilà, je pense avoir donné toutes les infos nécessaires pour utiliser ce petit code. Amusez-vous bien

Merci ! >//<

Kioul

Je viens aussi voir comment tu l'as rédigé en Jquery du coup :

Merci :)

Merci pour l'astuce

Merci

Mercii !

Merci :3

Tres utile en effet ^^ Merci Capt'ain :3

Han yeah, c'est un code trop bien ça ! *o* Merci Sparrow ! :3

Cela est très pratique quand on veut un forum avec un bel esthétique, merci

Merci beaucoup :)

Merci !

Ah tiens Oo ça c'est vachement intéressant à avoir sous la main !
Merci !

Merci beaucoup !

Merci

Merci :)

merci <3

Han trop bien ! *o*
Merci de ton partage Captain' <3

Thanks joli rendu

Merci :p

merci du partage

merci

merci cap'tain o/

Mercii *-*