Trusted WordPress tutorials, when you need them most.
Beginner’s Guide to WordPress
WPB Cup
25 Million+
Websites using our plugins
16+
Years of WordPress experience
3000+
WordPress tutorials
by experts

Come mostrare l’anteprima live dei link in WordPress

Avete mai notato quanto i lettori siano incerti nel fare clic sui link? Le anteprime dei link risolvono questo problema dando ai vostri visitatori un’anteprima di ciò che li aspetta dall’altra parte 💡

Abbiamo visto questa tecnica in siti ricchi di contenuti come i wiki, dove le anteprime visive dei link aiutano i lettori a navigare tra articoli interconnessi in modo più efficiente.

Quando i lettori possono vedere cosa c’è dentro un link prima di fare clic, è più probabile che esplorino i contenuti correlati che li interessano. Inoltre, si evita di fare clic su link che non sono pertinenti alle loro esigenze.

Molti utenti di WordPress ci chiedono come aggiungere belle anteprime dei link senza toccare il codice. Dopo aver testato diverse soluzioni, abbiamo trovato un metodo semplice e senza codice che funziona benissimo per i principianti.

How to Show Live Preview of Links in WordPress

Quando aggiungere un’anteprima dei link sul vostro sito WordPress 🤔

Su un tipico sito web WordPress, i link non mostrano cosa contengono. Questo può frustrare i visitatori che fanno clic su un link e scoprono che non è quello che si aspettavano. È qui che le anteprime live dei link si rivelano utili.

Le anteprime live dei link di solito hanno l’aspetto di un tooltip. Questo elemento di design di WordPress appare quando si passa con il mouse su un link, mostrando un’anteprima del contenuto.

Live link preview example by Wikipedia

Per i negozi online, ciò significa che i link visualizzano immagini dei prodotti o brevi dettagli per aumentare le vendite.

Se gestite un blog WordPress, potete mostrare immagini di anteprima della pubblicazione o un breve testo per invogliare i lettori a vedere di più. Per i link esterni, le anteprime dei tooltip aiutano i lettori a decidere se lasciare il sito.

Tuttavia, bisogna fare attenzione quando si utilizzano le anteprime dal vivo. Troppe possono confondere i visitatori. È meglio usarle solo per i link che importano e che sono più utili.

Tenendo presente questo, vediamo un modo semplice per aggiungere le anteprime dei link dal vivo al vostro sito WordPress. Questo metodo funziona sia che si utilizzi l’editor a blocchi Gutenberg, sia che si utilizzi l’editor classico, sia che si utilizzi il builder del tema. Potete utilizzare i link rapidi qui sotto per navigare in questa guida:

Il modo più semplice per aggiungere un’anteprima del tooltip a un link in WordPress è il plugin Bright Link Previews. Una volta attivato, questo plugin per l’anteprima dei link di WordPress aggiunge automaticamente un’anteprima dal vivo dei link interni ed esterni nelle pagine e nei post.

Per prima cosa, installate il plugin nell’area di amministrazione. Per istruzioni passo passo, potete leggere la nostra guida per principianti su come installare un plugin di WordPress.

Una volta fatto, andare su Impostazioni ” Bright Link. Qui è possibile configurare le impostazioni del plugin.

Bright Links Preview plugin settings page

Per prima cosa, impostiamo il design dell’anteprima dal vivo nella scheda Aspetto .

Bright Links Preview's settings to change colors and size

In alto, è possibile scegliere il colore di sfondo (a sinistra) e il colore del testo (a destra).

È sufficiente fare clic sulla casella del colore e apparirà uno strumento di selettore colore.

Changing the live link preview's tooltip text color in Bright Links Preview

È inoltre possibile scegliere i colori degli hotspot dei prezzi, che appariranno automaticamente per i link eCommerce da siti WooCommerce, Amazon e Shopify.

Come per il tooltip, è sufficiente scegliere il colore di sfondo dell’hotspot a sinistra e il colore del testo a destra.

Sotto c’è “Scegli dimensione”, dove è possibile rendere il tooltip più piccolo o più grande trascinando il punto nella barra di ridimensionamento.

Più è grande, più è facile per gli utenti leggere le informazioni sul link. Detto questo, le dimensioni del tooltip possono influire sull’esperienza dell’utente, quindi assicuratevi di trovare le dimensioni giuste per il design del vostro sito web.

Changing the Bright Links Preview tooltip size

Scorrendo verso il basso, è possibile modificare lo stile del tooltip stesso. Ci sono 3 opzioni predefinite, che possono essere cambiate in seguito.

Una volta soddisfatti dell’aspetto del tooltip, basta fare clic su ‘Salva’ in basso.

Choosing a Bright Links Preview tooltip style

Passare ora alla scheda “Impostazioni”.

Qui è possibile configurare il comportamento delle anteprime live dei link.

Navigating to the Settings page of Bright Links Preview

Bright Links Preview consente di applicare le anteprime dei tooltip nei post, nelle pagine e nei commenti degli utenti, nonché ai link che corrispondono a un selettore JavaScript o a un’immagine.

Abbiamo deciso di aggiungerli solo per le nostre pagine e i nostri post, perché aggiungerli ovunque potrebbe disturbare la nostra esperienza utente.

Un’altra cosa che si può configurare è se mostrare i contatori di clic. Modificando questa impostazione da “no” a “sì”, il tooltip indicherà ai visitatori quanti utenti hanno cliccato sul link su cui si sta facendo il passaggio del mouse.

Activating the Bright Links Preview click counter

Questo può essere utile per i link interni, in quanto può ispirare un senso di FOMO e incoraggiare i visitatori a esplorare ulteriormente il sito web.

