Come aggiungere “facilmente” collegamenti di ancoraggio in WordPress (passo dopo passo)

Come aggiungere “facilmente” collegamenti di ancoraggio in WordPress (passo dopo passo)

Occasionalmente utilizziamo collegamenti di ancoraggio nei nostri post più lunghi di WordPress per aiutare gli utenti a passare rapidamente alla sezione che desiderano leggere.

I link di ancoraggio vengono spesso utilizzati nelle sezioni dell’indice perché aiutano gli utenti a spostarsi su e giù per un articolo più lungo senza dover ricaricare la pagina. Può anche aiutare con la SEO poiché Google potrebbe mostrarli sotto i tuoi elenchi di ricerca per una facile navigazione (ne parleremo più avanti).

In questa guida passo passo, spiegheremo cosa sono i link di ancoraggio e ti mostreremo come aggiungere facilmente link di ancoraggio in WordPress.

Aggiunta di link di ancoraggio in WordPress

Pronto? Cominciamo con un esempio dal vivo di link di ancoraggio.

Di seguito è riportato un elenco di tutti gli argomenti che tratteremo in questa guida. Vai avanti e fai clic su uno di questi collegamenti e verrai indirizzato a quella sezione specifica.

Un link di ancoraggio è un tipo di link sulla pagina che ti porta in un punto specifico della stessa pagina. Consente agli utenti di passare alla sezione a cui sono più interessati.

Dai un’occhiata allo screenshot animato qui sotto:

Anteprima del collegamento di ancoraggio

Come puoi vedere, facendo clic sul collegamento di ancoraggio l’utente viene indirizzato alla sezione specifica della stessa pagina.

I link di ancoraggio sono comunemente usati negli articoli più lunghi come l’indice che consente agli utenti di passare rapidamente alle sezioni che desiderano leggere.

Perché e quando dovresti usare i link di ancoraggio?

Un utente medio trascorre meno di pochi secondi prima di decidere se vuole rimanere o lasciare il tuo sito web. Hai solo quei pochi secondi per convincere gli utenti a rimanere.

Il modo migliore per farlo è aiutarli a vedere rapidamente le informazioni che stanno cercando.

I collegamenti di ancoraggio lo rendono più semplice consentendo agli utenti di saltare il resto del contenuto e passare direttamente alla parte che li interessa. Ciò migliora l’esperienza dell’utente e ti aiuta a conquistare nuovi clienti / lettori.

I link di ancoraggio sono ottimi anche per WordPress SEO. Google può visualizzare un collegamento di ancoraggio nei risultati di ricerca come un “collegamento a un collegamento”.

Vai al collegamento nei risultati di ricerca

A volte Google può anche visualizzare diversi collegamenti da quella pagina come collegamenti ai collegamenti e questo ha dimostrato di aumentare la percentuale di clic nei risultati di ricerca. In altre parole, ottieni più traffico sul tuo sito web.

Salto multiplo ai collegamenti sotto un risultato di ricerca

Detto questo, diamo un’occhiata a come aggiungere facilmente link di ancoraggio in WordPress.

Se vuoi solo aggiungere alcuni link di ancoraggio nel tuo articolo, puoi farlo facilmente manualmente.

Fondamentalmente è necessario aggiungere due cose affinché un testo di ancoraggio funzioni come previsto.

  1. Crea un link di ancoraggio con un segno # prima del testo di ancoraggio.
  2. Aggiungi l’attributo id al testo in cui desideri che l’utente venga portato.

Cominciamo con la parte del collegamento di ancoraggio.

Passaggio 1. Creazione di un collegamento di ancoraggio

Per prima cosa devi selezionare il testo che desideri collegare e quindi fare clic sul pulsante Inserisci collegamento nell’editor Gutenberg di WordPress.

Aggiungi un collegamento in WordPress

Verrà visualizzato il popup di inserimento del collegamento in cui di solito aggiungi l’URL o cerchi un post o una pagina da collegare.

Tuttavia, per un collegamento di ancoraggio, utilizzerai semplicemente # come prefisso e inserisci le parole chiave per la sezione a cui desideri che l’utente salti.

Creazione di un collegamento di ancoraggio

