SectionTextButton2Banners - Yampi Developer Portal

O componente SectionTextButton2Banners combina um bloco de texto (título + descrição + botão CTA) com um ou dois banners de imagem. A posição do texto em relação aos banners e o alinhamento interno são configuráveis.

Uso

<section-text-button2-banners
  :number-banner="2"
  :resource-ids="{{ section.bannerIds | json_encode }}"
  text-align="left"
  title-text="Novidades da temporada"
  description-text="Confira as últimas coleções com até 30% de desconto."
  text-position="left"
  button-style="primary"
  :button-switch="true"
  text-in-button="Ver coleção"
  link-in-button="/colecao/novidades"
/>

Propriedades

Propriedade	Tipo	Obrigatória	Descrição
`numberBanner`	`Number`	✅	Quantidade de banners exibidos na seção. Valores: `1` ou `2`.
`resourceIds`	`Array`	✅	Lista de IDs dos banners a serem carregados via API.
`textAlign`	`String`	✅	Alinhamento do bloco de texto. Valores: `'left'`, `'center'` ou `'right'`.
`titleText`	`String`	✅	Texto do título principal da seção.
`descriptionText`	`String`	✅	Texto de descrição exibido abaixo do título.
`textPosition`	`String`	✅	Posição do bloco de texto em relação aos banners. Valores: `'left'` ou `'right'`.
`buttonStyle`	`String`	✅	Estilo visual do botão. Valores: `'primary'` ou `'secondary'`.
`buttonSwitch`	`Boolean`	✅	Quando `true`, exibe o botão de CTA. Quando `false`, oculta.
`textInButton`	`String`	✅	Texto exibido dentro do botão.
`linkInButton`	`String`	✅	URL de destino ao clicar no botão.

Mixins utilizados

Mixin	Finalidade
`mobileMixin`	Reorganiza o layout do bloco de texto e banners em dispositivos móveis.

⌘I