---
url: 'https://dxpr.com/it/hc/documentation/learn-dxpr-builder/layout/carousel-layout'
title: 'Aggiunta di un layout carosello | DXPR'
author:
  name: Jurriaan
  url: 'https://dxpr.com/users/jurriaan'
date: '2026-10-23T23:55:52+00:00'
updated: '2026-10-24T09:09:48+00:00'
copyright: 'Copyright DXPR. All rights reserved.'
type: article
summary: 'Usa l’elemento di layout Carosello quando vuoi che i contenuti si alternino nello stesso punto, come citazioni, offerte o annunci. Ottieni slide che avanzano da sole, con un punto per ogni slide. A differenza del carosello di immagini, ogni slide contiene qualsiasi elemento: testo, immagini, pulsanti e altro. L’esempio costruisce uno slider di citazioni di studenti.'
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: 'Aggiunta di un layout carosello'
      description: 'Usa l’elemento di layout Carosello quando vuoi che i contenuti si alternino nello stesso punto, come citazioni, offerte o annunci. Ottieni slide che avanzano da sole, con un punto per ogni slide. A differenza del carosello di immagini, ogni slide contiene qualsiasi elemento: testo, immagini, pulsanti e altro. L’esempio costruisce uno slider di citazioni di studenti.'
      image:
        '@type': ImageObject
        url: 'https://dxpr.com/themes/custom/dxpr_com/images/dxpr-share-card.jpg'
        width: '1200'
        height: '630'
      datePublished: '2026-10-23T23:55:52+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/it/hc/documentation/learn-dxpr-builder/layout/carousel-layout'
      articleSection: Lay-out
    -
      '@type': WebPage
      '@id': 'https://dxpr.com/it/hc/documentation/learn-dxpr-builder/layout/carousel-layout'
      description: 'Usa l’elemento di layout Carosello quando vuoi che i contenuti si alternino nello stesso punto, come citazioni, offerte o annunci. Ottieni slide che avanzano da sole, con un punto per ogni slide. A differenza del carosello di immagini, ogni slide contiene qualsiasi elemento: testo, immagini, pulsanti e altro. L’esempio costruisce uno slider di citazioni di studenti.'
      breadcrumb:
        '@type': BreadcrumbList
        itemListElement:
          -
            '@type': ListItem
            position: 1
            name: Home
            item: 'https://dxpr.com/it'
      publisher:
        '@type': Organization
        '@id': 'https://dxpr.com/#organization'
        name: DXPR
      inLanguage: it
---
[Help Center](/it/hc)/[Documentation](/it/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) # Aggiunta di un layout carosello.

 Learn DXPR BuilderBuild pagesAdd contentLay-out

   ## In this guide

 Related guides

- [Image Carousel](/hc/documentation/learn-dxpr-builder/elements/image-carousel)
- [Aggiunta di un pannello a schede](/it/hc/documentation/learn-dxpr-builder/layout/tabs-element)
- [Anima gli elementi allo scorrimento, al passaggio del mouse o al clic](/it/hc/documentation/learn-dxpr-builder/design/animation-tab)

Usa l’elemento di layout Carosello quando vuoi che i contenuti si alternino nello stesso punto, come citazioni, offerte o annunci. Ottieni slide che avanzano da sole, con un punto per ogni slide. A differenza del [carosello di immagini](/hc/documentation/learn-dxpr-builder/elements/image-carousel), ogni slide contiene qualsiasi elemento: testo, immagini, pulsanti e altro. L’esempio costruisce uno slider di citazioni di studenti.

## Aggiungi un layout carosello

1. Passa sopra alla colonna e fai clic su **+** nella sua barra dei controlli per aprire il selettore di elementi.
2. Nella scheda **Layout** fai clic su **Carousel**.
3. Si aprono prima le sue impostazioni. Fai clic su **Save** per tenere i valori predefiniti. Il carosello compare con una slide vuota.
4. Fai clic su **+** dentro la slide e aggiungi contenuti, per esempio un elemento **Text**.
5. Per aggiungere una slide, passa sopra al carosello e fai clic su **Add slide** nella sua barra dei controlli. Fai clic sul punto della slide sotto il carosello per aprirla, poi riempila allo stesso modo.

  ## Cosa vedi

