Dans ce tutoriel, je vais vous donner un guide détaillé sur la façon d'intégrer votre widget dans une application React.
1. La première étape consiste à copier le code de votre widget créé :
2. Une fois le code copié, vous devrez séparer le code HTML du code JavaScript, par exemple :
Voici le code du widget EmbedSocial :
<div class="embedsocial-hashtag" data-ref="f718fc77f3f7142d374023362f2fd1f2aa471605"></div>
<script> (function(d, s, id) { var js; if (d.getElementById(id)) {return;} js = d.createElement(s); js.id = id; js.src = "https://embedsocial.com/cdn/ht.js"; d.getElementsByTagName("head")[0].appendChild(js); }(document, "script", "EmbedSocialHashtagScript")); </script>Code HTML :
<div class="embedsocial-hashtag" data-ref="f718fc77f3f7142d374023362f2fd1f2aa471605"></div>
Code JavaScript :
(function(d, s, id) { var js; if (d.getElementById(id)) {return;} js = d.createElement(s); js.id = id; js.src = "https://embedsocial.com/cdn/ht.js"; d.getElementsByTagName("head")[0].appendChild(js); }(document, "script", "EmbedSocialHashtagScript"));3. Ensuite, rendez-vous sur votre application React et créez un nouveau composant dans votre répertoire components et collez le code HTML à l'intérieur de la fonction de rendu :
Collez le code JavaScript à l'intérieur de la méthode de cycle de vie componentDidMount :
4. Accédez à la page où vous souhaitez afficher le widget, dans notre cas nous allons l'ajouter à App.js, et importez le composant que nous venons de créer :
5. C'est tout. Une fois que vous avez fait cela et que vous avez enregistré les modifications, le widget apparaîtra sur votre page.
Si vous avez des questions, cliquez sur l'icône de discussion en bas à droite pour parler avec notre équipe du service client ou envoyez-nous un e-mail à support@embedsocial.com
Nous sommes là pour vous 🙏