LUCALODI

Aggiornare i contenuti da solo: Prismic, Shopify, WordPress

Sì, se i campi del CMS sono progettati sul sito. Il catalogo resta in Shopify, le pagine nel CMS; layout e motion restano nel codice.

In breve

  • Autonomia reale: i contenuti si aggiornano in autonomia, se i campi sono progettati per quel sito.
  • Campi su misura: nessun page builder generico, solo i campi previsti dal progetto.
  • Prismic: è il CMS che uso più spesso con gli studi.
  • Shopify: in uno shop prodotti, prezzi, ordini, carrello e checkout restano nell'admin Shopify.
  • WordPress: quando chi aggiorna usa già quell'editor: GreenWaves, POLI.design, Wolf VA, Colombo New Scal.
  • Cosa resta nel codice: layout, motion e scena 3D. La consegna include una sessione su anteprima e pubblicazione.

Sì, se i campi sono quelli del progetto

Sì, su ciò che è in un campo: titolo, paragrafo, immagine, link, una pagina prevista dal modello. La struttura della pagina è codice; il testo è contenuto.

«Aggiornarlo da solo» non significa comporre sezioni nuove. Una sezione animata è un componente: cambia il testo, il movimento resta. Un blocco nuovo è sviluppo, e si stima a parte.

Chi aggiorna è lo studio o il cliente, secondo chi tiene gli accessi. Con le agenzie la consegna è di solito con lo studio, che decide se il cliente finale entra nell'admin.

Quasi tutti i siti che sviluppo sono in Next.js: pagine statiche dove possibile, dati dal CMS, immagini con dimensioni reali. Headless ha senso se il front è molto su misura o se più fonti confluiscono in una sola interfaccia. Per un sito istituzionale lineare, un tema WordPress può bastare.

Prismic, con gli studi

In Prismic il documento è fatto di campi con un nome — titolo, testo, immagine, relazione — e la pagina Next.js sa quale componente legge quale campo. Chi scrive compila il modello disegnato sul design.

  • Frame by Frame — il sito dello studio, aggiornabile senza toccare i componenti.
  • Contraste Milano — atmosfera e prenotazione, con un designer di riferimento.
  • Villa Brasini — protocolli, tecnologie, medici e notizie collegati tra loro, con uno studio partner.
  • Tenuta Fratini — con uno studio partner.
  • Cosmic Crisp — gli elementi del tunnel 3D allo scroll arrivano dal CMS: il cliente li aggiorna senza toccare il codice.

La carta dei vini di Contraste si aggiorna dal file di magazzino, non dal sito. Il racconto: carta dei vini digitale.

Con un negozio, Prismic affianca il catalogo: su Diesel Farm e NAYT il racconto è in Prismic, i prodotti in Shopify. Due login, due compiti.

La schermata di scrittura mostra i campi, non la composizione finale. Per quella c'è l'anteprima (più sotto).

Shopify per catalogo, carrello e checkout

Prodotti, prezzi, ordini, carrello, checkout e pagamenti restano nell'admin Shopify. Non li ricostruisco altrove: due fonti per lo stesso prezzo creano errori.

In headless la pagina che vede il visitatore è Next.js e legge il catalogo; non è il tema Shopify. Servizio correlato: Shopify headless.

  • Diesel Farm e NAYT: Storefront API, racconto in Prismic, motion GSAP.
  • Bradiboo: stessa divisione, ma il racconto è in WordPress; con un designer di riferimento. Per chi pubblica: WordPress per i contenuti, Shopify per i prodotti.

Da sapere in consegna:

  • un prodotto in bozza non compare in vetrina;
  • un prezzo cambiato in Shopify è quello che legge la vetrina;
  • spostare una sezione nel theme editor di Shopify non cambia la pagina Next.js.

WordPress, se l'editor è già quello

