Skip to content
English
Contact us Sign in
Go to the website
  • There are no suggestions because the search field is empty.

Content Library con HubDB tables e filtri in HubSpot

Ultimo aggiornamento: Luglio 2026
Tempo medio: 3–4 ore (prima volta) | 20 min (gestione quotidiana)

Questa guida copre come creare un listing di contenuti dinamico (Content Library) in HubSpot usando:

  • HubDB table per i dati
  • Modulo HubL personalizzato per la visualizzazione
  • Filtri lato client (Progetto, Tipo, Anno, Tag)

Il processo si divide in quattro fasi: creazione tabella → creazione modulo → inserimento in pagina → gestione quotidiana.

Fase 1: Creare la tabella HubDB

Dove

HubSpot → menu laterale Marketing → Content → HubDB

Come

Step 1 — Creare la tabella

  1. Clicca "Create table" in alto a destra
  2. Dai un nome significativo (es. "Content Library", "Resources 2026")
  3. Clicca "Create"

Step 2 — Aggiungere le colonne

Clicca "Add column" e aggiungi queste colonne nell'ordine indicato:

Colonna Tipo Obbligatoria Note
PROGETTO Select (multi) ✅ Sì Es: [Marketing, Sales, Corporate, Risorse Umane]
TITOLO PAGINA Text ✅ Sì Il titolo che appare nella card
SOTTOTITOLO Text ⭐ Consigliata Breve descrizione (max 100 car)
COVER Image ⭐ Consigliata Immagine hero della card (1200x630 px ideale)
URL Text/Link ✅ Sì Link relativo (/it/nome-pagina) o assoluto
TIPO Text ✅ Sì Es: Landing page, Articolo, Evento, Case study
TAG Text ⭐ Consigliata Tag separati da virgola (es: "AI, automazione, CRM")
ANNO Number ✅ Sì Anno di riferimento (es: 2026)
LINGUA Select (singola) ✅ Sì Opzioni: IT, EN, DE, FR (adatta al sito)

⚠️ Regola importante per Select (PROGETTO e LINGUA):
Quando aggiungi una colonna di tipo Select, HubSpot ti chiede di definire le opzioni subito. Fallo con attenzione — le opzioni che metti qui compariranno nei filtri del sito. Se sbagli, ritroverai duplicati ("marketing" e "Marketing" come valori diversi).

Step 3 — Abilitare la pubblicazione

  1. Fai clic sull'ingranaggio ⚙️ → Table settings
  2. Assicurati che "Publishing" sia ON
  3. Salva le impostazioni

Step 4 — Annotare il Table ID

Troverai il Table ID in uno di questi posti:

  • Ingranaggio → Table settings (sezione "General")
  • URL della tabella: ...?tableId=XXXXX (numero lungo)

Esempio: 1234567890

📌 Salva questo numero — serve per collegare la tabella al modulo.

Fase 2: Creare il modulo HubL personalizzato

Dove

HubSpot → Marketing → Content → Design Manager
(oppure cerca "Design Manager" nella barra di ricerca in alto)

Come

Step 1 — Creare un nuovo modulo

  1. Clicca l'icona "+" (nuovo file) in alto a sinistra
  2. Seleziona "Module"

Step 2 — Configurare il modulo

Nella schermata di setup:

  • Spunta le aree di utilizzo:
    • ✅ Landing pages
    • ✅ Blog listing pages
    • ✅ Site pages
    • ✅ (altre aree rilevanti per il tuo sito)
  • Module content scope: lascia su "Local module"
  • File name: dai un nome chiaro
    • Es: content-library-listing, risorse-prodotti-listing
  • File location: verifica che sia nella cartella del tema attivo
  • Clicca "Create"

Si apre l'editor con tre sezioni: HTML (con HubL) | CSS | JavaScript

Step 3 — Inserire il codice

⚠️ Importante: Il codice HTML, CSS e JavaScript completo varia da progetto a progetto e si aggiorna quando aggiungi funzionalità. Chiedi al referente tecnico del progetto il codice aggiornato.

