Neste tutorial, irei fornecer um guia detalhado sobre como incorporar seu widget em uma aplicação React.
1. O primeiro passo é copiar o código do widget criado:
2. Depois de copiar o código, você precisará separar o código HTML do JavaScript, por exemplo:
Este é o código do widget do 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>
Código HTML:
<div class="embedsocial-hashtag" data-ref="f718fc77f3f7142d374023362f2fd1f2aa471605"></div>
Código 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. Em seguida, acesse sua aplicação React e crie um novo componente no diretório de componentes e cole o código HTML dentro da função render:
Cole o código JavaScript dentro do método de ciclo de vida componentDidMount:
4. Navegue até a página onde deseja exibir o widget, no nosso caso, adicionaremos ao App.js principal e importe o componente que acabamos de criar:
5. Isso é tudo. Depois de fazer isso e salvar as alterações, o widget aparecerá na sua página.
Se tiver alguma dúvida, clique no ícone de chat no canto inferior direito para falar com nossa equipe de sucesso do cliente ou envie um e-mail para support@embedsocial.com
Estamos aqui para ajudá-lo 🙏