---
url: 'https://dxpr.com/pt-pt/hc/documentation/learn-dxpr-builder/layout/carousel-layout'
title: 'Adicionar um esquema de carrossel | DXPR'
author:
  name: Jurriaan
  url: 'https://dxpr.com/users/jurriaan'
date: '2026-10-24T09:01:08+00:00'
updated: '2026-10-24T09:09:48+00:00'
copyright: 'Copyright DXPR. All rights reserved.'
type: article
summary: 'Use o elemento de esquema Carousel quando quiser que os conteúdos se revezem num só lugar, como citações, ofertas ou anúncios. Fica com diapositivos que avançam sozinhos, com um ponto por diapositivo. Ao contrário de Image carousel, cada diapositivo leva quaisquer elementos: texto, imagens, botões e mais. O exemplo constrói um carrossel de citações de estudantes.'
tags:
  - Lay-out
image: 'https://dxpr.com/themes/custom/dxpr_com/images/dxpr-share-card.jpg'
published: true
og:
  site_name: DXPR
  updated_time: '2026-10-24T09:09:48+0000'
  'image:alt': 'DXPR, powered by Drupal: AI-powered Drupal for marketers.'
schema:
  '@context': 'https://schema.org'
  '@graph':
    -
      mainEntity: {  }
    -
      '@type': TechArticle
      headline: 'Adicionar um esquema de carrossel'
      description: 'Use o elemento de esquema Carousel quando quiser que os conteúdos se revezem num só lugar, como citações, ofertas ou anúncios. Fica com diapositivos que avançam sozinhos, com um ponto por diapositivo. Ao contrário de Image carousel, cada diapositivo leva quaisquer elementos: texto, imagens, botões e mais. O exemplo constrói um carrossel de citações de estudantes.'
      image:
        '@type': ImageObject
        url: 'https://dxpr.com/themes/custom/dxpr_com/images/dxpr-share-card.jpg'
        width: '1200'
        height: '630'
      datePublished: '2026-10-24T09:01:08+0000'
      dateModified: '2026-10-24T09:09:48+0000'
      author:
        '@type': Organization
        '@id': 'https://dxpr.com/#organization'
        name: DXPR
        url: 'https://dxpr.com/'
        logo:
          '@type': ImageObject
          url: 'https://dxpr.com/themes/custom/dxpr_com/dxpr-logo-dark.svg'
          width: '1348'
          height: '501'
      publisher:
        '@type': Organization
        '@id': 'https://dxpr.com/#organization'
        name: DXPR
        url: 'https://dxpr.com/'
        logo:
          '@type': ImageObject
          url: 'https://dxpr.com/themes/custom/dxpr_com/dxpr-logo-dark.svg'
          width: '1348'
          height: '501'
      mainEntityOfPage: 'https://dxpr.com/pt-pt/hc/documentation/learn-dxpr-builder/layout/carousel-layout'
      articleSection: Lay-out
    -
      '@type': WebPage
      '@id': 'https://dxpr.com/pt-pt/hc/documentation/learn-dxpr-builder/layout/carousel-layout'
      description: 'Use o elemento de esquema Carousel quando quiser que os conteúdos se revezem num só lugar, como citações, ofertas ou anúncios. Fica com diapositivos que avançam sozinhos, com um ponto por diapositivo. Ao contrário de Image carousel, cada diapositivo leva quaisquer elementos: texto, imagens, botões e mais. O exemplo constrói um carrossel de citações de estudantes.'
      breadcrumb:
        '@type': BreadcrumbList
        itemListElement:
          -
            '@type': ListItem
            position: 1
            name: Início
            item: 'https://dxpr.com/pt-pt'
      publisher:
        '@type': Organization
        '@id': 'https://dxpr.com/#organization'
        name: DXPR
      inLanguage: pt-pt
---
[Help Center](/pt-pt/node/75)/[Documentation](/pt-pt/hc/documentation) /[Learn DXPR Builder](/hc/documentation/learn-dxpr-builder) /[Build pages](/hc/documentation/learn-dxpr-builder/build) /[Add content](/hc/documentation/learn-dxpr-builder/elements) /[Lay-out](/hc/documentation/learn-dxpr-builder/layout/overview) # Adicionar um esquema de carrossel.

 Learn DXPR BuilderBuild pagesAdd contentLay-out

   ## In this guide

 Related guides

- [Image Carousel](/hc/documentation/learn-dxpr-builder/elements/image-carousel)
- [Adicionar um painel de separadores](/pt-pt/hc/documentation/learn-dxpr-builder/layout/tabs-element)
- [Animation tab](/hc/documentation/learn-dxpr-builder/design/animation-tab)

Use o elemento de esquema Carousel quando quiser que os conteúdos se revezem num só lugar, como citações, ofertas ou anúncios. Fica com diapositivos que avançam sozinhos, com um ponto por diapositivo. Ao contrário de [Image carousel](/hc/documentation/learn-dxpr-builder/elements/image-carousel), cada diapositivo leva quaisquer elementos: texto, imagens, botões e mais. O exemplo constrói um carrossel de citações de estudantes.

