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:
buttonHasMorebuttonHasMoreHoverbuttonUpvotebuttonUpvoteHoverbuttonUpvoteSelectedbuttonDownvotebuttonDownvoteHoverbuttonDownvoteSelectedbuttonDefaultbuttonDefaultHoverbuttonDefaultDisabledbuttonSuccessbuttonSuccessHoverbuttonSuccessDisabledbuttonDangerbuttonDangerHoverbuttonDangerDisabledsurveyAttributeBarsurveyAttributeBarLabelsurveyAttributeBarItemsurveyAttributeBarItemLabelsurveyAttributeBarItemSelectedrecommendationsTextrecommendationsValuerecommendationsMainlinerecommendationsBaselinerecommendationsIE10starsBackgroundstarsForegroundgeneralTextproductRateNoteValueproductRateNoteOfproductRateLabelproductRateBasedOnnoReviewsTitlenoReviewsMessagefeaturedOverviewfeaturedTitlefeaturedCountfeaturedTextreviewRatereviewInforeviewTextreviewRecommendationreviewVoteQuestionreviewReplyquestionsHeadersquestionsQuestionquestionsAnswerquestionInfoquestionInputquestionInputFocusquestionInputSuccessquestionInputDangerquestionsPrivateAnswertrustvoxLogofooterContainerimportFonts
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 Sábado das 9h às 18h - exceto feriados).
Conte com a gente! 💚