Successivamente, fai clic sul pulsante Invio per creare il collegamento.

Alcuni suggerimenti utili sulla scelta del testo da utilizzare come link di ancoraggio #:

  • Utilizza le parole chiave relative alla sezione a cui ti stai collegando.
  • Non rendere il tuo link di ancoraggio inutilmente lungo o complesso.
  • Usa i trattini per separare le parole e renderle più leggibili.
  • Puoi usare le maiuscole nel testo di ancoraggio per renderlo più leggibile. Ad esempio: # Best-Coffee-Shops-Manhattan.

Dopo aver aggiunto il collegamento, sarai in grado di vedere il collegamento che hai creato nell’editor. Tuttavia, fare clic sul collegamento non fa nulla.

Questo perché i browser non riescono a trovare il collegamento di ancoraggio come ID.

Risolviamolo puntando i browser all’area, alla sezione o al testo che desideri mostrare quando gli utenti fanno clic sul collegamento di ancoraggio.

Passaggio 2. Aggiungere l’attributo ID alla sezione collegata

Nell’editor di contenuti, scorri verso il basso fino alla sezione in cui desideri che l’utente passi quando fa clic sul collegamento di ancoraggio. Di solito è un’intestazione per una nuova sezione.

Quindi, fare clic per selezionare il blocco e quindi nelle impostazioni del blocco fare clic sulla scheda Avanzate per espanderla. Puoi semplicemente fare clic sulla scheda “Avanzate” sotto le impostazioni del blocco dell’intestazione.

HTML Anchor

Dopodiché, devi aggiungere lo stesso testo che hai aggiunto come link di ancoraggio nel campo “Ancoraggio HTML”. Assicurati di aggiungere il testo senza il prefisso #.

Ora puoi salvare il tuo post e vedere il tuo link di ancoraggio in azione facendo clic sulla scheda di anteprima.

E se la sezione che vuoi mostrare non è un’intestazione ma solo un normale paragrafo o qualsiasi altro blocco?

In tal caso, è necessario fare clic sul menu a tre punti nelle impostazioni del blocco e selezionare “Modifica come HTML”.

Modifica come HTML

Ciò ti consentirà di modificare il codice HTML per quel particolare blocco. Devi selezionare trova il tag HTML per l’elemento a cui vuoi puntare. Ad esempio,

se è un pagraph, o

se è un blocco di tabella e così via.

Ora, devi aggiungere la tua ancora come attributo ID a quel tag, come il seguente codice:

Ora vedrai un avviso che questo blocco contiene contenuti imprevisti o non validi. È necessario fare clic sulla conversione in HTML per preservare le modifiche apportate.

Converti in HTML

Come aggiungere manualmente un collegamento di ancoraggio nell’editor classico

Se stai ancora utilizzando il vecchio editor classico per WordPress, ecco come puoi aggiungere il link di ancoraggio.

Passaggio 1. Crea il collegamento di ancoraggio

Innanzitutto, seleziona il testo che desideri modificare nel collegamento di ancoraggio, quindi fai clic sul pulsante “Inserisci collegamento”.

Aggiunta di un collegamento di ancoraggio nell'Editor classico

Successivamente, è necessario aggiungere il collegamento di ancoraggio con un prefisso del segno # seguito dallo slug che si desidera utilizzare per il collegamento.

Passaggio 2. Aggiungere l’attributo ID alla sezione collegata

Il passaggio successivo consiste nel puntare i browser alla sezione che si desidera mostrare quando gli utenti fanno clic sul collegamento di ancoraggio.

Per questo, dovrai passare alla modalità “Testo” nell’editor classico. Dopodiché scorri verso il basso fino alla sezione che desideri mostrare.

Aggiunta dell'ID di ancoraggio nell'Editor classico

Ora individua il tag HTML che desideri scegliere come target. Ad esempio,

,

,

e così via.

Devi aggiungere l’attributo ID ad esso con lo slug del tuo link di ancoraggio senza il prefisso #, in questo modo:

Ora puoi salvare le modifiche e fare clic sul pulsante di anteprima per vedere il tuo collegamento di ancoraggio in azione.

Come aggiungere manualmente collegamenti di ancoraggio in HTML

