---
url: 'https://dxpr.com/it/hc/documentazione/impara-dxpr-builder/tutorial/pagina-chi-siamo'
title: 'Crea una pagina Chi siamo | DXPR'
author:
  name: Jurriaan
  url: 'https://dxpr.com/users/jurriaan'
date: '2026-10-23T23:56:42+00:00'
updated: '2026-10-24T19:36:26+00:00'
copyright: 'Copyright DXPR. All rights reserved.'
type: article
summary: |-
  Qui crei una pagina Chi siamo: un header di missione, la tua storia accanto a una foto, tre numeri che contano in avanti, card del team e un invito all’azione finale. Usala quando un’unica pagina deve dire ai visitatori chi sei. Per una pagina che elenca ogni collega, segui invece Crea un elenco del team.
  Il video crea la pagina per uno studio di design a Rotterdam.
tags:
  - 'Follow a tutorial'
image: 'https://dxpr.com/themes/custom/dxpr_com/images/dxpr-share-card.jpg'
published: true
og:
  site_name: DXPR
  updated_time: '2026-10-24T19:36:26+0000'
  'image:alt': 'DXPR, powered by Drupal: AI-powered Drupal for marketers.'
schema:
  '@context': 'https://schema.org'
  '@graph':
    -
      mainEntity: {  }
    -
      '@type': TechArticle
      headline: 'Crea una pagina Chi siamo'
      description: |-
        Qui crei una pagina Chi siamo: un header di missione, la tua storia accanto a una foto, tre numeri che contano in avanti, card del team e un invito all’azione finale. Usala quando un’unica pagina deve dire ai visitatori chi sei. Per una pagina che elenca ogni collega, segui invece Crea un elenco del team.
        Il video crea la pagina per uno studio di design a Rotterdam.
      image:
        '@type': ImageObject
        url: 'https://dxpr.com/themes/custom/dxpr_com/images/dxpr-share-card.jpg'
        width: '1200'
        height: '630'
      datePublished: '2026-10-23T23:56:42+0000'
      dateModified: '2026-10-24T19:36:26+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/documentazione/impara-dxpr-builder/tutorial/pagina-chi-siamo'
      articleSection: 'Segui un tutorial'
    -
      '@type': WebPage
      '@id': 'https://dxpr.com/it/hc/documentazione/impara-dxpr-builder/tutorial/pagina-chi-siamo'
      description: |-
        Qui crei una pagina Chi siamo: un header di missione, la tua storia accanto a una foto, tre numeri che contano in avanti, card del team e un invito all’azione finale. Usala quando un’unica pagina deve dire ai visitatori chi sei. Per una pagina che elenca ogni collega, segui invece Crea un elenco del team.
        Il video crea la pagina per uno studio di design a Rotterdam.
      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
---
[Centro assistenza](/it/hc)/[Documentazione](/it/hc/documentazione) /[Impara DXPR Builder](/it/hc/documentation/learn-dxpr-builder) /[Crea le pagine](/it/hc/documentation/learn-dxpr-builder/build) /[Segui un tutorial](/it/hc/documentation/learn-dxpr-builder/tutorials/overview) # Crea una pagina Chi siamo.

 Impara DXPR BuilderCrea le pagineSegui un tutorial

   ## In questa guida

 Guide correlate

- [Crea un elenco del team](/it/hc/documentazione/impara-dxpr-builder/tutorial/elenco-del-team)
- [Aggiungere una Card](/it/hc/documentazione/impara-dxpr-builder/elementi/card)

Qui crei una pagina Chi siamo: un header di missione, la tua storia accanto a una foto, tre numeri che contano in avanti, card del team e un invito all’azione finale. Usala quando un’unica pagina deve dire ai visitatori chi sei. Per una pagina che elenca ogni collega, segui invece [Crea un elenco del team](/it/hc/documentazione/impara-dxpr-builder/tutorial/elenco-del-team).

Il video crea la pagina per uno studio di design a Rotterdam.

  ## Prima di iniziare

