Come utilizzare l'editor di blocchi HTML nell'editor visuale di MultiLipi

L'Editor di Blocchi HTML è una funzionalità avanzata all'interno dell'Editor Visivo di MultiLipi. Invece di limitare le modifiche al testo visibile o ai CSS, ti permette di lavorare con l'HTML di un elemento selezionato tramite un pannello dedicato.

• Sostituisci una sezione in inglese con una sezione in hindi completamente personalizzata.
• Inserisci un banner promozionale localizzato prima di una descrizione prodotto.
• Aggiungi una CTA specifica per il mercato dopo un paragrafo esistente.
• Nascondi una sezione irrilevante per un pubblico di una determinata lingua.
• Riutilizza lo stesso markup promozionale su più pagine tradotte.

MultiLipi Editor visuale con un elemento della pagina web selezionato e le azioni Traduci, Stile e HTML visibili

La barra degli strumenti mobile separa la traduzione dei contenuti, lo stile visivo e la struttura HTML. Per modifiche puramente estetiche, utilizza Stile o segui la guida al CSS personalizzato; utilizza HTML quando è necessario modificare il markup stesso.

MultiLipi Editor di blocchi HTML che mostra l'elemento selezionato, il campo del contenuto HTML, l'anteprima e i controlli per salvare l'HTML

MultiLipi Menu a discesa delle azioni del blocco HTML che mostra Sostituisci contenuto interno, Inserisci prima dell'elemento e Inserisci dopo l'elemento

4.1 Sostituisci contenuto interno (innerHTML)

Questa azione sostituisce i figli dell'elemento selezionato preservando l'elemento esterno selezionato. È la scelta giusta per sostituire un'intestazione, ricostruire un blocco di contenuto o creare una presentazione localizzata diversa.

<!-- Contenitore selezionato originale -->
<div>
  <h2>Benvenuti nel nostro negozio</h2>
  <p>Scopri i nostri ultimi prodotti.</p>
</div>

<!-- Nuovo HTML interno -->
<h2>Benvenuti nel nostro negozio</h2>
<p>Scopri i nostri ultimi prodotti.</p>

4.2 Inserisci prima dell'elemento

Aggiunge markup personalizzato immediatamente prima della selezione senza rimuovere il contenuto esistente. Usalo per avvisi localizzati, introduzioni, banner di campagne o spiegazioni specifiche per il mercato.

<div class="localized-banner">
  <p>Offerte speciali per i nostri clienti italiani</p>
</div>

4.3 Inserisci dopo l'elemento

Aggiunge markup immediatamente dopo l'elemento selezionato. Funziona bene per pulsanti di contatto, contenuti correlati, consigli sui prodotti e inviti all'azione localizzati.

<div class="localized-cta">
  <a href="/contact/">Contatta il nostro team</a>
</div>

<div class="custom-section">
  <h2>Benvenuti nella nostra piattaforma globale</h2>
  <p>
    Esplora i nostri prodotti e servizi
    nella tua lingua preferita.
  </p>
</div>

Gli elementi comuni includono intestazioni, paragrafi, contenitori, span, enfasi, link ed elenchi. Per la terminologia che deve rimanere coerente tra le traduzioni, configura MultiLipi regole del glossario piuttosto che duplicare le modifiche manuali all'HTML. Per la localizzazione di immagini e contenuti visivi, utilizza il dedicato flusso di lavoro di traduzione multimediale.

Il Nascondi in questa lingua il controllo nasconde il blocco selezionato solo per la lingua attualmente in fase di modifica. Ciò può essere appropriato per un'offerta specifica di mercato, un prodotto non disponibile o un'introduzione localizzata alternativa.

Gli snippet HTML riutilizzabili offrono una libreria in stile WPCode per banner, avvisi, CTA, blocchi prodotto e layout personalizzati ripetuti. Apri Snippet HTML, quindi scegli + Nuovo Snippet o Crea il primo snippet.

MultiLipi Gestore di snippet HTML riutilizzabili che mostra la libreria di snippet, il pulsante Nuovo Snippet e lo stato vuoto

<div class="global-promo">
  <h3>Scopri i nostri servizi</h3>
  <p>Esplora soluzioni progettate per aziende internazionali.</p>
  <a href="/contact/">Contattaci</a>
</div>

Dopo aver salvato, torna al Blocco HTML e usa Inserisci snippet salvato.... Il vicino + Gestisci link riapre la gestione degli snippet.

Per personalizzare un H1, seleziona l'intestazione stessa, conferma che il tag selezionato sia H1, scegli Sostituisci contenuto interno, modifica il markup, visualizza l'anteprima e salva.

MultiLipi Editor di blocchi HTML che modifica l'HTML interno di un'intestazione H1

<span>Ottimizzazione LLM oltre</span>:
L'ingegneria dietro la visibilità dell'IA

• Seleziona l'elemento più piccolo che consente di ottenere il risultato desiderato.
• Preferisci l'inserimento quando il contenuto originale deve rimanere invariato.
• Mantieni i tag validi, chiusi e correttamente nidificati.
• Testa i link localizzati invece di dare per scontato che /contact/ si risolva correttamente in ogni lingua.
• Evita script non attendibili, gestori di eventi e codici di incorporamento sconosciuti.
• Controlla i comandi del viewport desktop e mobile prima di salvare.
• Utilizza snippet per strutture ripetute e regole di glossario per la terminologia ricorrente.
• Non nascondere funzionalità critiche solo per semplificare un layout localizzato.

Per layout da destra a sinistra (RTL), consulta supporto per lingue RTL. Se i visitatori devono raggiungere automaticamente una lingua appropriata, configura il reindirizzamento linguistico per i visitatori. Per il lavoro su contenuti di massa, la guida all'importazione ed esportazione delle traduzioni potrebbe essere più efficiente rispetto alle modifiche HTML elemento per elemento.