[Résolu] Probleme d’affichage frontend HTML widget (Créer un compte)

  • WordPress :5.8
  • Statut : résolu
  • Ce sujet contient 2 réponses, 2 participants et a été mis à jour pour la dernière fois par Yoloic, le il y a 1 semaine.
3 sujets de 1 à 3 (sur un total de 3)
  • Auteur
    Messages
  • #2420014
    Yoloic
    Participant
    Initié WordPress
    5 contributions

    Bonjour,

    J’aimerais créer un effet de machine à écrire sur mon texte, et j’ai utilisé un script JavaScript dans un widget HTML sut Elementor, et tout fonctionne coté backend, mais rien ne s’affiche coté frontend.

    Coté backend l’animation du texte en rouge se fait sans problème, mais cote frontend il n’y a absolument rien.

    Voici le code ajouté au widget HTML :

    <script src="https://cdn.jsdelivr.net/npm/typed.js"></script>
    <div class="autotyping"><span class="typing_text"></span></div>
    <script>
    //typing text animation script
        var typed = new Typed(".typing_text", {
            strings: ["Grâce au SMS,      envoyez vos Offres à tout le monde     <br>Même aux Clients ...      que vous n’avez pas encore !"],
            typeSpeed: 55,
            loop: false,
            cursorChar: '|️',
        });
    </script>
    <style>
    .autotyping{
        font-family: 'Courier', serif; 
        color: #f92221;
        font-size:2.5em;
        font-weight: 800;
        text-align: center
    }
    .autotyping>span{
        color: #f92221;
        font-size:0.9em;
        font-weight: 600;
        letter-spacing: -1px;
    }
    /*Shrinking for tablet*/ 
    @media (min-width: 481px) and (max-width: 768px) {   
      .autotyping{
        font-size:2.0em;
        font-weight: 800;
        text-align: center
        }
       
    .autotyping>span{
        font-size:0.7em;
        font-weight: 100;
        letter-spacing: -2px;
      }
    }
    /*Shrinking for mobile*/ 
    @media (max-width: 480px) {
      .autotyping{
        font-size:1.9em;
        font-weight: 800;
        text-align: center;
    } 
    .autotyping>span{
        font-size:0.7em;
        font-weight: 100;
        letter-spacing: -2px;
    }   
    }
    </style>

    Pour info, je n’y connais rien en JavaScript.

    Pour ceux qui veulent directement jeter un coup d’oeil au site voici le lien : http://www.web.fenchell.com/sms

    Merci d’avance aux personnes qui essaieront de m’aider !

    Fichiers joints :
    Vous devez être connecté pour voir les fichiers joints.
    #2420025
    mathieu42
    Participant
    Maître WordPress
    1509 contributions

    le fichier typed.js qui est sur votre site ne correspond pas à l’exemple de code dans votre message.

    vous avez peut-être un système de cache qui a déformé le fichier et qui rend le code invalide.

    #2420057
    Yoloic
    Participant
    Initié WordPress
    5 contributions

    Merci pour votre réponse.
    En effet, le nom du fichier change pour je ne sais quelle raison…

    Je ne sais pas si c’est très optimisé mais j’ai résolu le problème en mettant le script entier directement dans le widget HTML pour contourner le problème de redirection.

    Le problème a été contourner mais si quelqu’un a une meilleure solution je suis preneur!

3 sujets de 1 à 3 (sur un total de 3)
  • Vous devez être connecté pour répondre à ce sujet.