AccueilDernières imagesRechercherS'enregistrerConnexion

Forum de graphisme, codage et game design proposant des tutoriels, astuces, libres services et commandes dans les domaines de l'infographie amateur, de l'intégration web (HTML et CSS essentiellement) ainsi que dans la conception de RPG sur forum.

Le Deal du moment : -48%
Philips Hue Pack Decouverte 2024 : lightstrip 3M + ...
Voir le deal
119 €

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

    Sparrow-style
    Sparrow-style
    FémininAge : 39Messages : 32055

    Jeu 29 Aoû 2013 - 23:38

    Rappel du premier message :



    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 :

    Afficher le lien de dernière réponse sur une seule ligne - Page 2 381788screen1

    Pour le changer en cela :

    Afficher le lien de dernière réponse sur une seule ligne - Page 2 692940screen2

    Le contenu n'est pas sous balide hide (explications), mais n'hésitez pas à remercier son auteur , et en cas d'utilisation un crédit à Never-Utopia serait sympa Wink.


    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 Wink

    Si vous avez des problèmes avec ce LS, venez poster ici.



    sign
    Kiowa
    Kiowa
    FémininAge : 35Messages : 220

    Sam 16 Nov 2013 - 23:30

    MERCI!! Sérieusement c'est ce que je cherche depuis des heures ><
    Onyx
    Onyx
    FémininAge : 31Messages : 3350

    Jeu 21 Nov 2013 - 16:27

    Merci ^^

    *lit le tuto*
    Au fond c'est la même chose que pour faire un retour de ligne pour les sous-forums, mais à l'inverse, c'est logique...
    Merci encore!
    YuuNyuu
    YuuNyuu
    FémininAge : 28Messages : 14

    Jeu 21 Nov 2013 - 17:54

    Merci !
    Woo
    Woo
    FémininAge : 33Messages : 143

    Ven 22 Nov 2013 - 23:23

    Mercii !!



    Afficher le lien de dernière réponse sur une seule ligne - Page 2 619075SignatureMukurocopie
    Mitsuomi73
    Mitsuomi73
    MasculinAge : 32Messages : 42

    Sam 23 Nov 2013 - 13:40

    merci =)
    Chhaya
    Chhaya
    FémininAge : 39Messages : 1213

    Lun 25 Nov 2013 - 11:47

    Merci pour le partage ♥



    Afficher le lien de dernière réponse sur une seule ligne - Page 2 200412081714641513

      Merci Sparrow :3
    Lylinee
    Lylinee
    FémininAge : 34Messages : 26

    Lun 25 Nov 2013 - 20:44

    Merci beaucoup =)



    Afficher le lien de dernière réponse sur une seule ligne - Page 2 Sign113
    hirondelle
    hirondelle
    FémininAge : 35Messages : 134

    Sam 7 Déc 2013 - 20:44

    Merci beaucoup :)
    hurudy
    hurudy
    MasculinAge : 44Messages : 40

    Mar 10 Déc 2013 - 21:54

    Merci:)
    Venise
    Venise
    FémininAge : 41Messages : 270

    Mer 11 Déc 2013 - 16:12

    merci
    Akito
    Akito
    MasculinAge : 32Messages : 73

    Dim 15 Déc 2013 - 3:29

    Merci beaucoup  Very Happy 
    So-chan
    So-chan
    FémininAge : 34Messages : 61

    Mer 18 Déc 2013 - 13:19

    Je ne connaissais pas l'astuce et je suis curieuse de voir ça. Merci !
    deeplies
    deeplies
    FémininAge : 29Messages : 11

    Jeu 26 Déc 2013 - 19:36

    Merci !
    PrincesseÔ
    PrincesseÔ
    FémininAge : 27Messages : 220

    Sam 11 Jan 2014 - 10:34

    ♥_♥ Exactement ce que je cherche!
    Lilie
    Lilie
    FémininAge : 41Messages : 190

    Sam 11 Jan 2014 - 22:03

    Ah c'est ce que je cherchais je crois !
    Merci :)
    Afterglow
    Afterglow
    FémininAge : 29Messages : 138

    Dim 12 Jan 2014 - 17:39

    Merci :)



    How do you get up from an all time low?
    Shanyme Thibolt
    Shanyme Thibolt
    FémininAge : 30Messages : 156

    Lun 13 Jan 2014 - 22:10

    Merci pour le partage.
    Grande
    Grande
    FémininAge : 36Messages : 207

    Mer 15 Jan 2014 - 7:22

    Merci



    Afficher le lien de dernière réponse sur une seule ligne - Page 2 171074gwenj10
    louha
    louha
    FémininAge : 37Messages : 219

    Ven 17 Jan 2014 - 23:59

    sympa. Je teste Very Happy
    Enidech
    Enidech
    MasculinAge : 33Messages : 39

    Mar 4 Fév 2014 - 18:50

    Merci Sparrow
    Vixinte
    Vixinte
    FémininAge : 26Messages : 90

    Mer 5 Fév 2014 - 15:31

      Bon, étant donné que je ne retrouve pas le code qui m'intéressais, je vais me contenter de celui-là. Merci pour tout tes tutoriels C'ptain !

      EDIT: En revanche, je ne sais pas si le problème viens de mon forum, de l'emplacement du code ou de ma quichattitude, mais mise à par le CSS, le template ne semble pas vouloir marcher ..
    Tchii
    Tchii
    FémininAge : 38Messages : 285

    Lun 10 Fév 2014 - 21:56

    Coucou!
    Merci pour ce petit tuto!
    A trés vite!
    Tchii!
    Lexis
    Lexis
    FémininAge : 34Messages : 40

    Mar 11 Fév 2014 - 14:07

    Merci du partage Wink
    Milly-Fili
    Milly-Fili
    FémininAge : 30Messages : 20

    Mer 12 Fév 2014 - 19:07

    Merci :)
    Katsura
    Katsura
    MasculinAge : 40Messages : 190

    Jeu 13 Fév 2014 - 0:13

    Merci Captain
    Contenu sponsorisé


      La date/heure actuelle est Jeu 12 Déc 2024 - 8:43