Dove incollare:

  • Campo 1 (HTML + HubL): Il codice HTML e HubL
  • Campo 2 (CSS): Gli stili
  • Campo 3 (JavaScript): La logica dei filtri

Step 4 — Aggiornare il Table ID nel codice

Cerca nel codice HTML questa riga (o simile):

hubdb_table_rows('XXXXX', ...)

Sostituisci XXXXX con il Table ID annotato nella Fase 1.

Es: cambia da hubdb_table_rows('1234567890', ...) a hubdb_table_rows('9876543210', ...)

Step 5 — Salvare il modulo

Clicca "Save" in alto. Se il salvataggio non funziona, controlla la console del browser (F12) per eventuali errori di sintassi nel codice.

Fase 3: Inserire il modulo in una pagina

Dove

Nella pagina dove vuoi che compaia il listing (Landing page, Site page, template Blog)

Come

  1. Apri la pagina in edit
  2. Clicca "Add module" (di solito nel pannello laterale sinistro)
  3. Cerca il modulo per nome (es: "content-library-listing")
  4. Trascinalo nel punto desiderato della pagina
  5. Pubblica la pagina

Se la pagina è già pubblicata e stai solo testando, usa "Preview" prima di pubblicare.

Fase 4: Gestione quotidiana dei contenuti

Questa è la parte che il team farà più spesso una volta che tabella e modulo sono impostati.

Aggiungere un contenuto

Step 1 — Accedere a HubDB

  • HubSpot → Marketing → Content → HubDB
  • Apri la tabella

Step 2 — Clicca "Add row"

Step 3 — Compila le colonne

