wombat: remplacer images par texte + déplacer les champs de profil

coucou kim

je viens t'embêter pour deux petits soucis concernant la visionneuse de profil.

1) ça concerne les boutons de contact. malgré la p'tite ligne d'info que tu as ajoutée sur le JS et que j'ai bien suivi, ça ne semble pas marcher

Code:

// Pour les boutons de contact affichée dans le profil seul, utilisez l'inspecteur d'élément pour trouver l'ID correspondant au bouton // $('#field_idxxx img').replaceWith("Autre")

visiblement l'id direct c'est aussi i_icon_pm qui est déjà présent dans le JS, sinon j'ai aussi tenté avec field_id qui semble être la div id contenant les boutons de contact mais sans succès...
ça s'affiche vraiment comme ça:

Spoiler:

j'ai mis l'image dans le premier pour le mp et une image empty pour le mail, voir si ça faisait une différence mais rien n'y fait snif

2) j'aimerais déplacer plusieurs champs à plusieurs endroits différents aussi dans la visionneuse, par exemple l'image aes du profil qu'elle s'affiche dans la visionneuse à un endroit spécifique (j'ai réussi à le faire dans les messages, mais pas du tout dans le profil... j'ai vu ta réponse dans ce sujet vu que c'était la même chose, mais je n'ai pas compris ce que tu voulais dire par simple fonction en JQuery (qu'on colle directement dans le template du coup?), j'ai tout de même essayé mais sans succès malheureusement, et vu comme tu n'as pas eu de retour, je me suis dit que j'allais redemander quand même!


voici le template du profile_view_body si jamais, je n'ai pas changé grand chose.

profile_view_body:

et le css correspondant à cette partie là, si jamais:

css:

merci infiniment pour ton aide, ta disponibilité et toutes les ressources que tu mets en libre service, le blank theme a changé ma manière de coder et j'ai appris énormément avec toi. hâte que tu ajoutes d'autres choses au shop de ton kofi hihi j'irai quand même faire un tour.

du love <3

Hey !!

De ce que je comprends, des deux problèmes, ton JS pour déplacer les éléments ne fonctionnent pas sur la visionneuse de profil c'est ça ? Est-ce que ça fonctionne sur la page normale du profile ?

Car je ne sais pas si tu as vu mais dans la partie option de la documentation du plugin il y a un point sur "afterLoad" qui permet d'ajouter du JS Donc il faudrait ajouter ton JS une deuxième fois comme montrer dans l'exemple


Pour le code que tu as vu sur l'autre sujet, c'est un script à mettre dans la page de gestion de script ! La première variable à renseigner c'est l'emplacement de l'élément et la deuxième variable c'est l'identifiant de l'élément que tu veux déplacer.

Dis moi ce qu'il en est !

coucou!
merci pour ta réponse express olala

alors du coup j'ai bien ajouté l'initialisation du script dans le template overall_footer_end et j'ai regardé pour l'afterload!
du coup oui, tout fonctionne très bien dans les posts, j'ai pu déplacer les champs de profil tranquille où je voulais, mais en effet ça ne marche pas dans le wombat snif
si je comprends bien alors, c'est censé ressembler à ça?

Code:

<!-- Wombat.js -->
<script src="https://cdn.jsdelivr.net/gh/caezd/wombat/dist/wombat.min.js"></script>

<!-- Script qui permet d'initialiser le plugin -->
<script>
    (function() {
 new Wombat({
      afterLoad: function(aside, overlay) {
          var color = aside.querySelector('#rang').style.color;
          aside.querySelector('.rank-header').style.backgroundColor = color;
      }
  });
  
</script>

et ensuite je dois remplacer le "var color = aside.querySelector('#rang').style.color;
         aside.querySelector('.rank-header').style.backgroundColor = color;" par

Code:

// Pour les boutons de contact affichée dans le profil seul, utilisez l'inspecteur d'élément pour trouver l'ID correspondant au bouton // $('#field_idxxx img').replaceWith("Autre")

c'est bien ça? enfin, j'ai essayé mais ça ne marche pas donc j'crois que j'suis totalement à côté de la plaque pour qqch, j'suis vraiment désolée     moi et le JS ça fait 239872... comme dit, ça marche pourtant très bien dans les posts pour tout ce qui est bouton d'édition et de contact donc je comprends pas trop le souci ici

pour ma deuxième question, j'ai donc bien créé un nouveau JS que j'ai activé sur toutes les pages avec ce code:

Code:

$(function() {
    $(function() {
      $('[.profile_bottom]').prepend( $('[#field_id-11') );
    })
});

sans succès le champ spécifique ne veut pas se déplacer dans mon cadre profile_bottom...

merci encore pour ton aide si précieuse

Alors pour le deuxième point normalement on y est presque ! Il faut retirer les crochets dans chaque variable du code (ma faute, sa portait à confusion!) et ça devrait marcher.

Pour l'autre point je te propose qu'on voit ça sur discord car ça serait plus simple d'échanger etc

Edit : ça a été corrigé !
Voici le code que j'ai fourni à Elysium :

Code:


(function () {
  new Wombat({
    afterLoad: function (aside, overlay) {

      // Dupliquer pour chaque changement de texte voulu
      aside.querySelectorAll("#field_id:first-of-type a").forEach((item) => {
        item.innerHTML = "MP";
      });
      //

      const fields = [
        // Dupliquer pour chaque élément à déplacer
        {
        info: aside.querySelector("#field_id-11"), // l'élément à déplacer
          placement: aside.querySelector(".profile_bottom"), // l'emplacement
        },
        //
      ];
 
      fields.forEach(({ info, placement }) => {
        placement.appendChild(info);
      });
    },
    allowGuests: true,
  });
})();

(retirez les commentaires // avant le c/c dans le template)