Page Builder Workspace

Quando Page Builder è abilitato, il Content ​e il processo di creazione dei contenuti vengono modificati per sfruttare le funzionalità Page Builder strumenti per CMS pagine, prodotto e categoria pagine, blocchi, e blocchi dinamici. Questa sezione include_ Intestazione contenuto _, un'anteprima del contenuto e un facile accesso allo schermo intero Page Builder Workspace.

Sezione contenuto con Page Builder anteprima {width="700" modal="regular"}

Intestazione contenuto

Poiché i motori di ricerca cercano le intestazioni di livello 1 (H1), l’aggiunta di un’intestazione di livello 1 rappresenta un modo semplice per garantire che la pagina venga indicizzata correttamente.

NOTE
Il Content Heading ​nella parte superiore della pagina è un campo legacy che supporta il contenuto creato con Commerce versioni. Tuttavia, non fa parte Page Builder. Il Content Heading viene formattato come titolo H1 in base al foglio di stile associato al tema corrente. È posizionato appena sopra l'area del contenuto attivo definita dal Page Builder fase.

Per un controllo ottimale sul posizionamento e sul formato delle intestazioni di tutti i livelli, si consiglia di lasciare Content Heading ​campo vuoto e utilizza Page Builder Intestazione tipo di contenuto.

Intestazione contenuto e altri titoli {width="700" modal="regular"}

Anteprima

Quando si espande Content ​ed è presente un contenuto esistente creato con Page Builder, visualizza un’anteprima del contenuto così come apparirebbe in una pagina. Clic Edit with Page Builder ​o nell'area di anteprima del contenuto per aprire Page Builder in cui è possibile apportare gli aggiornamenti necessari.

Anteprima descrizione prodotto {width="500" modal="regular"}

NOTE
Per i moduli prodotto e categoria, questa anteprima del contenuto è abilitata per impostazione predefinita, ma può essere disabilitata. Se le prestazioni diminuiscono a causa del caricamento dell’anteprima, puoi disabilitare l’anteprima in Configurazione gestione contenuti impostazioni.

Fase

All'apertura di Page Builder dall’anteprima, lo stage è l’area di lavoro principale in cui puoi creare e formattare il contenuto e anche apportare modifiche rapide al contenuto live. L'area di visualizzazione è inizialmente vuota e consente di trascinare righe, colonne e schede dal pannello di sinistra.

NOTE
A partire dalla versione 2.4.1, la modifica del contenuto ora avviene a schermo intero solo per tutte le aree controllate da Page Builder: pagine CMS, pagine di prodotti e categorie, blocchi e blocchi dinamici. La modifica a schermo intero consente di mettere a fuoco i contenuti e offre una visualizzazione che corrisponde meglio all'esperienza utente nella vetrina.

Posiziona nell’area intermedia con contenuto pagina {width="600" modal="regular"}

NOTE
Se stai apportando modifiche significative a Page Builder è consigliabile aumentare il Durata sessione amministratore per evitare il timeout della sessione mentre si lavora.

Riquadri di visualizzazione

A viewport è l’area visibile di una pagina web visualizzata da un utente. Nella modalità di progettazione a schermo intero, i pulsanti del riquadro di visualizzazione sono visualizzati sopra Page Builder fase per mostrare il contenuto così come viene visualizzato dall’utente del sito nella vetrina.

Pulsanti del riquadro di visualizzazione {width="500" modal="regular"}

Page Builder definisce anche i punti di interruzione per i riquadri di visualizzazione. I punti di interruzione definiscono le larghezze minima e massima entro le quali vengono applicati determinati stili. Il Page Builder i riquadri di visualizzazione forniscono i seguenti punti di interruzione del contenuto:

  • Punto di interruzione desktopmin-width: 1024px. Questo punto di interruzione applica gli stili definiti per le larghezze dei riquadri di visualizzazione che misurano 1024 pixel e più.
  • Punti di interruzione mobilemax-width: 768px, min-width: 640px. Questi punti di interruzione applicano gli stili definiti per larghezze del riquadro di visualizzazione comprese tra 768 e 640 pixel.

Page Builder i riquadri di visualizzazione offrono due funzioni: anteprime dei contenuti e impostazioni punto di interruzione.

Anteprime contenuto