Colonna Cosa fare Errori comuni
PROGETTO Seleziona dal menu a tendina (non scrivere a mano) ❌ Digitare "Marketing" invece di selezionare → crea valori duplicati nei filtri
TITOLO PAGINA Testo della card (max 60 car per visual appeal) ❌ Titoli troppo lunghi rompono la card
SOTTOTITOLO Breve descrizione (max 100 car) ⚠️ Facoltativi ma consigliati
COVER Carica l'immagine (o seleziona da libreria) ❌ Immagini a caso ruinano il design. Usa dimensioni coerenti (1200x630 px)
URL Link alla pagina reale (es: /it/nome-pagina o https://...) ❌ URL errati → link rotti
TIPO Tipo di contenuto (es: "Landing page", "Articolo") ❌ Scrivere inconsistente ("Articolo" vs "articolo") → crea filtri sbagliati
TAG Tag separati da virgola (es: "AI, automazione") ⚠️ Facoltativi ma utili per la ricerca
ANNO Anno numerico (es: 2026) ❌ Numero intero senza lettere
LINGUA Seleziona dal menu a tendina (IT, EN, DE, etc) ❌ Se vuota, il contenuto non compare

Step 4 — Clicca "Publish"

⚠️ Fondamentale: senza pubblicare, le modifiche restano in bozza.

Contenuti multilingue

Se un contenuto esiste in più lingue (es: same articolo in IT e EN):

  1. Aggiungi una riga per ogni lingua
  2. Usa gli stessi valori per: PROGETTO, TIPO, ANNO, TAG
  3. Cambia solo: TITOLO, SOTTOTITOLO, COVER, URL, LINGUA
  4. Pubblica entrambe le righe

Esempio:

PROGETTO TITOLO LINGUA URL
Marketing "Come sfruttare l'IA" IT /it/ia-guida
Marketing "How to leverage AI" EN /en/ai-guide

Aggiornare un contenuto

  1. Apri la tabella HubDB
  2. Fai clic sulla riga da modificare
  3. Aggiorna i campi
  4. Clicca "Publish"
Fase 5: Risoluzione problemi
Problema Possibile causa Soluzione
Un contenuto non compare sul sito Tabella non pubblicata dopo l'ultima modifica Vai su HubDB, apri la tabella, clicca "Publish" in alto
Un contenuto compare nella lingua sbagliata Colonna LINGUA vuota o con valore non riconosciuto Verifica che LINGUA sia riempita con IT/EN/DE/FR (esatto)
I filtri mostrano valori strani (es: "marketing" minuscolo, "marketing-2", etc) PROGETTO/TIPO scritti a mano invece di selezionati dal menu Cancella la riga, creane una nuova, seleziona dal menu a tendina
L'immagine COVER non appare nella card Colonna COVER vuota Carica un'immagine
Il modulo non carica nulla / pagina bianca Table ID nel codice del modulo non corrisponde più Verifica il Table ID corrente (Ingranaggio → Table settings) e aggiorna il codice HTML
I filtri non funzionano JavaScript disabilitato o errore nella console Controlla la console (F12 nel browser) per errori. Se persiste, contatta il referente tecnico
Un tag/tipo/progetto "strano" compare nei filtri Errore di digitazione / spazio in più Pulisci la riga e ricrea con i valori corretti

Contattare il supporto

Se il problema non è in questa tabella:

  • Raffa (raffa@andergroup.com) — lead di progetto
  • Referente tecnico del progetto — codice del modulo
Note tecniche

Come funziona il modulo

  1. Caricamento dati: HubL (hubdb_table_rows()) legge i dati dalla tabella lato server → niente CORS, niente token API
  2. Filtri: JavaScript lato client filtra le card già presenti nella pagina
  3. Paginazione: Carica 18 elementi alla volta (numero configurabile nel JS)

Performance

  • ✅ Ottimizzato: carica solo i dati rilevanti per la lingua
  • ✅ Responsive: funziona su mobile e desktop
  • ✅ SEO-friendly: i dati sono nel markup HTML, non nascosti in XHR

Limiti

  • ❌ Max 5000 righe di dati (limite HubSpot HubDB)
  • ❌ I filtri lato client non sono SEO-crawlable (ma la prima pagina sì)
Checklist finale — prima di lanciare
  • [ ] Tabella creata e pubblicata
  • [ ] Modulo creato e salvato
  • [ ] Table ID nel codice del modulo verificato
  • [ ] Modulo aggiunto alla pagina
  • [ ] Almeno 3 contenuti di test inseriti
  • [ ] Verifica che la pagina compaia correttamente su desktop e mobile
  • [ ] Verifica che i filtri funzionino
  • [ ] Verifica che i link URL siano corretti
  • [ ] Verifica che le immagini COVER si vedano
  • [ ] Pagina pubblicata
  • [ ] Comunicato il Table ID al referente tecnico per future manutenzioni
Riassunto veloci per il team

20 sec: Aggiungere un contenuto

  1. HubSpot → Marketing → HubDB → apri tabella
  2. "Add row" → compila i campi (PROGETTO da menu, TIPO coerente, LINGUA)
  3. "Publish"

Errori da evitare

  • ❌ Scrivere i valori di PROGETTO a mano (usa il menu)
  • ❌ Dimenticare di pubblicare
  • ❌ Lasciare LINGUA vuota
  • ❌ Titoli lunghissimi che rompono la card

FAQ veloce

  • Q: Voglio cambiare il PROGETTO di una riga?
    A: Modifica la riga, seleziona il nuovo PROGETTO dal menu, pubblica.
  • Q: Voglio aggiungere una nuova opzione al filtro PROGETTO?
    A: Vai su Table settings → Table structure → seleziona colonna PROGETTO → aggiungi opzione. Pubblica la tabella.
  • Q: Il contenuto non si vede anche dopo aver pubblicato?
    A: Controlla che LINGUA sia riempita correttamente (IT/EN/DE). Se persiste, contatta Raffa.
Versione documento
  • v1.0 — Luglio 2026
  • Basato su implementazioni Ander Group (2024–2026)
  • Mantieni aggiornato quando il processo cambia o si aggiungono funzionalità