- Il tuo ruolo ha il permesso **Edit with DXPR Builder**.
- La libreria multimediale contiene una foto del tuo ufficio, team o prodotto.
- La pagina esiste: vai in **Content** > **Add content** > **Landing Page** (`/node/add/landing_page`), digita "About Us" come **Title** e fai clic su **Save**. La pagina si apre con sopra il builder.
- Su DXPR CMS, nascondi il titolo pagina del tema in questa pagina: nel suo form di modifica, apri **DXPR Theme Settings** e seleziona **Page Title** in **DXPR Hide Regions**. Il **Title** del Jumbotron è allora l’unico Heading 1 della pagina, come spiega [Crea pagine SEO-friendly](/it/hc/documentazione/impara-dxpr-builder/tutorial/seo#step-1-start-the-content-at-heading-2).
- I nuovi elementi arrivano in cima alla loro sezione o colonna. Aggiungi le righe di una sezione, o gli elementi di una colonna, in ordine inverso, oppure trascinali al loro posto dopo.

## Passaggio 1: aggiungi un header di missione

1. Fai clic su **Add Elements** sulla pagina vuota e scegli **Section** dalla scheda **Layout**.
2. Passa sopra alla sezione e apri **More** > **Settings**. Apri il pannello **Style**, scegli un campione **Background** scuro e fai clic su **Save**.
3. Fai clic su **+** sulla sezione e scegli **Jumbotron** dalla scheda **Content**.
4. Digita la tua missione come **Title**: "We build websites people enjoy using".
5. Digita una frase di supporto nel campo **Lead**: "A 24-person studio in Rotterdam working with brands across Europe since 2012."
6. Imposta **Type** su **Primary** per testo bianco sul tuo colore primario, poi fai clic su **Save**.

## Passaggio 2: racconta la storia dell’azienda

1. Passa sopra alla sezione e fai clic su **Add Section Below**, il **+** sotto di essa.
2. Fai clic su **+** sulla nuova sezione e scegli **Row**; arriva con due colonne uguali. Fai clic sull’icona griglia (**Column layout**) sulla riga, scegli il preset **2/3 + 1/3** e fai clic su **Save**.
3. Fai clic su **+** nella colonna più larga e scegli **Text**. Digita "Our story" come **Heading 2**, poi due brevi paragrafi: come hai iniziato e come si svolge un progetto. Fai clic su **Save**.
4. Fai clic su **+** nella colonna più stretta e scegli **Image**.
5. Fai clic su **Select Image**, cerca nella libreria multimediale con **Apply filters**, seleziona una foto del tuo ufficio o team e fai clic su **Insert selected**.
6. Apri il pannello **SEO**, compila l’**Alt attribute** e fai clic su **Save**.

**Suggerimento**

Tieni breve la storia e dividila con un sottotitolo. I visitatori scansionano prima di leggere.

## Passaggio 3: aggiungi numeri chiave con contatori

1. Aggiungi una terza sezione con **Add Section Below**. Apri il suo **More** > **Settings**, scegli un **Background** grigio chiaro nel pannello **Style** e fai clic su **Save**.
2. Fai clic su **+** sulla sezione e scegli **Row**. Fai clic sulla sua icona griglia (**Column layout**), scegli il preset **1/3 + 1/3 + 1/3** e fai clic su **Save**.
3. In ogni colonna, aggiungi un elemento **Text** con l’etichetta del numero: "Projects delivered", "Years in business", "Clients who return".
4. In ogni colonna, fai di nuovo clic su **+** e scegli **Number counter**; arriva sopra l’etichetta. Imposta:
    - **End**: il numero (140, 12, 98)
    - **Suffix**: "+" o "%" dove si applica
    - **Thousands separator**: **Comma**
    - **Speed**: 2500, i millisecondi che impiega il conteggio
5. Fai clic su **Save** su ogni contatore.

Il contatore non ha un proprio campo etichetta, ecco perché un elemento Text sta sotto di esso.

## Passaggio 4: crea una sezione team

1. Aggiungi una quarta sezione con **Add Section Below**.
2. Fai clic su **+** sulla sezione e scegli **Row**. Fai clic sulla sua icona griglia (**Column layout**), scegli il preset **1/3 + 1/3 + 1/3** e fai clic su **Save**.
3. In ogni colonna, fai clic su **+** e scegli **Card**. Apri il suo **More** > **Settings**, imposta **Header** sul nome della persona ("Sofia Andersen") e **Title** sul suo ruolo ("Creative Director"), poi fai clic su **Save**.
4. Fai clic su **+** sulla sezione stessa e scegli **Text**; arriva sopra la riga di card. Digita "Meet the team" come **Heading 2**, centralo e fai clic su **Save**.

## Passaggio 5: aggiungi una sezione finale

1. Aggiungi un’ultima sezione con **Add Section Below** e apri il suo **More** > **Settings**. In **HTML classes** scegli **Align text center**, così testo e pulsante si centrano insieme. Nel pannello **Style** scegli il colore del tuo brand come **Background** e il bianco come **Font color**, poi fai clic su **Save**.
2. Fai clic su **+** sulla sezione e scegli **Button**. Imposta **Title** su "Get in touch", **Link** su `/contact`, **Type** su **Light** e **Size** su **Large**, poi fai clic su **Save**.
3. Fai di nuovo clic su **+** sulla sezione e scegli **Text**; arriva sopra il pulsante. Digita "Want to work with us?" come **Heading 2**, poi "We take on a handful of new clients each quarter." Nel pannello **Style** imposta **Font color** su bianco, poi fai clic su **Save**.

## Passaggio 6: salva e vedi l’anteprima

1. Fai clic su **Save** nella barra degli strumenti del builder.
2. Apri il menu vista (l’**icona occhio**) e scegli **Preview**.
3. Scorri la pagina per controllare ogni sezione.

## Per approfondire

Non mostrato nel video, ma da aggiungere:

- Un **Text** bio e un’**Image** ritratto dentro ogni card, e **Social links** sotto
- **100% height** nelle impostazioni della prima sezione per un header che riempie lo schermo

## Cosa vedi

L’anteprima mostra cinque bande. L’header scuro porta la tua missione e la sua lead in bianco. La tua storia sta accanto alla foto. Sulla banda grigia i tre numeri contano da zero quando entrano in vista scorrendo.

L’intestazione del team sta centrata sopra tre card, ciascuna con nome e ruolo. La banda finale centra un titolo bianco sopra un pulsante **Get in touch** chiaro. Scegli **Edit** nel menu occhio per continuare a lavorare.

## Se non vedi la pagina come mostrata

- **Non c’è il pulsante Add Elements sulla pagina vuota.** L’assistente di creazione pagina è spento, quindi la pagina offre solo **Choose a template**. Fai clic sull’area vuota per aprire invece il selettore di elementi.
- **Un nuovo elemento sta sopra quello aggiunto prima.** Il builder inserisce i nuovi elementi in cima alla loro sezione o colonna. Trascinalo al suo posto dalla maniglia di trascinamento sulla sua barra dei controlli.
- **Number counter o Card manca nel selettore.** Il tuo profilo utente builder lo nasconde. Chiedi a un amministratore di selezionarlo in **Elements** in **DXPR Studio** > **DXPR Builder** > **User Profiles** (`/admin/dxpr_studio/dxpr_builder/profile`).
- **Le tue modifiche non ci sono più dopo un ricaricamento.** Hai lasciato la pagina prima di fare clic su **Save** nella barra degli strumenti del builder. Se Save mostra un errore, vedi [Le modifiche non si salvano](/it/hc/documentazione/impara-dxpr-builder/risoluzione-problemi/salvataggio-non-riuscito).

## E adesso?

- [Elenco del team](/it/hc/documentazione/impara-dxpr-builder/tutorial/elenco-del-team) per una pagina team dedicata
- [Elemento Card](/it/hc/documentazione/impara-dxpr-builder/elementi/card) per tipi di card ed elementi figli
- [Elementi](/hc/documentation/learn-dxpr-builder/elements) per il riferimento completo degli elementi