Per impostazione predefinita, Page Builder fornisce due anteprime dei riquadri di visualizzazione:

  • Desktop — visualizza l'anteprima del contenuto senza una larghezza predefinita. Gli stili definiti dal desktop (che utilizzano una larghezza minima del punto di interruzione di 1024 pixel) vengono ancora applicati alla pagina. Tuttavia, la larghezza del riquadro di visualizzazione Desktop è definita dalle impostazioni per i tipi di contenuto del contenitore, come Righe. Selezionando il riquadro di visualizzazione Desktop viene visualizzato lo stile del contenuto nella vetrina quando la larghezza della pagina del browser è pari o superiore a 1024 pixel.

    Anteprima del riquadro di visualizzazione desktop con larghezza minima di 1024 pixel {width="500" modal="regular"}

  • Dispositivi mobili — visualizza l'anteprima del contenuto con una larghezza predefinita di 768 pixel. A differenza del riquadro di visualizzazione Desktop, il riquadro di visualizzazione Mobile mostra il contenuto della pagina con una larghezza di 768 pixel, insieme agli stili definiti per le larghezze dei punti di interruzione di 768 pixel (massimo) e 640 pixel (minimo).

    Anteprima del riquadro di visualizzazione mobile con larghezza minima di 768 pixel {width="500" modal="regular"}

Impostazioni punto di interruzione

I pulsanti del riquadro di visualizzazione consentono inoltre di applicare stili di punto di interruzione diversi ai tipi di contenuto in base al riquadro di visualizzazione selezionato. Per impostazione predefinita, Page Builder fornisce le impostazioni dei punti di interruzione per Minimum Height ​campi di Righe, Colonne, Schede, Elementi scheda, Banner, Cursori e Diapositive. Quando selezioni il riquadro di visualizzazione mobile e apri l’editor per uno di questi tipi di contenuto, puoi immettere valori di campo specifici per i punti di interruzione del riquadro di visualizzazione mobile. I campi del tipo di contenuto che consentono impostazioni specifiche dei punti di interruzione visualizzano un'icona a destra del campo, simile all'esempio seguente per una riga:

Indicatore di icona per l’impostazione del punto di interruzione {width="400"}

Pannello

Il Page Builder Il pannello si trova a sinistra dell’area di visualizzazione e contiene tipi di contenuto che possono essere trascinati nell’area di visualizzazione. Viene quindi visualizzato un contenitore specifico per il tipo di contenuto con una casella strumenti di opzioni. I tipi di contenuto sono organizzati nel pannello come segue:

Layout

Il Layout ​sezione del Page Builder Il pannello viene utilizzato per aggiungere righe, colonne o schede all’area di visualizzazione. Quando trascini un tipo di contenuto dal pannello all’area di visualizzazione, viene visualizzato un contenitore con una casella degli strumenti contenente le opzioni specifiche per il tipo di contenuto.

Per impostazione predefinita, il Page Builder stage vuoto. Mentre trascini i tipi di contenuto layout dal pannello all’area di visualizzazione, puoi posizionarli sopra, sotto o all’interno di altri contenitori layout sulla pagina. Le righe possono essere aggiunte solo direttamente all'area di visualizzazione.

Page Builder pannello con tipi di contenuto layout e fase {width="600" modal="regular"}

Tipo di contenuto layout
Descrizione
Riga
Una nuova riga può essere trascinata solo dal pannello all’area di visualizzazione e posizionata sopra o sotto un’altra riga, scheda o gruppo di colonne. È inoltre possibile utilizzare l'opzione Duplica per creare una copia di una riga esistente.
Colonna
Una colonna può essere trascinata dal pannello all’area di visualizzazione, oppure a righe e schede. Il numero massimo di colonne che è possibile aggiungere è determinato dal numero di divisioni della griglia specificato nella configurazione.
Schede
Una singola scheda può essere trascinata dal pannello allo stage o a righe e colonne. È possibile aggiungere altre schede dalla casella degli strumenti.

Elementi

Utilizza il Elements ​sezione del Page Builder per aggiungere testo, intestazioni, pulsanti, divisori e codice HTML a qualsiasi contenitore di layout sulla Page Builder fase. Quando trascini un tipo di contenuto dal pannello a una riga o colonna o a un set di schede sullo stage, viene visualizzato un contenitore. Utilizzare la casella degli strumenti tipo di contenuto per accedere alle impostazioni specifiche del tipo.

