Incorporare codice personalizzato - Aiuto Webflow
Aggiungi blocchi di codice personalizzato al tuo sito utilizzando l'elemento Code Embed per sbloccare ogni tipo di funzionalità personalizzata.
<style> e JS nei tag <script>. Non puoi integrare linguaggi lato server (ad es., Perl, PHP, Python, Ruby) in un elemento Code Embed.Come aggiungere un elemento Code Embed
Puoi incorporare codice di terze parti o il tuo codice personalizzato ovunque nel tuo design o in un elemento di testo ricco.
Come aggiungere codice personalizzato direttamente al tuo design
- Copia il codice che desideri incorporare negli appunti
- Apri il Pannello Aggiungi e aggiungi un elemento Code Embed al canvas di Webflow
- Incolla il codice personalizzato che hai copiato nel passaggio 1
- Salva e chiudi la finestra modale
<html>, <body> o <head> nel tuo codice personalizzato, altrimenti il tuo sito/layout si romperà.Come aggiungere codice personalizzato a un elemento di testo ricco
- Copia il codice che desideri incorporare negli appunti
- Posiziona il cursore nell'elemento di testo ricco dove desideri aggiungere il tuo codice personalizzato
- Clicca sull'icona “più” per aprire il menu di inserimento e clicca sul pulsante codice personalizzato
- Incolla il codice personalizzato che hai copiato nel passaggio 1
Come utilizzare contenuti dinamici all'interno del tuo codice personalizzato
Puoi incorporare campi di Collezione nel codice incorporato per estrarre dinamicamente informazioni per vari utilizzi. Scopri di più: Vedi Incorpora dinamici nel Centro assistenza Webflow.
Come modificare l'elemento Codice Incorporato
Ci sono diversi modi per aprire l'editor del codice e modificare il codice in un elemento Codice Incorporato. Puoi:
- Selezionare l'elemento Codice Incorporato sulla tela e fare doppio clic
- Selezionare l'elemento Codice Incorporato sulla tela e premere invio
- Selezionare l'elemento Codice Incorporato sulla tela e cliccare sull'icona delle impostazioni “ingranaggio”
- Selezionare l'elemento Codice Incorporato sulla tela e cliccare su Apri editor del codice nel Pannello delle impostazioni sotto impostazioni Codice Incorporato
Come impostare le dimensioni sull'elemento Code Embed
Se il codice personalizzato all'interno dell'elemento Code Embed non imposta esplicitamente le dimensioni, il contenuto può spesso occupare l'intera larghezza del suo elemento padre. Potresti essere in grado di aggiungere height="100%" width="100%" nel tuo codice personalizzato, il che ti permetterà di regolare la larghezza e l'altezza dell'elemento incorporato e del contenuto dal Style panel.
Come visualizzare in anteprima il contenuto incorporato
Il codice personalizzato racchiuso nei tag <iframe></iframe> o <style> mostrerà un'anteprima sulla tela o all'interno del tuo elemento di testo ricco, ma alcuni codici Embed possono essere visualizzati solo sul sito web live. Ogni volta che un tag viene utilizzato nell'editor di codice, vedrai un segnaposto per quell'elemento nel Designer.
Una volta che visualizzi in anteprima, pubblichi o esporti il tuo sito, lo script e il codice personalizzato all'interno verranno resi dove li hai posizionati.
Tutto il codice qui sarà escluso
Per saperne di più: Vedi Usa .webflow.io come dominio di staging per test e feedback.
FAQ e consigli per la risoluzione dei problemi
Posso usare linguaggi server-side in un elemento Code Embed?
Non puoi integrare linguaggi server-side (ad es., Perl, PHP, Python, Ruby) in un elemento Code Embed. L'elemento Code Embed supporta solo HTML, CSS nei tag <style> e JS nei tag <script>.
Posso aumentare il limite di 50.000 caratteri per l'elemento Code Embed?
Il codice personalizzato nell'elemento Code Embed non può superare i 50.000 caratteri. Se il codice che vuoi incorporare è più lungo, puoi memorizzarlo su un altro server e fare riferimento allo script nel tuo embed. Puoi anche minimizzare il tuo codice personalizzato usando uno strumento di terze parti o suddividere il codice in più elementi Code Embed (a condizione che ciò non interrompa alcuna funzione JavaScript).
Aiuto! Il mio codice personalizzato non funziona!
Controlla che il tuo codice includa i tag di apertura e/o chiusura appropriati e non includa i tag <html>, <body> o <head>.
Da agosto 2020, i nuovi siti pubblicati su Webflow includono jQuery v3.5.1. Importare altre versioni di jQuery con codice personalizzato può causare conflitti e comportamenti imprevisti sul tuo sito. Gli script che influenzano eventi DOM come onClick, onHover, ecc., possono anche causare comportamenti imprevisti.
È importante tenere a mente che il codice personalizzato è una modifica avanzata che può entrare in conflitto con la funzionalità sottostante di Webflow. Pertanto, Webflow non può garantire la funzionalità o la piena compatibilità di alcun codice personalizzato.
Il nostro team di supporto non è in grado di fornire aiuto diretto con la configurazione o la risoluzione dei problemi del codice personalizzato, poiché questi argomenti esulano dall'ambito della nostra politica di supporto clienti. Se incontri problemi con il codice personalizzato, faccelo sapere sul Forum di Webflow, dove l'intera comunità di Webflow (incluso il personale) può fornire ulteriore aiuto e risorse.