SOS WP
  • Blog
  • Risorse
  • Chi siamo
  • Corsi
  • Servizi
    • Creazione Siti Web & Supporto WP
    • Consulenze Professionali
    • Formazione via Skype
    • Richiedi Subito un Preventivo
  • Assistenza WordPress
  • Menu

Apri l'indice dei contenuti

  • Aggiungere salti di pagina con i codici HTML
    • Step 1: aggiungi l’ID all’elemento di destinazione
    • Step 2: inserisci il link
    • Conclusione

Categorie:

  • Ispirazione
  • Usare WordPress
  • Dominio e Hosting
  • Creare blog
  • Creare siti web
  • eCommerce
  • Temi
  • Plugin
  • SEO
  • Tutte

  • Creare siti multlingua
  • Copywriting
  • Dove trovare immagini
  • Email marketing
  • Guadagnare online
  • Varie

CATEGORIE

  • Ispirazione
  • Usare WordPress
  • Dominio e Hosting
  • Creare blog
  • Creare siti web
  • eCommerce
  • Temi
  • Plugin
  • SEO
  • Creare siti mulitlingua
  • Copywriting
  • Dove trovare immagini
  • Email marketing
  • Guadagnare online
  • Varie

Comincia qui per avere la soluzione al tuo problema

Background Icons
Aggiungere salti di pagina ai contenuti
Sei qui:
  • Home /
  • Blog /
  • Come usare WordPress

Come aggiungere salti di pagina ai contenuti su WordPress

Andrea Di Rocco 07 Marzo 2017
48

Apri l'indice dei contenuti

  • Aggiungere salti di pagina con i codici HTML
    • Step 1: aggiungi l’ID all’elemento di destinazione
    • Step 2: inserisci il link
    • Conclusione

Aggiungere salti di pagina a pagine e post su WordPress è una soluzione molto semplice, ma anche veramente efficace.

Se non sai esattamente cos’è un salto di pagina, dai un’occhiata alla nostra guida su come guadagnare online. All’inizio abbiamo creato un indice del post, così che questo sia facilmente navigabile. Cliccando su una voce dell’indice, gli utenti possono saltare alla sezione desiderata. 

Alla fine di questa guida, potrai aggiunge salti di pagina anche sul tuo sito, senza dover installare alcun plugin aggiuntivo o fare modifiche al tuo tema!

Se sei interessato ad approfondire questo aspetto, il modulo HTML e CSS del nostro video corso WordPress possono aiutarti a padroneggiare questi due linguaggi e permetterti di personalizzare al massimo il tuo sito web.

Aggiungere salti di pagina con i codici HTML

Aggiungere salti di pagina è molto semplice. È sufficiente fare due cose:

  • step 1: aggiungere un ID all’elemento sul quale vuoi portare l’utente (per esempio, un sottotitolo, un paragrafo, una lista puntata, eccetera)
  • step 2: aggiungere all’interno del contenuti un link che porta all’elemento a cui è stato assegnato l’ID.

Per prima cosa, devi accedere la pagina o il post in questione, e modificare il contenuto in modalità Editore di Testo. 

Non farti spaventare dai codici che vedi nell’Editore di Testo, si tratta di semplice HTML.

Vuoi imparare le basi dell’HTML? Leggi la nostra guida introduttiva all’HTML per chi usa WordPress.

Leggi guida

Step 1: aggiungi l’ID all’elemento di destinazione

Per prima cosa, individua l’elemento dove vuoi che l’utente sia portato quando ‘fa un salto di pagina’. Per esempio, potrebbe essere un sottotitolo di misura H2.

Il codice sarebbe questo:

<h2>Questo è il sottotitolo</h2>

Dobbiamo ora aggiungere un ID a questo elemento. Semplicemente, modifichiamo il codice HTML in questo modo:

<h2 id="salto-pagina-destinazione">Questo è il sottotitolo</h2>

Tra le virgolette di id=”” , puoi aggiungere qualunque ID a tua scelta! Non puoi però usare lettere accentate e altri caratteri speciali.

Step 2: inserisci il link

È arrivato il momento di aggiungere il link interno al contenuto, che di fatto farà ‘fare il salto’ all’elemento di destinazione.