Page Builder Pannello con tipi di contenuto Elemento {width="600" modal="regular"}

Tipo di contenuto elemento
Descrizione
Testo
Aggiunge un contenitore di testo e un editor all'area di visualizzazione.
Intestazione
Aggiunge un contenitore di intestazione all'area di visualizzazione.
Pulsanti
Aggiunge all'area di visualizzazione un contenitore per un singolo pulsante o un insieme di pulsanti.
Divisore
Aggiunge all'area di visualizzazione un contenitore per un divisore.
Codice HTML
Aggiunge all'area di visualizzazione un contenitore per il codice HTML.

Media

Utilizza il Media ​sezione del Page Builder per aggiungere immagini, video, banner, cursori e Google Maps a qualsiasi contenitore di layout sul Page Builder fase. Quando un tipo di contenuto multimediale viene trascinato dal pannello all’area di visualizzazione, viene visualizzato un contenitore con una casella degli strumenti contenente le opzioni specifiche per il tipo di contenuto.

Page Builder pannello con tipi di contenuto multimediale {width="600" modal="regular"}

Tipo di contenuto multimediale
Descrizione
Immagine
Aggiunge un contenitore di immagini all'area di visualizzazione.
Video
Aggiunge un contenitore video all'area di visualizzazione.
Banner
Aggiunge un contenitore di banner all'area di visualizzazione.
Cursore
Aggiunge un contenitore cursore allo stage.
Mappa
Aggiunge un Google Maps contenitore allo stadio.

Aggiungi contenuto

Utilizza il Add Content ​sezione del Page Builder per aggiungere contenuti esistenti alla sezione Page Builder fase. Quando trascini un tipo di contenuto multimediale dal pannello all’area di visualizzazione, viene visualizzato un contenitore. Utilizzare la casella degli strumenti tipo di contenuto per accedere al_ Impostazioni _che sono specifici per il tipo.

Page Builder Pannello con Aggiungi tipi di contenuto {width="600" modal="regular"}

Tipo di contenuto
Descrizione
Blocca
Aggiunge un blocco esistente alla fase.
Blocco dinamico
Aggiunge un blocco dinamico esistente allo stage.
Prodotti
Aggiunge un elenco di prodotti alla fase.
Solo Adobe Commerce Recommendations del prodotto
Aggiunge un'unità di consigli alla fase.

Casella strumenti

Ogni contenitore di contenuto sullo stage dispone di una casella strumenti di opzioni. Le opzioni variano in base al tipo di contenuto, ma in genere includono Sposta, Impostazioni, Nascondi/Mostra, Duplica e Rimuovi.

Mostra casella strumenti

Passa il cursore del mouse sul contenitore per visualizzare la casella degli strumenti e scegli un’opzione.

Opzioni della casella degli strumenti Riga {width="600" modal="regular"}

Opzioni della Casella degli strumenti

Opzione
Icona
Descrizione
Sposta
Icona Sposta {width="25"}
Sposta il contenitore di contenuto corrente in un'altra posizione sullo stage.
Aggiungi
Icona Aggiungi {width="25"}
Aggiunge elementi figlio come pulsanti, diapositive o tabulazioni.
(etichetta)
Identifica il tipo di contenuto del contenitore.
Impostazioni
Icona Impostazioni {width="25"}
Apre le proprietà del contenitore di contenuto in modalità di modifica.
Nascondi
Nascondi icona {width="25"}
Nasconde il contenitore di contenuto corrente.
Spettacolo
Mostra icona {width="25"}
Mostra il contenitore di contenuto corrente.
Duplica
Icona Duplica {width="25"}
Crea una copia del contenitore di contenuto corrente.
Rimuovi
Rimuovi {width="25"}
Elimina il contenitore di contenuto corrente dall'area di visualizzazione.
NOTE
Gli elementi nascosti vengono memorizzati nel database e invisibili ai clienti. Tuttavia, questi elementi sono visibili ai motori di ricerca e ad altri bot che eseguono la ricerca per indicizzazione del sito. Vengono inoltre restituiti come parte del contenuto se richiesto tramite una chiamata API con un attributo di invisibilità, a meno che non vengano rimossi dall’area di visualizzazione.
recommendation-more-help
85b60248-86a4-4d5f-9933-5179643f608d