---
url: 'https://dxpr.com/it/hc/documentazione/impara-dxpr-builder/tutorial/layout-blog'
title: 'Progetta un layout blog | DXPR'
author:
  name: Jurriaan
  url: 'https://dxpr.com/users/jurriaan'
date: '2026-10-23T23:56:52+00:00'
updated: '2026-10-24T17:19:22+00:00'
copyright: 'Copyright DXPR. All rights reserved.'
type: article
summary: |-
  Qui crei la pagina che elenca i tuoi post del blog: un post in evidenza in alto, un elenco da una vista Drupal con barra laterale, e una banda newsletter. I nuovi post vi compaiono senza modificare la pagina. Per raccontare a fondo una storia cliente, segui invece Scrivi un caso di studio.
  Il video crea il blog di un prodotto di reportistica.
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-24T17:19:22+0000'
  'image:alt': 'DXPR, powered by Drupal: AI-powered Drupal for marketers.'
schema:
  '@context': 'https://schema.org'
  '@graph':
    -
      mainEntity: {  }
    -
      '@type': TechArticle
      headline: 'Progetta un layout blog'
      description: |-
        Qui crei la pagina che elenca i tuoi post del blog: un post in evidenza in alto, un elenco da una vista Drupal con barra laterale, e una banda newsletter. I nuovi post vi compaiono senza modificare la pagina. Per raccontare a fondo una storia cliente, segui invece Scrivi un caso di studio.
        Il video crea il blog di un prodotto di reportistica.
      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:52+0000'
      dateModified: '2026-10-24T17:19:22+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/layout-blog'
      articleSection: 'Segui un tutorial'
    -
      '@type': WebPage
      '@id': 'https://dxpr.com/it/hc/documentazione/impara-dxpr-builder/tutorial/layout-blog'
      description: |-
        Qui crei la pagina che elenca i tuoi post del blog: un post in evidenza in alto, un elenco da una vista Drupal con barra laterale, e una banda newsletter. I nuovi post vi compaiono senza modificare la pagina. Per raccontare a fondo una storia cliente, segui invece Scrivi un caso di studio.
        Il video crea il blog di un prodotto di reportistica.
      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) # Progetta un layout blog.

 Impara DXPR BuilderCrea le pagineSegui un tutorial

   ## In questa guida

 Guide correlate

- [Aggiungi moduli alle pagine](/it/hc/documentation/learn-dxpr-builder/tutorials/add-forms)
- [Mostra una vista Drupal nella tua pagina](/it/hc/documentazione/impara-dxpr-builder/integrazioni/vista-drupal)
- [Aggiungere un blocco Drupal alla pagina](/it/hc/documentazione/impara-dxpr-builder/integrazioni/blocchi-drupal)
- [Crea una pagina Chi siamo](/it/hc/documentation/learn-dxpr-builder/tutorials/about-page)

Qui crei la pagina che elenca i tuoi post del blog: un post in evidenza in alto, un elenco da una vista Drupal con barra laterale, e una banda newsletter. I nuovi post vi compaiono senza modificare la pagina. Per raccontare a fondo una storia cliente, segui invece [Scrivi un caso di studio](/it/hc/documentazione/impara-dxpr-builder/tutorial/caso-di-studio).

Il video crea il blog di un prodotto di reportistica.

  ## Prima di iniziare

- Il tuo ruolo ha il permesso **Edit with DXPR Builder**.
- Il tuo sito ha una vista che elenca i post del blog. DXPR CMS fornisce una vista **Blog** con un elenco **Blog** e una visualizzazione **Featured posts**.
- La pagina è aperta nel builder. Per una nuova, vai in **Content** > **Add content** > **Landing Page** (`/node/add/landing_page`) e fai clic su **Save**.
- I nuovi elementi arrivano in cima alla loro colonna. Aggiungi gli elementi di una colonna in ordine inverso, oppure trascinali al loro posto dopo.

## Passaggio 1: aggiungi il post in evidenza

