Skip to main content
Exibe um banner ao lado de uma seleção de produtos por slug. Útil para seções editoriais como “Destaques da semana” com imagem e produtos curados.

Uso

<section-grid-collection
  section="colecao-destaque"
  title-text="Destaques da semana"
  subtitle-text="Seleção especial para você"
  text-position="left"
  :resource-banner-ids="{{ section.bannerIds | json_encode }}"
  :resource-products-slugs="{{ section.productSlugs | json_encode }}"
>
  <template v-slot="{ product }">
    <product-card :product="product" />
  </template>
</section-grid-collection>

Propriedades

PropriedadeTipoObrigatóriaDescrição
sectionStringIdentificador da seção para cache e rastreamento.
titleTextStringTítulo principal exibido acima da grade.
subtitleTextStringSubtítulo ou descrição exibida abaixo do título.
textPositionStringPosição do bloco de texto em relação ao banner. Valores: 'left' ou 'right'.
resourceBannerIdsArrayLista de IDs dos banners a carregar.
resourceProductsSlugsArrayLista de slugs dos produtos a exibir na grade.

Slots

SlotEscopoDescrição
default{ product }Renderiza cada produto da grade. Permite usar um card customizado.