Welcome to the
WalkMe Help Center
Please log in to continue
Please log in to continue
As Folhas de Estilo em Cascata (CSS) permitem aplicar personalização avançada às pesquisas, incluindo elementos como fonte, fundo e borda.
CSS pode ser usado para personalizar as pesquisas WalkMe e NPS:
Cascading Style Sheets (CSS) é uma linguagem de folhas de estilo usada para descrever a formatação de um documento escrito em uma linguagem de marcação. Ao escrever o CSS, você precisará consultar os diferentes componentes (tecnicamente conhecidos como elementos) da pesquisa. Ao digitar na janela CSS personalizada, o WalkMe exibe opções de preenchimento automático para seletores, propriedades e valores.
Cada pesquisa inclui vários componentes, ou elementos, que podem ser personalizados com CSS.
Por exemplo, você pode segmentar a seção de título de uma pesquisa usando esta classe:
Veja a lista completa das classes.
CSS Global pode ser acessado pelo editor.


Por padrão, o design do tema WalkMe substitui todas as outras alterações de design em um balão ou aplicativo.
Para que CSS seja aplicado, a regra CSS deve conter "!important" para garantir que ela substitua o estilo padrão.
Por exemplo:
#walkme-survey-balloon-37897 .walkme-survey-title {
color: #000 !important;
}
| DIV | Recursos editáveis |
| #walkme-survey-balloon-XXXXX | Os principais componentes da pesquisa, incluindo:
|
| .walkme-survey-title | Título da pesquisa, incluindo o seguinte:
|
| .walkme-survey-question-title | Pergunta(s) da pesquisa, incluindo:
|
| #walkme-survey-answer-text-XXXXXX | Respostas da pesquisa, incluindo:
|
| #walkme-survey-answer-radiobutton-XXXXX | Botões de resposta à pesquisa, incluindo:
|
| .walkme-click-and-hover.walkme-custom-balloon-close-button.walkme-action-close.walkme-inspect-ignore | Botão "Fechar" da pesquisa, incluindo:
|
| .walkme-custom-balloon-content-wrapper | Conteúdo geral da pesquisa e texto, incluindo:
|
| DIV | Recursos editáveis |
| .walkme-survey-question-nps-answers | Todas as respostas da pesquisa NPS (normalmente de 0 a 10), incluindo:
|
| .walkme-survey-nps-answer selected .walkme-survey-answer-label-nps-radiobutton | A resposta NPS selecionada, incluindo:
|
|
Rótulos de pontuação alta e baixa, incluindo:
|
| .walkme-custom-side-border | Borda lateral da pesquisa, incluindo:
|
#walkme-survey-id-XXXXXX .walkme-survey-title {
font-size: XXpx !important;
}
#walkme-survey-balloon-XXXXX .walkme-custom-side-border{
background-color: #XXXXXX !important;
}
#walkme-survey-balloon-XXXXX .walkme-custom-balloon-submit-button{
background-color: #XXXXXX !important;
}
#walkme-survey-question-nps-answers-XXXX .walkme-survey-nps-answer {
margin: XXpx !important;
}
#walkme-survey-balloon-XXXXX .walkme-custom-balloon-content {
font-family: (fonte aqui) !important;
}
.walkme-survey-question-nps-answers.selected .walkme-survey-nps-answer.selected label {
background: XXX !important;
border-color: XXX !important;
}
.walkme-survey-answer-label-nps-radiobutton.walkme-survey-answer-label-nps-radiobutton-unchecked:hover {
background: XXX !important;
border-color: XXX !important;
}
#walkme-survey-balloon-XXXXXX {
largura: 650px !important;
height: auto !important;
}
#walkme-survey-balloon-XXXXXX .walkme-custom-balloon-mid-div {
largura: 650px !important;
position: corrigido!important;
top: 50% !important;
left: 50% !important;
transform: translate(-50%,-50%) !important;
}
.walkme-survey-balloon .walkme-survey-question-mandatory {
color: #ff0000 !important;
}
Você pode alterar o texto dos botões da pesquisa na página Multilíngue no Console.
