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.

Testo formattato su un banner

NOTE
Se si apportano modifiche significative al contenuto di Page Builder, è consigliabile aumentare la durata della sessione di amministrazione per evitare il timeout della sessione mentre si lavora.

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.

Strumento editor di testo - TinyMCE

Casella degli strumenti Contenitore testo

Casella degli strumenti Contenitore di testo

Strumento
Icona
Descrizione
Sposta
Icona Sposta {width="25"}
Sposta il contenitore di testo in un'altra posizione valida nella pagina.
(etichetta)
TESTO
Identifica il contenitore corrente come elemento di testo.
Impostazioni
Icona Impostazioni {width="25"}
Apre le proprietà del contenitore di testo in modalità di modifica.
Nascondi
Icona Nascondi {width="25"}
Nasconde il contenitore di testo.
Spettacolo
Mostra icona {width="25"}
Mostra il contenitore di testo nascosto.
Duplica
Icona duplicata {width="25"}
Crea una copia del contenitore di testo.
Rimuovi
Icona Rimuovi {width="25"}
Elimina dall'area di visualizzazione il contenitore di testo e il relativo contenuto.
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.

Aggiungi testo

  1. Nel pannello Page Builder, espandi Elements e trascina un segnaposto Text in una riga, colonna o set di schede sull'area di visualizzazione.

    Trascinamento di un segnaposto di testo nell'area di visualizzazione {width="600" modal="regular"}

  2. Utilizza l’editor per immettere e formattare il testo, in base alle esigenze.

    Per ulteriori informazioni, vedere Utilizzo dell'editor.

    Editor di testo con contenuto {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.

  1. 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

  2. Selezionare il testo nello spazio dell'editor e fare clic su Inserisci/modifica collegamento ( Inserisci/modifica collegamento pulsante {width="20"} ) sulla barra degli strumenti dell'editor.

    Aggiunta di un collegamento al testo formattato {width="500" modal="regular"}

  3. Per URL, immettere il collegamento relativo preparato.

  4. Imposta Target su None.

    Questa impostazione consente di aprire la pagina nella stessa finestra del browser, anziché aprire una nuova scheda.

  5. Per Title, immettere Shop Tees.

    L'attributo di collegamento Title viene utilizzato da alcuni browser come descrizione comando.

  6. Per salvare il collegamento e tornare all'area di lavoro Page Builder, fare clic su OK.

    Dettagli collegamento {width="500" modal="regular"}

Inserisci un'immagine

  1. Posizionare il cursore nel testo in cui si desidera inserire l'immagine.

  2. Fare clic su Inserisci/modifica immagine ( Inserisci/modifica immagine pulsante {width="20"} ) sulla barra degli strumenti dell'editor.

  3. Per Source, fare clic sull'icona di ricerca per utilizzare l'archivio multimediale per individuare e selezionare un'immagine.

  4. 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à.

  5. 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.

  6. Per inserire l'immagine e tornare all'area di lavoro Page Builder, fare clic su OK.

Modificare le impostazioni del testo

  1. Passa il puntatore del mouse sul contenitore di testo per visualizzare la casella degli strumenti e scegli l'icona Impostazioni ( 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.
  2. Aggiorna il contenuto in base alle esigenze.

  3. 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
  4. Al termine, fare clic su Save per applicare le impostazioni e tornare all'area di lavoro Page Builder.

recommendation-more-help
85b60248-86a4-4d5f-9933-5179643f608d