Como instalar botão de reação no Blogger com Vicomi

Vocês já podem estar familiarizados com os botões de reação que muitas vezes aparecem nos sites de notícias acompanhados por ícones chamativos, geralmente no final do artigo. Este botão de reação serve para adicionar feedback do leitor sobre o artigo que ele está lendo.




Para aqueles que usam a plataforma WordPress, há o plug-in DW Reaction, o Emotify Reaction e outros plugins de botão de reação que podem ser adicionados facilmente nessa plataforma. Mas e a plataforma do Blogger? Na verdade, o blogger em si já fornece um recurso de botão de reação, porém é muito simples e com botões de rádio. Agora eu vou compartilhar com vocês como instalar o botão de reação do Vicomi, mais legal que o botão de reação padrão do Blogger.


Como instalar botão de reação no Blogger com Vicomi

Para aqueles interessados em instalar este botão de reação Vicomi, por favor, siga os passos abaixo:

1. A primeira coisa a fazer é criar uma conta no site Vicomi.



2. Em seguida, clique no botão Get Your Free Reaction Tools Now e na página que se abrir clique no botão Get the code for HTML website.



3. Em seguida, preencha o formulário completamente.



4. Em seguida, copie o código fornecido no blog.




Como adicionar aos temas do Blogger

1. Adicione o código como na imagem acima no tema antes de </body>.

<b:if cond='data:blog.pageType == &quot;item&quot;'>
<script type='text/javascript'>
//<![CDATA[
// Tombol Reaksi Vicomi
!function(){var e=document.createElement("script");e.async=!0,e.src="https://assets-prod.vicomi.com/vicomi.js?token=1d852d9a6638475caf87db6cf9dd5255";var c=document.getElementsByTagName("script")[0];c.parentNode.insertBefore(e,c)}();
//]]>
</script>
</b:if>


2. Adicione também o código HTML abaixo após o código <data:post.body/>.

<b:if cond='data:blog.pageType == &quot;item&quot;'>
<div id='kabarvicomi'>
<div class='kabarvicomi'>
<div data-access-token='1d852d9a6638475caf87db6cf9dd5255' data-display-type='4' id='vc-feelback-main'/>
</div>
</div>
</b:if>


3. Também adicione este CSS antes do primeiro </style> da página.

#kabarvicomi{position:relative;margin:0 auto 20px auto;overflow:hidden}
.kabarvicomi{margin:-28px auto}


Você também pode definir a aparência do botão de reação no painel da Vicomi, por favor, explore conforme necessário



A desvantagem deste botão de reação é que não suporta vários sites, então você só pode adicionar um site por conta.


Comentários