Elementi - Testo
Utilizza il tipo di contenuto Testo per aggiungere un contenitore di testo con un editor WYSIWYG ("What You See Is What You Get") in Page Builder stage. È inoltre possibile aggiungere collegamenti, immagini, variabili e widget al testo dalla barra degli strumenti dell'editor.
{width="700"}
Strumenti dell’editor di testo
Puoi accedere all’editor di testo direttamente dall’area di visualizzazione o da una pagina di impostazioni. Le modifiche apportate direttamente all'area di visualizzazione vengono salvate automaticamente. Per ulteriori informazioni, vedere Utilizzo dell'editor.
{width="600"}
Casella degli strumenti Contenitore testo
{width="600"}
Aggiungi testo
-
Nel pannello Page Builder, espandi Elements e trascina un segnaposto Text in una riga, colonna o set di schede sull'area di visualizzazione.
{width="600" modal="regular"}
-
Utilizza l’editor per immettere e formattare il testo, in base alle esigenze.
Per ulteriori informazioni, vedere Utilizzo dell'editor.
{width="600"}
Creare un collegamento
Il pulsante Inserisci collegamento nell’editor semplifica l’aggiunta di un collegamento ipertestuale a un’immagine nella raccolta. Tuttavia, può anche essere utilizzato per creare un collegamento in linea nel testo, se disponi dell’URL in anticipo. A differenza del pulsante Widget, il pulsante di collegamento Inserisci/Modifica non è integrato con le pagine, i prodotti o le categorie presenti nell'archivio.
Per creare un collegamento per un numero di telefono o un'e-mail, vedere Aggiunta di variabili personalizzate.
-
Nella vetrina, passa alla pagina che deve essere la destinazione del collegamento e copia le informazioni sul collegamento.
Puoi utilizzare l’URL completo o un URL relativo che omette il riferimento al dominio dello store.
URL completo -
https://mystore.com/women/tops-women/tees-women.html
URL relativo -
../women/tops-women/tees-women.html
-
Selezionare il testo nello spazio dell'editor e fare clic su Inserisci/modifica collegamento ( {width="20"} ) sulla barra degli strumenti dell'editor.
{width="500" modal="regular"}
-
Per URL, immettere il collegamento relativo preparato.
-
Imposta Target su
None
.Questa impostazione consente di aprire la pagina nella stessa finestra del browser, anziché aprire una nuova scheda.
-
Per Title, immettere
Shop Tees
.L'attributo di collegamento
Title
viene utilizzato da alcuni browser come descrizione comando. -
Per salvare il collegamento e tornare all'area di lavoro Page Builder, fare clic su OK.
{width="500" modal="regular"}
Inserisci un'immagine
-
Posizionare il cursore nel testo in cui si desidera inserire l'immagine.
-
Fare clic su Inserisci/modifica immagine ( {width="20"} ) sulla barra degli strumenti dell'editor.
-
Per Source, fare clic sull'icona di ricerca per utilizzare l'archivio multimediale per individuare e selezionare un'immagine.
-
Per Image Description, immettere un testo descrittivo per l'immagine.
Questo testo popola l'attributo di collegamento
alt
per l'immagine e viene utilizzato da alcuni browser per l'accessibilità. -
Immettere la larghezza e l'altezza Dimensions in pixel per il rendering dell'immagine sulla pagina.
Mantieni selezionata la casella di controllo Constrain proportions per mantenere automaticamente le proporzioni dell'immagine.
-
Per inserire l'immagine e tornare all'area di lavoro Page Builder, fare clic su OK.
Modificare le impostazioni del testo
-
Passa il puntatore del mouse sul contenitore di testo per visualizzare la casella degli strumenti e scegli l'icona Impostazioni ( {width="20"} ).
note note NOTE Poiché il contenitore di testo è strettamente nidificato all'interno di un altro contenitore, verificare di disporre della casella degli strumenti corretta. -
Aggiorna il contenuto in base alle esigenze.
-
Aggiornare le impostazioni di Advanced in base alle esigenze.
-
Per controllare il posizionamento del testo all'interno del contenitore principale, scegliere un Alignment:
table 0-row-2 1-row-2 2-row-2 3-row-2 4-row-2 layout-auto Opzione Descrizione Default
Applica l'impostazione predefinita di allineamento specificata nel foglio di stile del tema corrente. Left
Allinea l'elenco lungo il bordo sinistro del contenitore principale, tenendo conto di eventuali spaziature specificate. Center
Allinea l'elenco al centro del contenitore padre, tenendo conto di eventuali spaziature specificate. Right
Allinea il blocco lungo il bordo destro del contenitore principale, tenendo conto della spaziatura specificata. -
Imposta lo stile Border applicato a tutti e quattro i lati del contenitore di testo:
table 0-row-2 1-row-2 2-row-2 3-row-2 4-row-2 5-row-2 6-row-2 7-row-2 8-row-2 9-row-2 10-row-2 layout-auto Opzione Descrizione Default
Applica lo stile di bordo predefinito specificato dal foglio di stile associato. None
Non fornisce alcuna indicazione visibile dei bordi del contenitore. Dotted
Il bordo del contenitore viene visualizzato come una linea tratteggiata. Dashed
Il bordo del contenitore viene visualizzato come una linea tratteggiata. Solid
Il bordo del contenitore viene visualizzato come linea continua. Double
Il bordo del contenitore viene visualizzato come una doppia riga. Groove
Il bordo del contenitore viene visualizzato come una linea scanalata. Ridge
Il bordo del contenitore viene visualizzato come una linea scanalata. Inset
Il bordo del contenitore viene visualizzato come una linea interna. Outset
Il bordo del contenitore viene visualizzato come una linea di contorno. -
Se si imposta uno stile di bordo diverso da
None
, completare le opzioni di visualizzazione del bordo:table 0-row-2 1-row-2 2-row-2 3-row-2 layout-auto Opzione Descrizione Border Color Specificate il colore scegliendo un campione, facendo clic sul selettore del colore oppure immettendo un nome di colore valido o un valore esadecimale equivalente. Border Width Immettere il numero di pixel per lo spessore della linea del bordo. Border Radius Immettere il numero di pixel per definire la dimensione del raggio utilizzato per arrotondare ogni angolo del bordo. -
(Facoltativo) Specificare i nomi di CSS classes dal foglio di stile corrente da applicare al contenitore.
Separare più nomi di classe con uno spazio.
-
Immettere i valori in pixel per Margins and Padding per determinare i margini esterni e la spaziatura interna del contenitore di testo.
Immettere i valori corrispondenti nel diagramma.
table 0-row-2 1-row-2 2-row-2 layout-auto Area contenitore Descrizione Margins Quantità di spazio vuoto applicata al bordo esterno di tutti i lati del contenitore. Opzioni: Top
/Right
/Bottom
/Left
Padding Quantità di spazio vuoto applicata al bordo interno di tutti i lati del contenitore. Opzioni: Top
/Right
/Bottom
/Left
-
-
Al termine, fare clic su Save per applicare le impostazioni e tornare all'area di lavoro Page Builder.