## Adicionar um esquema de carrossel

1. Paire o cursor sobre a coluna e clique em **+** na sua barra de controlos para abrir o seletor de elementos.
2. No separador **Layout**, clique em **Carousel**.
3. As suas definições abrem-se primeiro. Clique em **Save** para manter as predefinições. O carrossel aparece com um diapositivo vazio.
4. Clique em **+** dentro do diapositivo e adicione conteúdo, como um elemento **Text**.
5. Para adicionar um diapositivo, paire o cursor sobre o carrossel e clique em **Add slide** na sua barra de controlos. Clique no ponto do diapositivo por baixo do carrossel para o abrir e preencha-o da mesma forma.

  ## O que vê

O primeiro diapositivo aparece com uma barra por diapositivo por baixo. De 5 em 5 segundos entra o diapositivo seguinte e, depois do último, volta o primeiro. Os visitantes podem clicar numa barra para saltar para um diapositivo ou deslizar o dedo num ecrã tátil. Cada diapositivo assume a altura do mais alto, para o conteúdo por baixo do carrossel não saltar.

## Configure o seu carrossel

Abra as definições em **More** > **Settings** na barra de controlos do **Carousel**. O painel **General** tem a temporização.

| Definição | O que faz | Predefinição |
|---|---|---|
| **Frames per slide** | Quantos diapositivos aparecem lado a lado, de 1 a 10. Os ecrãs estreitos mostram menos, até um nos telemóveis | 1 |
| **Disable auto-play** | Impede os diapositivos de avançarem sozinhos | Off |
| **Auto-play interval** | Tempo entre diapositivos, de 1000 a 20000 milissegundos | 5000 |
| **Stop on hover** | Pausa a reprodução automática enquanto o ponteiro está sobre o carrossel | Off |
| **Dots navigation** | No painel **Dots**: mostra um ponto por diapositivo | On |
| **Next/Previous** | No painel **Next/Previous**: mostra botões de setas | Off |

### Pontos e setas

Com **Dots navigation** ligado, o painel **Dots** também oferece:

- **Dots orientation**: **Outside slider** (por baixo) ou **Inside slider**
- **Dot shape**: **Bar**, **Circle**, **Square** ou **Triangle**
- **Active dot transformation**: **None**, **Grow taller**, **Grow wider** ou **Scale up**
- **Dot color** e **Active dot color**

Com **Next/Previous** ligado, o painel **Next/Previous** também oferece:

- **Orientation**: **Outside slider** ou **Inside slider**
- **Dot shape**: o botão por trás de cada seta, **No background**, **Circle**, **Square** ou **Bar**
- **Icon color**, **Icon hover color**, **Background color** e **Background hover color**
- **Outside navigation position**: **Adjacent**, **Top center**, **Top left**, **Top right**, **Bottom center**, **Bottom left** ou **Bottom right**

## Ideias para diapositivos

- **Testimonial slider**: ponha um **Block quote** com a citação e um elemento **Text** com o nome em cada diapositivo. Mantenha **Dots navigation** ligado e **Next/Previous** desligado e defina **Auto-play interval** como 7000 para os visitantes acabarem de ler.
- **Hero carousel**: abra **More** > **Settings** de um diapositivo e escolha uma foto como **Background image** no seu painel **Style**. Adicione um elemento **Text** com o cabeçalho e um **Button**. Ligue **Stop on hover** para os visitantes lerem e clicarem.

## Se não o vir

- **Não há pontos por baixo do carrossel.** Os pontos só aparecem quando o carrossel tem dois diapositivos e só com **Dots navigation** ligado. Clique em **Add slide** ou ligue **Dots navigation** no painel **Dots**.
- **O diapositivo novo não aparece depois de Add slide.** Os diapositivos novos ficam no fim e escondidos até os abrir. Clique no último ponto por baixo do carrossel.
- **Os diapositivos não se movem sozinhos.** **Disable auto-play** está ligado. Desligue-o no painel **General** das definições do carrossel.
- **Não há setas.** **Next/Previous** vem desligado por predefinição. Ligue-o no painel **Next/Previous**.
- **Falta Carousel no separador Layout do seletor.** O seu perfil de utilizador do DXPR Builder exclui-o. Um administrador marca **Carousel** em **Elements** no seu perfil em `/admin/dxpr_studio/dxpr_builder/profile`.

## E a seguir?

- [Adicionar um carrossel de imagens](/hc/documentation/learn-dxpr-builder/elements/image-carousel): uma apresentação só de imagens, configurada numa caixa de diálogo.
- [Adicionar um painel de separadores](/pt-pt/hc/documentation/learn-dxpr-builder/layout/tabs-element): deixe os visitantes escolherem o conteúdo em vez de esperarem por ele.
- [Separador de animação](/hc/documentation/learn-dxpr-builder/design/animation-tab): adicione efeitos de entrada ao conteúdo de cada diapositivo.