Aggiungere codice personalizzato al sito

Migliora lo stile e l'aspetto del tuo sito utilizzando competenze di codifica avanzate.

Ultimo aggiornamento 3 gennaio 2025

Per creare un sito Web su Squarespace non è necessario essere esperti di programmazione o di design. Quando aggiungi un blocco, stai aggiungendo HTML al tuo sito senza scrivere il codice. Allo stesso modo, quando apporti modifiche di stile, modifichi automaticamente il codice CSS del tuo sito. La piattaforma Squarespace è potente e flessibile e consente di risolvere la maggior parte dei problemi di design con le opzioni di stile integrate.

Per personalizzare ulteriormente il sito, puoi utilizzare codice personalizzato. È consigliabile avere competenze di codifica prima di aggiungere codice personalizzato. Considera che alcune modifiche con codice personalizzato entreranno in conflitto con il codice di base del tuo sito e potresti avere difficoltà a definirne lo stile.

L'aggiunta di codice al sito è considerata una modifica avanzata che non rientra nell'ambito di assistenza di Squarespace. Se possiedi competenze di programmazione e hai bisogno di ulteriore aiuto, visita Squarespace Forum. Se hai creato almeno tre siti attivi, puoi unirti a Squarespace Circle, una comunità di professionisti in ambito creativo che possiedono le competenze per rispondere a quesiti di carattere più tecnico. Se non disponi di competenze di programmazione ma vuoi comunque aggiungere del codice personalizzato al tuo sito, prendi in considerazione la possibilità di affidare l'incarico a uno Squarespace Expert.

Guarda un video

Modi per aggiungere codice personalizzato

Squarespace supporta l'aggiunta di codice lato client al tuo sito. Le opzioni dipendono dal tuo piano. Tutte le opzioni sono disponibili durante una prova:

Opzione Piano Codice supportato Chi siamo
Blocco codice (Base) Tutti i piani

CSS
HTML
Markdown

Aggiungi codice a una pagina specifica per modificarne il layout o il design.
Blocco codice (Avanzato) Piani Business e Commerce

CSS
HTML
iframe
JavaScript
Markdown

Aggiungi codice a una pagina specifica per modificarne il layout o il design.
Iniezione di codice Piani Business e Commerce

HTML
JavaScript

Aggiungi codice che influisce sull'intero sito o su una singola pagina, come il Pixel di Facebook o i servizi di chat live.
Editor CSS Tutti i piani

CSS (Cascade Style Sheet)

Modifica tipi di carattere, colori e sfondi.
Blocco Embed Tutti i piani

HTML
JavaScript

Incorpora contenuto da siti esterni che utilizzano lo standard oEmbed.
Piattaforma sviluppatore Squarespace Solo versione 7.0 per i piani Business e Commerce

CSS
HTML
JavaScript
Markdown

Accedi all'intero codice di base del tuo modello versione 7.0, crea modelli personalizzati e smetti di ricevere gli aggiornamenti per il modello da Squarespace.

Squarespace non supporta il codice lato server, inclusi PHP, Ruby, Ruby on Rails e SQL.

Differenza tra Blocchi codice e Blocchi Embed

Il Blocco Embed estrae il contenuto da siti e servizi esterni che utilizzano lo standard oEmbed. Puoi utilizzare il Blocco Embed per mostrare contenuti di base di terze parti sul tuo sito, ad esempio un post su Facebook o un video di un host non supportato da Squarespace.

Se hai un codice più avanzato e personalizzabile, il Blocco codice è la scelta migliore. È versatile e può eseguire il rendering del codice in HTML e Markdown. Puoi anche usarlo per visualizzare snippet di codice. I Blocchi codice vengono solitamente utilizzati per personalizzazioni basate su codice quali:

  • Incorporare documenti attraverso un servizio come Issuu
  • Aggiungere una ricerca MLS

HTML, JavaScript e CSS

Scopri di più su questi tipi comuni di codice personalizzato che puoi aggiungere al tuo sito.

HTML

Il codice utilizzato per aggiungere contenuto a una pagina Web. Quando aggiungi un blocco, stai aggiungendo codice HTML al tuo sito.

JavaScript

Il codice utilizzato per aggiungere delle funzioni interattive a una pagina Web. JavaScript agisce dietro le quinte per permettere il funzionamento di elementi come slideshow, cursori e lightbox.

