Você sabia que é possível customizar algumas partes do nosso widget? Neste artigo você aprenderá como!

Requisitos: É necessário que sua loja já possua a versão mais atualizada do nosso widget, o qual chamamos de sincero ou widget v2. Você pode aprender mais sobre a instalação navegando por nosso FAQ ou clique aqui.

Vamos usar neste exemplo a customização do botão "Carregar Mais":

Passo 1
Adicione a seguinte porção de código juntamente na sua estrutura que dá início ao nosso widget:

<script type="text/javascript">
var customStyle = {
buttonHasMore: {
background: '#fd5e53',
border: '1px solid #fd5e53',
color: 'white',
borderRadius: '4px'
},

buttonHasMoreHover: {
background: '#ec7373',
border: '1px solid #ce0f3d',
color: 'black'
}
}
window._trustvox = [];
_trustvox.push(['_storeId', 'Id-Loja']);

_trustvox.push(['_productId', productId]);
_trustvox.push(['_productName', productName]);
_trustvox.push(['_productPhotos', [url.image]]);
// ESTA LINHA É A RESPONSÁVEL PELA CUSTOMIZAÇÃO:
_trustvox.push(['_customStyle', customStyle]);
</script>

Passo 2

Salvar e atualizar a sua página de produto, se tudo correu bem agora você deve ver algo como:

E pronto, você já aprendeu como deixar o nosso widget com o look n feel da sua empresa!

Obs: Existem diversas partes do sincero.js que podem ser customizadas, e estão disponíveis abaixo:

  • buttonHasMore

  • buttonHasMoreHover

  • buttonUpvote

  • buttonUpvoteHover

  • buttonUpvoteSelected

  • buttonDownvote

  • buttonDownvoteHover

  • buttonDownvoteSelected

  • buttonDefault

  • buttonDefaultHover

  • buttonDefaultDisabled

  • buttonSuccess

  • buttonSuccessHover

  • buttonSuccessDisabled

  • buttonDanger

  • buttonDangerHover

  • buttonDangerDisabled

  • surveyAttributeBar

  • surveyAttributeBarLabel

  • surveyAttributeBarItem

  • surveyAttributeBarItemLabel

  • surveyAttributeBarItemSelected

  • recommendationsText

  • recommendationsValue

  • recommendationsMainline

  • recommendationsBaseline

  • recommendationsIE10

  • starsBackground

  • starsForeground

  • generalText

  • productRateNoteValue

  • productRateNoteOf

  • productRateLabel

  • productRateBasedOn

  • noReviewsTitle

  • noReviewsMessage

  • featuredOverview

  • featuredTitle

  • featuredCount

  • featuredText

  • reviewRate

  • reviewInfo

  • reviewText

  • reviewRecommendation

  • reviewVoteQuestion

  • reviewReply

  • questionsHeaders

  • questionsQuestion

  • questionsAnswer

  • questionInfo

  • questionInput

  • questionInputFocus

  • questionInputSuccess

  • questionInputDanger

  • questionsPrivateAnswer

  • trustvoxLogo

  • footerContainer

  • importFonts

Se você quer customizar algo que não está nesta lista, entre em contato com a RA Trustvox através do chat 💬 disponível no menu 'Dúvidas e Suporte' no símbolo de interrogação ❔ do seu painel (de Segunda a Sexta das 9h às 17h - exceto feriados). Conte com a gente! 💚

Encontrou sua resposta?