Compare la prima slide con una barra per ogni slide sotto di essa. Ogni 5 secondi entra la slide successiva e dopo l’ultima torna la prima. I visitatori possono fare clic su una barra per saltare a una slide o scorrere su touch screen. Ogni slide prende l’altezza della più alta, così il contenuto sotto il carosello non salta.

## Configura il tuo carosello

Apri le impostazioni da **More** > **Settings** nella barra dei controlli del **Carousel**. Il pannello **General** contiene i tempi.

| Impostazione | Cosa fa | Valore predefinito |
|---|---|---|
| **Frames per slide** | Quante slide mostrare fianco a fianco, da 1 a 10. Gli schermi stretti ne mostrano meno, fino a una sui telefoni | 1 |
| **Disable auto-play** | Impedisce alle slide di avanzare da sole | Off |
| **Auto-play interval** | Tempo tra le slide, da 1000 a 20000 millisecondi | 5000 |
| **Stop on hover** | Mette in pausa l’avanzamento automatico mentre il puntatore è sopra il carosello | Off |
| **Dots navigation** | Nel pannello **Dots**: mostra un punto per ogni slide | On |
| **Next/Previous** | Nel pannello **Next/Previous**: mostra i pulsanti freccia | Off |

### Punti e frecce

Con **Dots navigation** attivo, il pannello **Dots** offre anche:

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

Con **Next/Previous** attivo, il pannello **Next/Previous** offre anche:

- **Orientation**: **Outside slider** o **Inside slider**
- **Dot shape**: il pulsante dietro ogni freccia, **No background**, **Circle**, **Square** o **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** o **Bottom right**

## Idee per le slide

- **Slider di testimonianze**: metti in ogni slide un **Block quote** con la citazione e un elemento **Text** con il nome. Tieni **Dots navigation** attivo e **Next/Previous** spento, e imposta **Auto-play interval** su 7000 così i visitatori finiscono di leggere.
- **Carosello hero**: apri **More** > **Settings** di una slide e scegli una foto come **Background image** nel suo pannello **Style**. Aggiungi un elemento **Text** con il titolo e un **Button**. Attiva **Stop on hover** così i visitatori possono leggere e fare clic.

## Se non lo vedi

- **Non ci sono punti sotto il carosello.** I punti compaiono solo quando il carosello ha due slide e solo con **Dots navigation** attivo. Fai clic su **Add slide**, oppure attiva **Dots navigation** nel pannello **Dots**.
- **La nuova slide non compare dopo Add slide.** Le nuove slide si aggiungono alla fine e restano nascoste finché non le apri. Fai clic sull’ultimo punto sotto il carosello.
- **Le slide non si muovono da sole.** **Disable auto-play** è attivo. Disattivalo nel pannello **General** delle impostazioni del carosello.
- **Non ci sono frecce.** **Next/Previous** è spento per impostazione predefinita. Attivalo nel pannello **Next/Previous**.
- **Carousel manca dalla scheda Layout del selettore.** Il tuo profilo utente DXPR Builder lo esclude. Un amministratore seleziona **Carousel** in **Elements** nel tuo profilo in `/admin/dxpr_studio/dxpr_builder/profile`.

## E adesso?

- [Carosello di immagini](/hc/documentation/learn-dxpr-builder/elements/image-carousel): una presentazione di sole immagini, configurata in un’unica finestra.
- [Aggiungere un pannello a schede](/it/hc/documentation/learn-dxpr-builder/layout/tabs-element): lascia che siano i visitatori a scegliere il contenuto invece di aspettarlo.
- [Scheda di animazione](/it/hc/documentation/learn-dxpr-builder/design/animation-tab): aggiungi effetti di entrata al contenuto di ogni slide.