Vitrine 03
Ferramentas, integrações, parceiros, certificações ou logotipos de clientes em grade.
Nesta página
Visão geral
Vitrine de ferramentas/integrações em grade de cartões com botão final.
| Propriedade | Valor |
|---|---|
| Nome no editor | Vitrine 03 |
| Onde encontrar | Painel de widgets do Elementor, categoria Converto |
| Identificador no Elementor | lgr-showcase-03 |
| Identificador no Markdown | showcase-03 |
| Papel na página | Prova e portfólio |
| Campos de conteúdo | 5 |
| Opções de estilo | 23 (10 responsivas) |
Quando usar
Situações em que este widget é indicado:
- A página precisa apresentar um conjunto de ferramentas, integrações ou parceiros em cartões de grade.
- Existe uma lista de itens com imagem/logo, título e descrição curta.
Como adicionar
- Abra a página no editor do Elementor.
- No painel de widgets, abra a categoria Converto e arraste Vitrine 03 para a página (ou clique em + em uma área vazia).
- Preencha a aba Conteúdo e ajuste a aba Estilo.
O widget também pode vir pronto em um modelo de página ou ser inserido pelo Converto Construtor.
Opções da aba Conteúdo
Conteúdo
| Opção | Tipo | Detalhes |
|---|---|---|
| Título | Texto | Padrão: Ferramentas Essenciais |
| Descrição | Área de texto | Padrão: Integre-se com as melhores ferramentas e impulsione seus resultados. |
| Lista de Cartões | Lista | |
| ↳ Imagem | Imagem ou arquivo | |
| ↳ Título | Texto | Padrão: Zapier |
| ↳ Texto | Texto | Padrão: Automação |
| ↳ Link do Item | Link | |
| Texto do Botão | Texto | Padrão: Ver todas integrações |
| Link do Botão | Link |
Opções da aba Estilo
A aba Estilo reúne 23 opções em 7 seções (a última é Animações, comum a todos os widgets Converto).
| Seção | O que ajusta |
|---|---|
| Textos | Título, Título / Altura da Linha, Descrição, Descrição / Altura da Linha, Título do Cartão, Texto do Cartão, Texto do Cartão / Altura da Linha, Botão |
| Cores | Cor do Título Principal, Cor da Descrição, Cor da Borda do Cartão, Cor do Título do Cartão, Cor da Descrição do Cartão, Cor do Texto do Botão, Cor de Fundo do Botão |
| Plano de Fundo | Plano de Fundo |
| Sobreposição de Fundo | Sobreposição de Fundo, Opacidade |
| Espaçamentos | Espaço superior, Espaço inferior, Anular espaço de cima, Anular espaço de baixo |
| Arredondamento | Raio da Borda do Cartão |
| Animações | Entrada de textos e de imagens e ícones: tipo, velocidade, atraso e intervalo (veja Animações de entrada) |
Comportamento responsivo
10 opções deste widget são responsivas: o Elementor permite definir valores diferentes para desktop, tablet e celular (ícones de dispositivo ao lado do campo). Para ajustes finos por largura de tela, use a sintaxe curta de media queries no campo CSS da aba Avançado.
Campos no Converto Construtor (Markdown)
Use o identificador showcase-03 na linha <!-- converto:showcase-03 -->. Campos de conteúdo (bloco :::content):
| Campo | Tipo | Obrigatório | Detalhes |
|---|---|---|---|
title | Texto | Sim | Título principal da seção. |
description | Texto | Não | |
tools_list | Lista | Não | Lista de cartões de ferramentas/integrações exibida em grade. |
↳ tool_image | Imagem ou arquivo | Não | |
↳ tool_title | Texto | Não | |
↳ tool_description | Texto | Não | |
↳ tool_link | Link | Não | |
button_text | Texto | Não | Texto do botão final. O botão só é exibido quando este campo é preenchido. |
button_link | Link | Não |
Os controles da aba Estilo também podem ser usados no bloco :::style, pelos identificadores do próprio widget (campo omitido mantém o padrão). Veja a linguagem Markdown Converto.
Exemplo
<!-- converto:showcase-03 -->
:::content
title: Ferramentas Essenciais
description: Integre-se com as melhores ferramentas e impulsione seus resultados.
tools_list:
- tool_image: https://exemplo.com/imagem.jpg
tool_title: Zapier
tool_description: Automação
tool_link: https://exemplo.com/oferta
- tool_image: https://exemplo.com/imagem.jpg
tool_title: Zapier
tool_description: Automação
tool_link: https://exemplo.com/oferta
button_text: Ver todas integrações
button_link: https://exemplo.com/oferta
:::Recursos comuns a todos os widgets
- Textos aceitam variáveis de página (
{{rotulo}}) e marcação de texto. - Aba Avançado: campos CSS e JS por elemento (CSS e JS personalizado).
- Seção Animações na aba Estilo (Animações de entrada).