post
Slide (Listing Grid) com largura total com JetEngine
Publicado em: 12/04/2023 / Atualizado em: 17/09/2024
Caso queira usar o modo slide do widget Listing Grid do JetEngine e deixar ele com largura total da tela mas destacando apenas os itens que estão no centro do container, como na imagem abaixo, siga esses passos.
Criando um listing grid com jetengine
Primeiro você deve ter algo para listar e exibir, então deve criar um CPT, cadastrar os itens, e depois criar um template personalizado em “JetEngine > Listings”.
Adicionando o widget Listing Grid na pagina
Crie uma pagina em branco ou abra a pagina que deseja colocar o slide com o Elementor.
Depois disso, arraste o plugin “listing grid” para sua pagina.
Selecione a lista criada no plugin, em seguida, adicione o código CSS abaixo no campo “CSS personalizado”:
selector .jet-listing-grid .slick-list {
overflow: inherit;
}
selector .jet-listing-grid .slick-list .slick-slide {
opacity: 0.2;
-webkit-transition: all .3s;
-o-transition: all .3s;
transition: all .3s;
}
selector .jet-listing-grid .slick-list .slick-active {
opacity: 1;
-webkit-transition: all .3s;
-o-transition: all .3s;
transition: all .3s;
}Publicações recomendadas:
Inscreva-se em Nossa News:
Seja notificando sempre que tiver conteúdo novo disponível no meu canal do Youtube ou artigo no meu Blog.
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/2713
ID de Referência: 2713
Sugira uma publicação
Envie uma mensagem e sugira um publicação sobre um assunto que tenha dificuldades de resolver.