CSS é uma linguagem de folha de estilo usada para descrever a formatação de um documento escrito em uma linguagem de marcação. Ao escrever CSS, você precisará se referir aos diferentes componentes ou elementos do seu conteúdo do WalkMe.
Cada item do WalkMe inclui vários componentes (elementos) que podem ser personalizados com CSS.
Por exemplo, você pode segmentar a seção de título de um balão usando esta classe:
.walkme-custom-balloon-title
Boas práticas
Ao inserir CSS personalizado, o WalkMe exibe opções de preenchimento automático para seletores, propriedades e valores
CSS pode ser aplicado globalmente ou localmente. Usar o console CSS local facilita a personalização de um item individual do WalkMe. Se você estiver personalizando no nível global, será necessário inserir o ID do item WalkMe.
Exemplo em nível local: .walkme-custom-balloon-title
Exemplo em nível global: #walkme-balloon-XXXXXXX.walkme-custom-balloon-title
Em caso de erro, uma mensagem de validação será exibida depois de clicar em Salvar.
Mensagens de erro também estão disponíveis para HTML mediante solicitação. Entre em contato com seu Gerente de Sucesso do Cliente ou com o contato do WalkMe para ativar isso.
Editar CSS global
Clique em Editar CSS global no menu de configurações do WalkMe Editor
Insira o CSS personalizado no editor de CSS
Clique em Salvar
Clique em Publicar configurações
Localizar e substituir atalhos
Você pode usar os seguintes atalhos de teclado (Windows / Mac) para localizar e substituir no console CSS:
Localizar: Ctrl-F / Cmd-F (pressione Enter para localizar próximo, Shift-Enter para localizar anterior)
Substituir: Ctrl-R / Cmd-R
Ir para a linha: Ctrl-J / Cmd-J
Assista a uma demonstração rápida abaixo:
Encontrar ID do WalkMe
Passe o mouse sobre o item no editor
Clique no menu Opções
Clique em Copiar ID
Usando !Important
Por padrão, o design do tema WalkMe substitui todas as outras alterações de design.
Para que CSS seja aplicado, a regra CSS deve conter "!important" para garantir que ela substitua o estilo padrão.
Adicionar CSS ao conteúdo do WalkMe também pode afetar o CSS no site onde o conteúdo está sendo exibido
Se o recuo e os espaços em branco adequados não forem adicionados ao CSS global, ele não será publicado nem visível no modo de Reprodução, mas permanecerá visível no modo de Visualização.
A prática recomendada é formatar o código em um Ambiente de Desenvolvimento Integrado (IDE), como Visual Studio Code ou Sublime, e testá-lo primeiro no Rastreador de Fluxo
Para que as alterações CSS entrem em vigor, é necessário executar uma Publicação de Configurações
