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
sectionString✅Identificador da seção para cache e rastreamento.
titleTextString✅Título principal exibido acima da grade.
subtitleTextString✅Subtítulo ou descrição exibida abaixo do título.
textPositionString✅Posição do bloco de texto em relação ao banner. Valores: 'left' ou 'right'.
resourceBannerIdsArray✅Lista de IDs dos banners a carregar.
resourceProductsSlugsArray✅Lista de slugs dos produtos a exibir na grade.

​
Slots

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