Se sei abituato a scrivere in modalità Testo del vecchio Editor classico in WordPress, ecco come creeresti manualmente un link di ancoraggio in HTML.

Innanzitutto, devi creare il link di ancoraggio con un prefisso # utilizzando il solito tag , in questo modo:

Le migliori caffetterie di Manhattan

Successivamente, è necessario scorrere verso il basso fino alla sezione che si desidera mostrare quando gli utenti fanno clic sul collegamento.

Di solito, questa sezione è un’intestazione (h2, h3, h4, ecc.), Ma potrebbe essere qualsiasi altro elemento HTML o anche un semplice tag

di paragrafo.

È necessario aggiungere l’attributo ID al tag HTML, quindi aggiungere lo slug del collegamento di ancoraggio senza il prefisso #.

Le migliori caffetterie di Manhattan

È ora possibile salvare le modifiche e visualizzare in anteprima il sito Web per testare il collegamento di ancoraggio.

Questo metodo è adatto per gli utenti che pubblicano regolarmente articoli di lunga durata e hanno bisogno di creare un sommario con link di ancoraggio.

La prima cosa che devi fare è installare e attivare il file Sommario facile collegare. Per maggiori dettagli, consulta la nostra guida passo passo su come installare un plugin per WordPress.

Questo plugin ti consente di generare automaticamente un sommario con link di ancoraggio. Utilizza i titoli per indovinare le sezioni di contenuto e puoi personalizzarlo completamente per soddisfare le tue esigenze.

Dopo l’attivazione, vai semplicemente a Impostazioni »Sommario pagina per configurare le impostazioni del plugin.

Impostazioni del plug-in del sommario facile

Innanzitutto, devi abilitarlo per i tipi di post in cui vuoi aggiungere il sommario. Per impostazione predefinita, il plug-in è abilitato per le pagine, ma puoi abilitarlo anche per i tuoi post.

È inoltre possibile abilitare l’opzione di inserimento automatico. Ciò consente al plug-in di generare automaticamente il sommario per tutti gli articoli, inclusi gli articoli meno recenti che corrispondono ai criteri.

Se desideri generare automaticamente il sommario solo per articoli specifici, puoi lasciare questa opzione deselezionata.

Successivamente, scorri leggermente verso il basso per selezionare dove desideri visualizzare il sommario e quando desideri che venga attivato.

Seleziona dove e quando visualizzare il sommario

È possibile rivedere altre impostazioni avanzate nella pagina e modificarle secondo necessità.

Non dimenticare di fare clic sul pulsante “Salva modifiche” per memorizzare le impostazioni.

Se hai abilitato l’opzione di inserimento automatico, ora puoi visualizzare un articolo esistente con il numero di titoli specificato.

Noterai che il plug-in mostrerà automaticamente un sommario prima del primo titolo dell’articolo.

Se desideri generare manualmente il sommario per articoli specifici, devi modificare l’articolo in cui desideri visualizzare un sommario con collegamenti di ancoraggio.

Nella schermata di modifica del post, scorri verso il basso fino alla scheda “Sommario” sotto l’editor.

Aggiungi manualmente il sommario con collegamenti di ancoraggio

Da qui, puoi selezionare l’opzione “Inserisci sommario” e selezionare le intestazioni che desideri includere come link di ancoraggio.

Ora puoi salvare le modifiche e visualizzare in anteprima il tuo articolo. Il plugin mostrerà automaticamente un elenco di link di ancoraggio come indice dei contenuti.

Anteprima del sommario

Per istruzioni più dettagliate, consulta il nostro articolo su come aggiungere il sommario in WordPress.

Ci auguriamo che questo articolo ti abbia aiutato a imparare come aggiungere facilmente link di ancoraggio in WordPress. Potresti anche voler vedere i nostri suggerimenti su come ottimizzare correttamente i post del tuo blog per la SEO e la nostra selezione dei migliori plugin per la creazione di pagine di WordPress.

Se ti è piaciuto questo articolo, iscriviti al nostro Canale Youtube per i tutorial video di WordPress. Puoi trovarci anche su Twitter e Facebook.

Sono contento che sei arrivato fin qui, puoi tornare alla sezione di guide WordPress.

Write a Comment