WordPress è una scelta valida quando chi aggiorna lo preferisce e la struttura è editoriale o istituzionale. Il motion può stare nel tema: GSAP non richiede l'headless.

  • GreenWaves — Uncode con child theme, GSAP, Lenis, Swiper; con un designer di riferimento.
  • POLI.design — tema custom con D3.js e GSAP; per uno studio digitale milanese.
  • Wolf VA — tema custom, GSAP, gallerie Swiper; per uno studio digitale milanese.
  • Colombo New Scal — tema custom, GSAP e Swiper; con un designer di riferimento.

Qui anteprima e pagina pubblica condividono il tema. Il limite resta il tema: una griglia nuova o una scena tornano in sviluppo.

WordPress quando l'editor è già quello e la struttura è editoriale; Next.js quando il front è su misura, c'è uno shop headless o motion e 3D fanno parte della pagina. Servizi: Next.js e CMS headless, temi WordPress custom.

Layout, timeline di motion, scena 3D

Tre cose restano fuori dall'editor:

  1. Layout — griglia, breakpoint, gerarchia, comportamento dei titoli lunghi. Se un bisogno è ricorrente, si disegna un campo vero, con limiti.
  2. Timeline di motion — GSAP, scroll, transizioni. Il componente riceve il testo nuovo e ripete lo stesso movimento. prefers-reduced-motion è un comportamento del sito, non un interruttore nell'admin.
  3. Scena 3D — Three.js, React Three Fiber, shader, WebAR. Titolo e testo restano nel documento.

Il confine: se la modifica è un contenuto previsto, si fa nell'admin; se cambia forma, tempo o spazio, torna a chi tiene il repository.

Anteprima, pubblicazione, consegna

  • Tema WordPress: l'anteprima è la pagina: stesso tema, stessi componenti, stesso motion.
  • Headless (Prismic + Next.js): la schermata del CMS è un modulo. L'anteprima è un URL che mostra la bozza nel layout vero: a capo, immagini, titoli troppo lunghi. Chi non ha quel link vede il pubblicato.
  • Build o richiesta: se la pagina è generata alla build, il pubblicato compare quando il sito rilegge i dati; se legge il CMS a richiesta, compare subito. Quale dei due si usa è scritto in consegna.
  • Shopify headless: l'admin prodotto non è la vetrina; ordini e checkout si controllano in Shopify, la vetrina sull'URL del sito.

In consegna facciamo una modifica vera — un titolo, un'immagine, un prezzo — apriamo l'anteprima giusta, pubblichiamo e controlliamo la URL pubblica. Lascio scritto dove sta ogni contenuto e cosa torna allo sviluppo. Con le agenzie, la sessione è con lo studio.

Repository e accessi passano al committente, insieme a chi è owner degli account Prismic, Shopify o WordPress. Dopo il lancio, tenerlo acceso è manutenzione dopo il lancio.

Domande frequenti

Posso cambiare un testo senza rifare l'animazione?

Sì, se il testo è un campo del componente. Se è molto più lungo del previsto, l'anteprima lo mostra: si accorcia il testo o si chiede un aggiustamento di layout.

Posso comporre pagine nuove con blocchi liberi?

Con i modelli previsti, sì. Un page builder generico, no: un blocco nuovo va disegnato e sviluppato.

Dove cambio un prezzo, e dove cambio la storia del prodotto?

Prezzo, varianti, disponibilità e ordini in Shopify. La storia in Prismic (Diesel Farm, NAYT) o in WordPress (Bradiboo).

L'anteprima headless è il sito pubblico?

No, è la bozza nel layout vero. Il pubblico cambia quando pubblichi e il sito legge il dato nuovo.

Chi modifica una scena 3D o una timeline?

Chi tiene il codice. Camera, modello, shader e durate GSAP si cambiano nel repository.

La mia scelta

Progetto i campi per le persone che pubblicheranno davvero. L'autonomia prevista comprende testi, immagini, pagine previste e, in uno shop, il catalogo in Shopify. Layout, motion e 3D restano nel codice: è così che il design dello studio resta intatto dopo il primo aggiornamento. In consegna si esegue una modifica reale e il confine viene documentato per iscritto.

Lavori collegati

Servizi collegati