Alterar Cor dos Botões da Página do Evento – Central de Ajuda

Deseja mudar a cor dos botões da página de evento? Neste artigo, vou te ensinar como fazer isso.

Acesse o menu Página do Evento

1. No menu Página do evento.

2. Clique em </>Avançado.

Pronto! Você irá visualizar a tela abaixo, onde poderá colocar os códigos CSS para personalização da página:

Agora, vamos aprender alguns códigos que você pode utilizar! Mas antes, algumas observações importantes:

Sempre adicione os códigos dentro das tags <style> e </style>. Você poderá adicionar quantos códigos quiser (um abaixo do outro), mas eles precisaram estar entre essas tags, como no exemplo abaixo:
Ao utilizar os códigos, você irá precisar substituir algumas informações (geralmente referente a cor ou fonte).

Dica Even3: Utilize o site Celke para encontrar o código das cores.

Botão de Login

.btn-entrar{

background-color: #COR !important;

color: white !important;

}

Resultado:

Botão de Falar com organizador

.btn-round2{

background-color: #COR !important;

color: #FFF !important;

}

Resultado:

Botões de inscrição

.btn-go-to-inscricoes{

background-color: #COR !important;

border: 2px solid #fff !important;

color: white !important;

}

#btn-registration-floating{

border: 2px solid #fff !important;

}

#btn-registration{

border: 2px solid #fff !important;

}

Resultado:

Botões de Atividade e Submissão

.bt-free-trial-hero{

background-color: #COR !important;

border: 2px solid #fff !important;

color: white !important;

}

.text-center > .bt-free-trial-hero{

border: 2px solid #fff !important;

}

Resultado:

Botões com o mouse em cima

Este código irá alterar a cor do botão e da borda do botão sempre que você passar o mouse em cima do botão (válido apenas para os botões de Inscrição, Atividade e Submissão).

.text-center > .bt-free-trial-hero:hover{

background-color: #COR_BOTÃO !important;

border: 2px solid #COR_ BORDA !important;

color: white !important;

}

Resultado:

Eventos com o novo layout

Cor do botão de realizar login

.btn-realizar-login-site-basico {
background-color: #COR !important;
}

Cor do botão de realizar inscrição

.btn-realizar-inscricao-site-basico {
background-color: #COR !important;
}

Cor do botão "Menu"

#dropdownMenu2 {
background-color: #COR !important;
}

Resultado:

Prontinho! Você aprendeu a como alterar a Cor dos Botões da Página do Evento.

E agora? Veja outras configurações avançadas da página do evento

Acesse o menu Página do Evento

Eventos com o novo layout

Artigos relacionados