CSS (Cascade Style Sheet)

CSS è il linguaggio di codifica utilizzato per definire lo stile e il design di una pagina Web scritta in HTML. Tutti i modelli Squarespace sono dotati di codice CSS integrato e dispongono di tweak e opzioni di stile. Quando apporti modifiche in Stili sito, stai modificando il codice CSS del tuo sito. Se decidi di applicare codice CSS personalizzato al tuo sito, ti consigliamo di utilizzarlo con moderazione.

Puoi utilizzare l'editor CSS per personalizzare:

  • Tipo di carattere
  • Colori
  • Sfondi

Non dovresti utilizzare il codice CSS per personalizzare:

  • Padding
  • Margini
  • Elementi Float
  • Dimensioni (blocchi, immagini o banner)
  • Posizionamento

Il codice CSS personalizzato ha un limite di 128.000 caratteri.

La Piattaforma sviluppatore Squarespace (solo versione 7.0)

Se sei un utente esperto della versione 7.0, con la Piattaforma sviluppatore Squarespace puoi accedere al codice di base del modello del tuo sito. La piattaforma, progettata per sviluppatori e agenzie di design, ti consente di modificare i modelli esistenti o persino crearne di totalmente nuovi.

Se non riesci a incollare il codice personalizzato

Se non riesci a incollare il tuo codice, prova a utilizzare i tasti di scelta rapida. Clicca nell'area che desideri incollare e premi:

PC Mac
Ctrl + V Comando + V

Se il codice personalizzato non viene visualizzato

Se il codice personalizzato non viene visualizzato, aggiorna il browser. Se questo non aiuta, potrebbe essere perché:

  • Hai eseguito l'accesso - Come misura di sicurezza, il codice aggiunto in un Blocco codice potrebbe non essere visualizzato quando esegui l'accesso al tuo sito, anche se i visitatori possono vederlo. Ciò accade quando provi a visualizzare codice JavaScript incorporato utilizzando una connessione sicura (https://). Per verificare, visita il tuo sito in un browser in incognito.
  • Il codice si trova in una Pagina Indice - Il codice potrebbe non essere visualizzato se aggiunto a una pagina all'interno di un Indice. Per verificare, rimuovi la pagina dall'Indice all'interno del pannello Pagine, quindi visita il tuo sito in un browser in incognito.
  • Hai abilitato il caricamento Ajax: occasionalmente, Ajax può entrare in conflitto con il codice personalizzato incorporato, le personalizzazioni basate sul codice, i link di ancoraggio e i reindirizzamenti URL. Per risolvere il problema, prova a disabilitare il caricamento Ajax.

Se riscontri ancora dei problemi, contatta il servizio che ti ha fornito il codice poiché lo conoscono meglio e sanno come funziona. Il codice di terze parti non rientra nell'ambito dell'assistenza Squarespace, quindi non possiamo aiutarti ulteriormente nella risoluzione di questi problemi.

Se si visualizza un errore CORS

Se usi JavaScript per effettuare richieste con un browser, vedrai un errore CORS (Cross Origin Resource Sharing). Tutte le richieste devono provenire da un'applicazione lato server. Non supportiamo le richieste CORS. Non forniamo assistenza per le richieste CORS.

Risorse di codifica

Di seguito alcuni siti conosciuti ed attendibili che consigliamo per tutorial, risoluzione dei problemi e guide di riferimento:

Nota

il codice personalizzato non rientra nell'ambito della nostra assistenza. Ciò significa che non possiamo fornire ulteriore assistenza in relazione alla configurazione o alla risoluzione dei problemi. Inoltre, non possiamo garantire la funzionalità o la completa compatibilità del codice inserito con Squarespace. Ciò include il modo in cui funziona con il nostro responsive design, soprattutto relativamente all'aspetto sui dispositivi mobili e al funzionamento su tutti i modelli. Le personalizzazioni CSS possono anche causare problemi di visualizzazione con i futuri aggiornamenti della nostra piattaforma. Pur non potendo offrire ulteriore assistenza, esistono diverse risorse per indicarti la giusta direzione da seguire:

Footer Image
  • Ricevi assistenza dalla nostra community

  • Ricevi assistenza dalla nostra community in merito alle personalizzazioni avanzate.

  • Affidati a uno Squarespace Expert

  • Fatti notare online con l'aiuto di un designer o di uno sviluppatore esperto.