Questo articolo mostra come fare in modo che pulsanti, link o voci di menu scorrano automaticamente verso sezioni specifiche delle tue pagine web o Funnel. È ideale per migliorare l'esperienza utente e creare una navigazione fluida.
- Cos'è lo Scroll to Element?
- Vantaggi principali dello Scroll to Element
- Miglioramento dello Smooth Scroll
- Configurare lo Scroll to Element
- Domande frequenti
- Articoli correlati
Cos'è lo Scroll to Element?
La funzione scroll-to-element ti consente di collegare qualsiasi elemento cliccabile a una sezione specifica di una pagina. Questo rende le tue pagine più dinamiche e facili da usare, specialmente per le landing page o i contenuti in formato lungo.
Vantaggi principali dello Scroll to Element
Capire come usare le azioni di scorrimento aiuta a semplificare il percorso degli utenti e a creare interazioni fluide.
Controllo della navigazione: Porta gli utenti a sezioni specifiche della pagina senza ricaricarla.
UX più pulita: Aiuta a ridurre il tasso di abbandono guidando gli utenti attraverso i contenuti in modo fluido.
Interazione personalizzata: Funziona con pulsanti, link e menu di navigazione.
Ottimizzato per le CTA: Ideale per pulsanti come "Vai ai prezzi" o "Scopri di più".
Ottimizzato per mobile: Lo scorrimento funziona senza problemi su tutti i dispositivi.
Miglioramento dello Smooth Scroll
Le azioni scroll-to-element ora utilizzano lo scorrimento fluido (smooth scrolling), al posto di salti bruschi della pagina.
Quando gli utenti cliccano su un pulsante, un link testuale o una voce di menu di navigazione configurata con "Scroll to Element", la pagina scorre in modo fluido fino alla sezione selezionata. Questo crea un'esperienza di navigazione più naturale e migliora il flusso visivo, specialmente sulle pagine in formato lungo.
Non è richiesta alcuna configurazione aggiuntiva. Lo smooth scrolling viene applicato automaticamente a tutte le azioni scroll-to-element nei Funnel e nei siti web.
Configurare lo Scroll to Element
Scopri come scorrere verso una sezione specifica utilizzando un semplice metodo di collegamento basato su selettore. Una volta copiato il selettore, puoi usarlo con testi, pulsanti o voci di menu.
Passaggio 1: Copia il selettore CSS
Ogni configurazione di scorrimento inizia con l'ottenimento del selettore della sezione verso cui vuoi scorrere. Incollerai questo selettore alla fine del link nel Passaggio 2.
Apri il tuo Funnel o sito web nel builder.
Clicca sulla sezione verso cui vuoi scorrere.
Nel pannello di destra, vai alla scheda Avanzate (Advanced).
Copia il valore mostrato nel campo CSS Selector.
Passaggio 2: Scegli un metodo di scorrimento
Ora che hai il selettore CSS, scegli uno dei seguenti metodi per attivare il comportamento di scorrimento quando gli utenti cliccano.
Metodo 1: Collegare un testo a una sezione tramite hyperlink
Trasforma il testo in un link cliccabile per lo scorrimento usando il selettore copiato.
Seleziona il testo desiderato.
Clicca sull'icona Link nella barra degli strumenti di formattazione.
- Inserisci l'URL completo della pagina + il selettore CSS copiato. (Esempio: www.tuodominio.com/#section_abc12)
Metodo 2: Usare un pulsante con un link URL
Scorri verso una sezione assegnando un URL diretto a un pulsante.
Seleziona il pulsante nel builder.
In Azioni pulsante (Button Actions), clicca sul menu a tendina Link To e scegli Website URL.
Inserisci l'URL completo della pagina + il selettore CSS copiato. (Esempio: www.tuodominio.com/#section_abc12)
Metodo 3: Usare un pulsante con l'azione Scroll to Element
Scorri verso una sezione utilizzando il comportamento di scorrimento integrato in GoHighLevel / Squadd.
Seleziona il pulsante nel builder.
In Azioni pulsante (Button Actions), clicca sul menu a tendina Link To e scegli Scroll to Element.
Usa il menu a tendina per selezionare la sezione verso cui vuoi che il pulsante scorra.
Metodo 4: Configurare una voce del menu di navigazione per scorrere
Anche i menu di navigazione possono essere configurati per scorrere verso una sezione della pagina.
Seleziona il Menu di navigazione (Navigation Menu).
Clicca sui tre punti accanto a una voce del menu.
Modifica il campo Go to selezionando website URL.
- Inserisci l'URL completo della pagina + il selettore CSS copiato. (Esempio: www.tuodominio.com/#section_abc12)
Clicca su Invia (Submit).
Domande frequenti
D: Posso scorrere tra diversi step di un Funnel?
No. Lo scorrimento funziona solo all'interno della stessa pagina.
D: Funzionerà su mobile?
Sì, la funzionalità di scorrimento funziona su tutti i dispositivi.
D: Lo scorrimento non funziona. Cosa devo fare?
Verifica che il selettore sia corretto e che inizi con #. Aggiorna la pagina e riprova.
D: Cosa succede se più sezioni hanno lo stesso selettore CSS?
Verrà utilizzata solo la prima corrispondenza trovata. Assicurati che ogni destinazione di scorrimento abbia un selettore univoco.