Tuttavia, si sconsiglia di abilitare questa caratteristica se si desidera aggiungere anteprime live anche per i link esterni. Potrebbe ritorcersi contro di voi e indurvi ad abbandonare il sito.

A questo proposito, è possibile scegliere se vedere l’anteprima dal vivo sui link interni, sui link esterni o su entrambi.

La scelta dipende dal tipo di sito web che gestite, ma in genere suggeriamo di optare per i soli link interni per aumentare le visualizzazioni delle pagine e ridurre la frequenza di rimbalzo.

Enabling Bright Links Preview for internal links and external links

Poi, si può scegliere di memorizzare nella cache le anteprime per accelerare le prestazioni del sito WordPress.

Se aggiungete le anteprime live ai vostri link esterni, potreste anche forzare questi link ad avere l’attributo target blank, in modo che si aprano in una nuova scheda. Suggeriamo di abilitare questa caratteristica per evitare che gli utenti abbandonino accidentalmente il sito web.

Infine, si può scegliere di disabilitare il tooltip sui dispositivi mobili, in quanto potrebbe creare una scarsa esperienza utente sulle schermate più piccole. Vi consigliamo di testare questa caratteristica e di vedere cosa funziona meglio per il vostro sito web.

Per maggiori informazioni, potete selezionare la nostra guida su come visualizzare il vostro sito web WordPress da mobile a desktop.

Quando si è soddisfatti delle impostazioni dell’anteprima dal vivo, fare clic su “Salva”.

Configuring caching, open in a new tab, and mobile popup settings in Bright Links Preview

A questo punto, si può andare avanti e vedere l’anteprima del sito web per vedere come appare il tooltip.

Ecco come appare il nostro senza il contatore di clic:

Bright Links Preview example

Se si sceglie di aggiungere un contatore di clic, verrà visualizzata una piccola nota che mostra il numero di clic che il link ha ricevuto finora.

La scelta si presenterà come segue:

Bright Links Preview example with the click counter

L’aspetto positivo di Bright Links Preview è che dispone di una caratteristica analitica gratuita che mostra il numero di utenti che hanno fatto clic o anche solo passaggio del mouse sui vostri link.

Questo può essere utile per vedere a quali pubblicazioni è interessata la maggior parte degli utenti o per decidere quali nuovi post mettere in evidenza.

Per vedere questi numeri, basta andare su Impostazioni ” Bright Link dall’amministrazione di WordPress e passare alla scheda “Statistiche”.

Bright Links Preview's statistics feature

Bright Links Preview funziona estraendo automaticamente i metadati dalle pagine e dalle pubblicazioni per creare un’anteprima in tempo reale dei link. In altre parole, la qualità delle anteprime dei link dipende dalla buona impostazione dei metadati.

È possibile aggiungere metadati ai propri articoli utilizzando All in One SEO (AIOSEO), un potente plugin SEO per WordPress. Ha una caratteristica di schema che vi permette di aggiungere facilmente dati strutturati ai vostri contenuti.

Schema Preview in AIOSEO

Oltre ad aiutare Bright Links Preview a creare anteprime migliori, può anche fornire ai motori di ricerca un maggiore contesto su chi siamo, migliorando potenzialmente le prestazioni di WordPress in termini di Anteprima SEO.

Se volete aggiungere il markup schema ai vostri contenuti, potete leggere questi articoli:

Scopri altre caratteristiche del design di WordPress

Volete rendere il design del vostro sito WordPress ancora più interessante? Selezionate queste utili guide:

Speriamo che questo articolo vi abbia aiutato a capire come mostrare le anteprime dal vivo dei vostri link in WordPress. Potreste anche voler consultare il nostro elenco dei migliori builder di pagine trascina e rilascia di WordPress e la nostra guida su come modificare un sito web WordPress.

Se questo articolo vi è piaciuto, iscrivetevi al nostro canale YouTube per le esercitazioni video su WordPress. Potete trovarci anche su Twitter e Facebook.

Disclosure: Our content is reader-supported. This means if you click on some of our links, then we may earn a commission. See how WPBeginner is funded, why it matters, and how you can support us. Here's our editorial process.

Avatar

Editorial Staff at WPBeginner is a team of WordPress experts led by Syed Balkhi with over 16 years of experience in WordPress, Web Hosting, eCommerce, SEO, and Marketing. Started in 2009, WPBeginner is now the largest free WordPress resource site in the industry and is often referred to as the Wikipedia for WordPress.

The Ultimate WordPress Toolkit

Get FREE access to our toolkit - a collection of WordPress related products and resources that every professional should have!

Reader Interactions

8 commentiLeave a Reply

  1. Colin

    Thanks for the article, that plugin has ceased operation and is no longer downloadable, if you had a new suggestion that works I’d greatly appreciate it. The RT Media paid version isn’t up to scratch and there’s not a lot to be found via Google.

    • WPBeginner Support

      Thank you for letting us know, we will be sure to look into updating this article :)

      Admin

  2. Marcus Quiroga

    Hi,

    Is there an update of this function nowadays? I’m trying it on external links at. Does someone could help me with that?

    thank you

  3. Tim Roberts

    How do you get this to on work on specifc links.

    • WPBeginner Staff

      Unfortunately plugin does not have a way to show preview for selective links you can only choose from all, internal, or external links.

      • Bruce Brown

        Select the “class” option, then put the class on the links you want to display.

    • Per Søderlind

      Hi, I’m the plugin author.

      You can get this to work on specific links by adding class=”wp-live-preview” to the link, and in the settings page set ‘Live Preview Links’ to ‘class=”wp-live-preview’. See the demo links on my site.

Leave A Reply

Thanks for choosing to leave a comment. Please keep in mind that all comments are moderated according to our comment policy, and your email address will NOT be published. Please Do NOT use keywords in the name field. Let's have a personal and meaningful conversation.