1. Fai clic su **Add Elements** sulla pagina vuota e scegli **Section** dalla scheda **Layout**.
2. Fai clic su **+** sulla sezione e scegli **Row**; arriva con due colonne uguali. Fai clic sulla sua icona griglia (**Column layout**), scegli il preset **2/3 + 1/3** e fai clic su **Save**.
3. Fai clic su **+** nella colonna larga e scegli **Image** dalla scheda **Content**. Fai clic su **Select Image**, seleziona una foto e fai clic su **Insert selected**. Digita l’**Alt attribute** nel pannello **SEO** e fai clic su **Save**.
4. Fai clic su **+** nella colonna stretta e scegli **Button**. Imposta **Title** su "Read more", **Link** sul post e tieni **Type** su **Primary**, poi fai clic su **Save**.
5. Fai di nuovo clic su **+** nella colonna stretta e scegli **Text**; arriva sopra il pulsante. Digita il titolo del post come **Heading 2**, aggiungi sotto l’estratto e fai clic su **Save**.

## Passaggio 2: aggiungi l’elenco e la barra laterale

1. Passa sopra alla sezione e fai clic su **Add Section Below**. Aggiungivi una **Row** con il preset **2/3 + 1/3**.
2. Fai clic su **+** nella colonna larga e apri la scheda **Drupal Views**. Scegli **View: Blog (Blog)** e fai clic su **Save**; rende i tuoi post.
3. Fai clic su **+** nella colonna stretta e apri la scheda **Drupal Views**. Scegli **View: Blog (Featured posts)** e fai clic su **Save**.
4. Fai di nuovo clic su **+** nella colonna stretta e apri la scheda **Drupal Blocks**. Scegli **Block: Forms: Search form** e fai clic su **Save**; arriva sopra i post in evidenza.

## Passaggio 3: aggiungi la banda newsletter

1. Aggiungi una terza sezione con **Add Section Below**. Apri il suo **More** > **Settings**, scegli il **Background** blu scuro nel pannello **Style** e fai clic su **Save**.
2. Fai clic su **+** sulla sezione e scegli **Button**. Imposta **Title** su "Subscribe to the newsletter", **Link** su `/newsletter` e **Type** su **Light**, poi fai clic su **Save**.
3. Fai di nuovo clic su **+** e scegli **Text**; arriva sopra il pulsante. Digita "Stay updated" come **Heading 2** e una riga sulla newsletter sotto. Imposta **Font color** su bianco nel pannello **Style** e fai clic su **Save**.

## Passaggio 4: 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**.

## Per approfondire

Non mostrato nel video:

- **Modulo di iscrizione**: aggiungi un blocco modulo newsletter dalla scheda **Drupal Blocks** al posto del pulsante; vedi [Aggiungi moduli alle pagine](/it/hc/documentation/learn-dxpr-builder/tutorials/add-forms)
- **Categorie**: aggiungi una vista delle categorie del tuo blog alla barra laterale
- **Tinta barra laterale**: apri le impostazioni della colonna stretta e dagli un **Background** grigio chiaro e un po’ di padding nel pannello **Style** della colonna

## Cosa vedi

Il post in evidenza apre la pagina: un’ampia foto a sinistra, il suo titolo, estratto e pulsante **Read more** a destra. Sotto i tuoi post riempiono la colonna larga, con modulo di ricerca e post in evidenza nella barra laterale. Una banda blu scuro chiude la pagina con l’intestazione **Stay updated** e il pulsante **Subscribe to the newsletter**.

## Se non vedi i tuoi post

- **La vista Blog non è nella scheda Drupal Views.** La vista è disattivata, oppure il tuo profilo utente builder la nasconde. Attivala in **Structure** > **Views** (`/admin/structure/views`), oppure chiedi a un amministratore di selezionarla in **Views** nel tuo profilo utente.
- **La colonna elenco resta vuota.** La vista non ha post pubblicati da mostrare. Pubblica un post in **Content** > **Add content** > **Blog post**, poi ricarica la pagina.
- **Il modulo di ricerca non è nella scheda Drupal Blocks.** Il modulo core **Search** fornisce quel blocco. Attivalo in **Extend** (`/admin/modules`).
- **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?

- [Aggiungi moduli alle pagine](/it/hc/documentation/learn-dxpr-builder/tutorials/add-forms) per moduli di iscrizione
- [Integrazione viste Drupal](/it/hc/documentazione/impara-dxpr-builder/integrazioni/vista-drupal) per configurare le viste
- [Integrazione blocchi Drupal](/it/hc/documentazione/impara-dxpr-builder/integrazioni/blocchi-drupal) per blocchi di barra laterale
- [Pagina Chi siamo](/it/hc/documentation/learn-dxpr-builder/tutorials/about-page) per il prossimo tutorial