Per prima cosa, identifica in quale parte del testo vuoi inserire il link. Per esempio, potrebbe essere una frase del tipo Clicca qui per andare al sottotitolo.

Aggiungi un link come fai di solito; però invece di inserire un normale url digita un cancelletto, seguito immediatamente dall’ID che hai associato all’elemento scelto nello step 1. 

inserimento url salto pagina

Ecco un esempio funzionante:

Ora cliccando qui, sarai portato all’inizio del post 😉

Migliori risorse WordPress

Conclusione

Riassumendo, ciò che devi fare è modificare il tag HTML dell’elemento di destinazione aggiungendo un ID. Quindi, inserire un link al testo con l’ID preceduto dal simbolo del cancelletto. 

Tutto qui! Come vedi, aggiungere salti di pagina ai contenuti su WordPress è molto semplice, ed anche utile.

Se hai domande, puoi come sempre lasciare un commento qui sotto al post. Ti risponderemo al più presto.

Tags: Bloggingcontenuti-sitoCreare sito webCreare un blogUsare WordPress
Lascia un Commento

Andrea Di Rocco

Fondatore di SOS WP, Autore

First Badge Item Second Badge Item Third Badge Item
La mia passione per WordPress mi ha portato negli ultimi 10 anni a voler aiutare sempre più persone a creare blog e siti web in WordPress in completa autonomia. Spero che troverai utili le oltre 650 guide su WordPress e sulla SEO che ho pubblicato su questo blog e se ne hai voglia ti invito a leggere la mia storia cliccando sul pulsante qui sotto.
Leggi la mia storia
Corso SEO di SOS WP
Ti potrebbe interessare:
Come creare una favicon in WordPress
Creare una favicon WordPress: la guida completa13 July 2018
Come creare un logo: i migliori strumenti gratis e a pagamento
Come creare un logo: i migliori strumenti gratis e a pagamento16 November 2017
Intervista a Flavia di Misya.info
Intervista a Flavia Imperatore di Misya.info: come creare uno dei blog di cucina più famosi in Italia20 December 2018
Eliminare una pagina in rispetto della SEO
Come eliminare una pagina del tuo sito WordPress in rispetto della SEO01 March 2019
Basi WordPress: come usare il pannello "Personalizza"
Basi WordPress: come usare il pannello "Personalizza"24 May 2018
Cosa sono i permalink
Cosa sono i permalink15 January 2021
48 commenti

