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 à ne pas rater :
Pokémon EV8.5 : coffret Collection Classeur Évolutions Prismatiques
Voir le deal

    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 7 381788screen1

    Pour le changer en cela :

    Afficher le lien de dernière réponse sur une seule ligne - Page 7 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
    ~Li Mei
    ~Li Mei
    FémininAge : 33Messages : 21

    Ven 27 Mai 2016 - 16:30

    Merci, exactement ce que je cherchais :)
    Pearlqueen
    Pearlqueen
    FémininAge : 32Messages : 15

    Jeu 9 Juin 2016 - 20:54

    Merci
    MPGuenette
    MPGuenette
    FémininAge : 29Messages : 111

    Dim 26 Juin 2016 - 16:48

    merciiii
    Wanted
    Wanted
    FémininAge : 29Messages : 113

    Ven 1 Juil 2016 - 7:20

    Merci beaucoup pour le partage. :face:
    andie_xcv
    andie_xcv
    FémininAge : 29Messages : 35

    Sam 2 Juil 2016 - 19:59

    Merci !
    Kâ Lys
    Kâ Lys
    MasculinAge : 32Messages : 299

    Mer 13 Juil 2016 - 22:08

    Merci! (Y)



    Afficher le lien de dernière réponse sur une seule ligne - Page 7 Bug
    Omys
    Omys
    FémininAge : 29Messages : 63

    Dim 17 Juil 2016 - 12:22

    Merci :)
    AlphaElis
    AlphaElis
    FémininAge : 29Messages : 9

    Sam 6 Aoû 2016 - 15:51

    L'un des trucs que je cherchais depuis quelques jours... Franchement, vous me sauvez la mise~
    Merci beaucoup !
    :)



    Afficher le lien de dernière réponse sur une seule ligne - Page 7 1454708237-alphabanfofoaka. αelis


    Killjoy, ghost, and a lot of other thing~

    NanoiHime
    NanoiHime
    FémininAge : 26Messages : 566

    Lun 15 Aoû 2016 - 2:23

    mercii



    SIXE
    SIXE
    FémininAge : 33Messages : 39

    Dim 4 Sep 2016 - 1:00

    C'est exactement ce que je cherchais ! Thank you so much !
    Seano'k
    Seano'k
    MasculinAge : 28Messages : 20

    Sam 15 Oct 2016 - 16:42

    Un petit teste de code :)
    Lexucio
    Lexucio
    MasculinAge : 30Messages : 33

    Ven 28 Oct 2016 - 23:38

    Merci ^^
    Likilou
    Likilou
    MasculinAge : 31Messages : 309

    Jeu 2 Fév 2017 - 21:42

    merci



    Afficher le lien de dernière réponse sur une seule ligne - Page 7 707828SignArthur2
    Anonymous
    Invité

    Dim 5 Fév 2017 - 15:09

    Thanks x)
    Cornélius
    Cornélius
    MasculinAge : 26Messages : 17

    Sam 18 Mar 2017 - 22:42

    Danks le tuto qui me sauve la vie
    Toxinou
    Toxinou
    FémininAge : 33Messages : 41

    Dim 18 Juin 2017 - 11:45

    Merci ! Very Happy
    Prongs
    Prongs
    MasculinAge : 41Messages : 203

    Ven 1 Sep 2017 - 10:50

    Merci :) Il est top ce tuto :hudada:



    Afficher le lien de dernière réponse sur une seule ligne - Page 7 Christ10 Afficher le lien de dernière réponse sur une seule ligne - Page 7 Raph310
    TOM ELVIS JEDUSOR ~ JE SUIS VOLDEMORT
    Lord Voldemort est mon passé, mon présent & mon avenir

    freekish
    freekish
    FémininAge : 34Messages : 3

    Mar 14 Avr 2020 - 22:55

    Super code ! Merci beaucoup ! :)
    Contenu sponsorisé


      La date/heure actuelle est Jeu 12 Déc 2024 - 9:25