post #2124

CSS + JS para auxiliar sites WordPress com Elementor

Publicado em: 04/11/2022 / Atualizado em: 14/11/2023

Categorias: BlogCSSElementorJavaScript (JS)JSKits e trechos de código para clientesWordpress
<style>
/* [BASICO] Código para travar a barra de rolagem horizontal, para elementos que ficam fora da tela do lado direito do navegador */
html, body {
 	overflow-x: hidden;
}
  
*:focus {
    outline: none;
}

a[href^="tel"],
a[href^="mailto"] {
    color: inherit;
  	font-family: inherit;
    text-decoration: none;
}
  
 /* HEADER STICKY */
header .elementor-sticky {
    transition: all linear 0s;
}

header .elementor-sticky--active {
    background: #fff;
	padding: 24px 20px;
    transition: all linear .2s;
	box-shadow: 0 10px 30px rgb(0,0,0,0.05);
}
  
.elementor-widget-theme-post-content a {
   color: var(--e-global-color-primary);
   font-weight: bold;
}
  
.jet-listing-grid__slider-icon.slick-arrow {
 	z-index: 2;
}
  
.elementor-widget-theme-post-content h2, .elementor-widget-theme-post-content h3, .elementor-widget-theme-post-content h4, .elementor-widget-theme-post-content h5, .elementor-widget-theme-post-content h6 {
    font-weight: bold;
    color: var(--e-global-color-secondary);
    margin: 32px auto;
}
  
.elementor-widget-theme-post-content p {
    margin-bottom: 16px;
}

.elementor-widget-theme-post-content ul {
    margin: 32px auto;
    padding-left: 20px;
}

.elementor-widget-theme-post-content h2 {
    color: var(--e-global-color-primary);
}

.elementor-widget-theme-post-content a {
    color: var(--e-global-color-accent);
}

.elementor-widget-theme-post-content img {
    margin: 16px 0 32px;
}
  
.grecaptcha-badge {
    display: none !important;
}
  
@media (max-width: 1024px) {
	h1 br, h2 br, h3 br, h4 br, h5 br, h6 br {
	    display: none;
	}
}
</style>


<script>
jQuery(document).ready(function() {
  // [BASICO] Código para impedir o scroll para o topo da pagina quando clicado em um link com # no href
  jQuery('a[href="#"]').click(function(e) {
    e.preventDefault();
  });
  
  // [BASICO] Fechar popup menu mobile ao clicar em link
  jQuery(document).on('click', '#menu-mobile a', function(event) {
    elementorProFrontend.modules.popup.closePopup({}, event);
  });
});

// [EXTRA] Código para reservar espaço de fundo para cabeçalhos fixos que usam o plugin "Sticky Header Effects for Elementor"
jQuery('header').css( { height: jQuery('header').height() +'px' } );
</script>

BONUS: Caso queira trocar o logo da pagina de login padrão do WordPress, segue script adicional: Adicionar logo personalizado na pagina de login do WordPress

Publicações recomendadas:


Link Curto para Compartilhamento

Compartilhe esse conteudo nas redes sociais ou por mensagem usando o link curto abaixo. Basta clicar em cima do link para copiar.

bruno.art.br/pb/2124

ID de Referência: 2124

Sugira uma publicação

Envie uma mensagem e sugira um publicação sobre um assunto que tenha dificuldades de resolver.

Clique aqui e entre em contato