Lascia un commento
  1. Massimo
    Massimo dice:
    23 Gennaio 2021 alle 6:30 pm

    Ciao Andrea, ho acquistato Enfold per impaginare un sito per una agenzia di viaggi online. Ho creato un megamenu e vorrei che le sottovoci puntassero direttamente in punti precisi di altre pagine, si può fare?

    Rispondi
    • SOS WP Team
      SOS WP Team dice:
      25 Gennaio 2021 alle 8:35 am

      Ciao Massimo, dovresti creare le ancore nelle pagine, come spiegato in questo articolo, assegnando un id al punto preciso della pagina. Nel menu, poi, dovrai inserire l’URL della pagina seguito dall’ancora, ad esempio miosito.it/mia-pagina/#mio-id. Restiamo a disposizione, un saluto!

      Rispondi
  2. ilaria
    ilaria dice:
    19 Gennaio 2021 alle 4:45 pm

    Grazie mille per i tuoi preziosi consigli sto pensando di fare un blog e mi sto documentando in merito. Grazie ancora

    Rispondi
    • SOS WP Team
      SOS WP Team dice:
      21 Gennaio 2021 alle 9:00 am

      Ciao Ilaria, grazie a te, continua a seguirci e buon lavoro!

      Rispondi
  3. Sara
    Sara dice:
    4 Gennaio 2021 alle 8:51 am

    Ciao, sto provando ad utilizzare i salti di pagina seguendo le vostre istruzioni, ma sembra non stia funzionando.
    La stringa del testo in cui ho inserito il link interno è la seguente: Mare a Tortoreto Lido
    Mentre la stringa della porzione di testo a cui vorrei rimandare è la seguente:
    Tappa di mare a Tortoreto Lido

    E vorrei fare la stessa cosa ripetuta su più paragrafi: ho un elenco all’inizio del post, e per ciascuna voce vorrei rimandare al paragrafo di riferimento.

    Riuscite a farmi sapere come posso risolvere? Grazie mille in anticipo per il vostro supporto
    Sar

    Rispondi
    • SOS WP Team
      SOS WP Team dice:
      4 Gennaio 2021 alle 10:01 am

      Ciao Sara, hai inserito id=”tortoreto” al titolo del paragrafo verso quale vuoi rimandare? Che editor stai utilizzando (Classic Editor, Editor a blocchi, page builder…)?

      Rispondi
      • Sara
        Sara dice:
        8 Gennaio 2021 alle 9:53 am

        Ciao e grazie per la risposta.
        Sì ho inserito id=”tortoreto” al titolo del paragrafo verso cui vorrei fare il salto di pagina. Sto modificando con editor del codice

        Rispondi
        • SOS WP Team
          SOS WP Team dice:
          8 Gennaio 2021 alle 10:58 am

          Sembrerebbe tutto corretto, bisognerebbe dare un’occhiata dall’interno per capire cosa non sta funzionando. Contatta la nostra Assistenza WordPress e ti aiuteremo a capire dov’è il problema.

          Rispondi
          • Sara
            Sara dice:
            8 Gennaio 2021 alle 12:59 pm

            Ok, grazie, ho fatto come suggerito.

  4. Sara
    Sara dice:
    1 Dicembre 2020 alle 5:03 pm

    Ciao, grazie per la guida, vorrei applicare questi consigli all’interno di una pagina molto corposa, ma sembra non stia funzionando: quando provo a modificare il codice del sottotitolo, inserisco esattamente la stringa indicata da voi, ma quando torno in modalità visuale si modifica da sola in questo modo: id=”gransasso”>Parco Nazionale del Gran Sasso e Monti della Laga
    si aggiunge da solo il &gt, che impedisce il funzionamento del link. Come posso risolvere? Grazie mille per una vostra risposta

    Rispondi
    • SOS WP Team
      SOS WP Team dice:
      3 Dicembre 2020 alle 1:38 pm

      Ciao Sara, assicurati di inserire l’id all’interno del tag. Ad esempio, <h2 id=”gransasso”>Parco Nazionale. Se non riesci a risolvere, scrivici tutta la stringa e vediamo dove si trova l’errore. A presto!

      Rispondi
  5. virginia
    virginia dice:
    29 Novembre 2020 alle 2:49 pm

    Ciao, come posso fare per inserire la X per chiudere una schermata o mettere il TORNA INDIETRO?

    Rispondi
    • SOS WP Team
      SOS WP Team dice:
      30 Novembre 2020 alle 10:20 am

      Ciao Virginia, puoi spiegare meglio il tuo problema? Non è chiaro quale schermata intendi chiudere, dato che in questo articolo si parla di navigazione all’interno della stessa pagina. Se hai bisogno di un pulsante che permette di ritornare all’inizio della pagina, puoi verificare se è una funzionalità presente nel tuo tema, oppure usare il plugin WPFront Scroll Top. Restiamo a disposizione!

      Rispondi
  6. lele
    lele dice:
    20 Novembre 2020 alle 2:29 pm

    Buongiorno, sono un graphic designer, sto creando il mio sito, usando elementor con wordpress, sotto la prima sezione vorrei mettere un icona freccetta che premendo scenda alla sezione successiva, mi dica dove sbaglio, nella freccetta metto CSS ID : #sezione, nella sezione sotto, nel CSS iD scrivo solo sezione, cosa sbaglio ? grazie

    Rispondi
    • SOS WP Team
      SOS WP Team dice:
      23 Novembre 2020 alle 2:36 pm

      Ciao Lele, i link sulla stessa pagina sono costruiti con l’HTML e non con il CSS. La freccetta dovrebbe essere un link con href=”#sezione”, mentre la sezione (ad esempio, il div) deve avere un attributo id=”sezione”. Contatta la nostra Assistenza WordPress se non riesci a risolvere. Un saluto!

      Rispondi
  7. Monteriano
    Monteriano dice:
    21 Ottobre 2020 alle 10:00 am

    Buongiorno, sto spostando un sito vecchio su wordpress. Ho una pagina che ha una immagine con una maps che contiene tanti link a seconda di dove viene puntato il mouse sull’immagine stessa. Come potrei mettere una mappa di link sull’immagine, per poi inserire anche l’id per fare “il salto” anche su wordpress? Vi ringrazio!

    Rispondi
    • SOS WP Team
      SOS WP Team dice:
      26 Ottobre 2020 alle 9:23 am

      Ciao, ti consigliamo di testare questo plugin per creare una Google map dinamica, in cui impostare i link ai luoghi di interesse: https://wordpress.org/plugins/wp-google-maps/. Un saluto!

      Rispondi
  8. Gianluca
    Gianluca dice:
    24 Settembre 2020 alle 9:51 am

    Ciao, ottimo suggerimento, la soluzione proposta per aggiungere “salti di pagina” è molto semplice quanto interessante e, cosa da non sottovalutare, in questo modo si può evitare di installare un plugin per la table of contents.

    Rispondi
    • SOS WP Team
      SOS WP Team dice:
      24 Settembre 2020 alle 9:55 am

      Grazie Gianluca, siamo felici di sapere che la guida ti è stata utile 🙂

      Rispondi
  9. Giusy La Lumia
    Giusy La Lumia dice:
    25 Maggio 2020 alle 9:27 pm

    E se volessi creare un ancoraggio in un punto preciso di un’altra pagina?

    Rispondi
    • SOS WP Team
      SOS WP Team dice:
      26 Maggio 2020 alle 10:50 am

      Ciao Giusy, valgono le stesse istruzioni contenute nel post. Un saluto!

      Rispondi
      • davide
        davide dice:
        28 Agosto 2020 alle 6:37 pm

        Inserendo anche l’URL della pagina prima del cancelletto. Ciao!

        Rispondi
  10. Valerio
    Valerio dice:
    6 Maggio 2020 alle 6:55 am

    Ciao, è possibile creare ancore alla stessa pagina ma dal menu principale a mò di sito “One Page”? Come fare?
    Grazie

    Rispondi
    • SOS WP Team
      SOS WP Team dice:
      6 Maggio 2020 alle 9:17 am

      Certamente Valerio, è possibile. Puoi seguire le stesse indicazioni della guida per realizzarlo.

      Rispondi
  11. cle
    cle dice:
    1 Maggio 2020 alle 7:08 am

    perfetto, grazie!
    era tanto che volevo inserire degli indici nelle mie pagine più corpose e mi son sempre meravigliata che WP non avesse un “blocco” apposito.
    In realtà ho anche appena scoperto che tra gli attributi avanzati dei titoli nell’editor a blocchi c’era l’anchor ma senza il tuo tutorial non lo avrei comunque scoperto.
    Ecco come l’ho implementato nella mia pagina FAQ https://lericettedicle.com/trucchi-e-consigli/

    Rispondi
  12. Mauro
    Mauro dice:
    8 Aprile 2020 alle 1:25 pm

    Buongiorno,
    sto completando ora il mio sito e cercando una risposta ho trovato questa guida, ma non corrisponde esattamente (credo) a ciò che sto cercando. Mi spiego: vorrei che un bottone con testo “clicca qui”, inserito in varie pagine del sito, reindirizzi ad uno specifico blocco in home page (non “alla home”). É possibile?

    Rispondi
    • SOS WP Team
      SOS WP Team dice:
      9 Aprile 2020 alle 11:58 am

      Ciao Mauro, in realtà non cambia molto. Quando vuoi collegarti a una “parte” di pagina, puoi sempre aggiungere un hashtag (#) e un ID per collegarti direttamente all’elemento stesso, mediante link.

      Rispondi
      • Mauro
        Mauro dice:
        29 Aprile 2020 alle 9:52 am

        Scusate, non avevo visto la risposta. Ho provato, ma non funziona. Nel vostro esempio si torna in cima alla pagina, io devo indirizzare ad un’altra pagina, in un blocco specifico. Cosa sbaglio?

        Rispondi
        • SOS WP Team
          SOS WP Team dice:
          29 Aprile 2020 alle 1:22 pm

          Hai inserito correttamente l’ID? controlla anche di avere eseguito i passaggi, secondo questa guida che parla proprio di due pagine differenti: http://learningcms.com/link-wordpress-page-to-another-page-specific-location/

          Rispondi
          • Mauro
            Mauro dice:
            29 Aprile 2020 alle 2:41 pm

            In teoria sì, ora provo seguendo la guida, anche se sto usando Elementor e quindi non so se è la stessa cosa.

  13. VALE
    VALE dice:
    30 Gennaio 2020 alle 1:35 pm

    Ciao, il mio problema con il salto è mi sa insolito. Fino ad ora l’ho effettuato in più pagine correttamente. E’ da ieri che sto cercando di farlo in una pagina, e fin’ora soltanto un titolo lo vede valido. Questo è il link: https://stiledivitanaturale.altervista.org/integratori-contenenti-inositolo/. Ciao buona giornata

    Rispondi
    • SOS WP Team
      SOS WP Team dice:
      1 Febbraio 2020 alle 10:28 am

      Ciao, hai pulito la cache del browser?

      Rispondi
      • vale
        vale dice:
        9 Febbraio 2020 alle 7:29 pm

        ciao, si ho provato proprio adesso, non ho avuto la notifica del tuo commento, ancora ho questo problema. Ho pulito la cache di chrome

        Rispondi
  14. Daniele
    Daniele dice:
    20 Ottobre 2019 alle 1:38 pm

    Aggiungo un dettaglio: mentre su pc mi salta in automatico un paio di righe (nascoste sempre dal menu del sito); su smartphone, in modalità mobile funziona, mentre in modalità desktop funziona fino a quando non si toglie totalmente lo zoom (in pratica, rimpicciolito al massimo, dà lo stesso problema, altrimenti va per come dovrebbe andare).

    Grazie per l’eventuale aiuto.

    Rispondi
    • SOS WP Team
      SOS WP Team dice:
      21 Ottobre 2019 alle 10:16 am

      Ciao Daniele, puoi darci un link per visualizzare il problema? Un saluto!

      Rispondi
  15. Leonardo
    Leonardo dice:
    16 Agosto 2019 alle 4:26 pm

    Grazie per la lineare e semplice spiegazione.
    Ti volevo chiedere però se questo link valesse anche tra due differenti pagine dello stesso sito. Mi spiego meglio: in caso di una pagina particolarmente lunga ho suddiviso il contenuto in quattro pagine grazie al blocco “interruzione di pagina”. Ho provato a collegare le pagine seguenti ad un indice posto nella prima pagina (un table of contents), ma ciò non sortisce “il salto” sperato. Ho sbagliato qualcosa io oppure queste “ancore” funzionano soltanto all’interno di una sola pagina senza interruzioni?
    Grazie in anticipo

    Rispondi
  16. Tiziano
    Tiziano dice:
    27 Maggio 2019 alle 7:25 pm

    Perfetto grazie, ha funzionato benissimo.

    Rispondi
    • Team
      Team dice:
      28 Maggio 2019 alle 11:36 am

      Ottimo Tiziano!

      Rispondi
  17. SIMONE
    SIMONE dice:
    16 Febbraio 2019 alle 2:34 pm

    Ciao Chiara, ho seguito alla lettera le tue istruzioni, ma col mio tema Awaken non riesco a farle funzionare. Quando cerco di inserire il # con il nome dell’ancora, non trova la destinazione.

    Rispondi
    • Team
      Team dice:
      17 Febbraio 2019 alle 3:29 pm

      Quindi, la pagina non scrolla? Che comportamento ha?

      Rispondi
      • SIMONE
        SIMONE dice:
        17 Febbraio 2019 alle 8:35 pm

        Ciao! Quando digito il nome dell’ancora (ad esempio: #esempio) nel box che si apre cliccando su “inserisci link”, non trova la destinazione. Il testo viene visualizzato come link, cioè blu e sottolineato, ma di fatto non funziona.

        Rispondi
        • Team
          Team dice:
          18 Febbraio 2019 alle 11:03 am

          Fai un altro test, usando un plugin specifico come il seguente per inserire l’ancora nel contenuto.

          Rispondi
  18. Massimiliano
    Massimiliano dice:
    3 Dicembre 2018 alle 12:22 pm

    Ciao Chiara, utilizzo da molto le ancore, ma una cosa che mi sono sempre chiesto è:
    ho una navbar fissa sul top della pagina, e quando clicco sull’ancora il titolo rimane sempre nascosto,.. come posso ovviare a questo?

    Rispondi
    • Team
      Team dice:
      3 Dicembre 2018 alle 3:57 pm

      Ciao Massimiliano, che tema stai utilizzando?

      Rispondi
      • Massimiliano
        Massimiliano dice:
        4 Dicembre 2018 alle 12:32 pm

        Un tema custom… è un problema?

        Rispondi
        • Team
          Team dice:
          4 Dicembre 2018 alle 6:22 pm

          No, solo che dovremmo vedere direttamente il sito per capire meglio l’origine di questo comportamento.

          Rispondi
          • Daniele
            Daniele dice:
            20 Ottobre 2019 alle 12:45 pm

            Ciao, anche io ho il problema del ‘titolo nascosto’ per ogni paragrafo cliccato.

            Uso colormag come tema wordpress, ma il problema è lo stesso.

            Come posso ovviare a quest’ultimo?

Domande? Lascia un commento!

Il team di SOS WP risponde tutti i giorni. Unisciti anche tu alla conversazione…

Lascia un commento Annulla risposta

Il tuo indirizzo email non sarà pubblicato. I campi obbligatori sono contrassegnati *

Andrea Di Rocco - Autore di SOS WP

Benvenuto!

Sono Andrea Di Rocco, autore di SOS WP, il blog italiano su WordPress che contiene oltre 650 guide su come creare blog e come creare siti web che generano traffico, contatti e vendite! Oltre al blog, forniamo:

Assistenza WordPressAssistenza WordPress

Creazione siti webCreazione siti web

Corso WordPressCorso WordPress

Servizi

  • Creazione blog professionali
  • Realizzazione siti web
  • Messa a norma GDPR
  • Consulenza SEO
  • Formazione WordPress
  • Chiedi un preventivo

LINK RAPIDI

  • Scopri TUTTO SEO™
  • Entra in Area Corsi
  • Gruppi Facebook
  • Testimonianze
  • Contattaci
  • Lavora con noi

Vuoi creare un blog? Non sai come muoverti nel mondo di WordPress? Desideri essere primo su Google con il tuo sito web?

Richiedi Preventivo

  • Safe Payment IconPagamenti sicuri con:
    Maestro IconVisa IconMastercard IconPaypal Icon e altri…
  • Support IconSupporto continuo dal Lunedì al Venerdì 08:30 – 18:30
SOS WP
  • Chi Siamo
  • Chi è Andrea Di Rocco
  • TUTTO SEO™
  • TrustPilot
  • Privacy e Cookie Policy
  • Facebook
  • Youtube
  • Linkedin
 

© Copyright 2012-2021 | SOS WP™ Metro Effort Limited. Tutti i diritti sono riservati.

 
Scorrere verso l’alto
SOS WP utilizza i cookie per migliorare la tua esperienza: ACCETTOImpostazioni
Privacy & Cookies Policy

Panoramica sulla privacy

Quando si visita qualsiasi sito web, questo può memorizzare o recuperare informazioni sul tuo browser, in gran parte sotto forma di cookie. Queste informazioni potrebbero essere su di te, le tue preferenze o il tuo dispositivo e sono utilizzate in gran parte per far funzionare il sito come te lo aspetteresti. Le informazioni di solito non ti identificano direttamente, ma possono fornire un'esperienza web più personalizzata. Poiché rispettiamo il tuo diritto alla privacy, puoi scegliere di non consentire alcuni tipi di cookie. Clicca sulle intestazioni delle diverse categorie per scoprire di più e modificare le impostazioni predefinite. Tuttavia, il bloccaggio di alcuni tipi di cookie può avere impatto sulla tua esperienza del sito e dei servizi che siamo in grado di offrire.
Maggiori informazioni
Cookie di terze parti
Salva e accetta