Elementor: come aggiungere breadcrumb a un sito web

Elementor: come aggiungere breadcrumb a un sito web

da Passy Guy | Elementor

Ti piacerebbe aggiungere una traccia breadcrumb – Breadcrumbs – a un sito Web Elementor?

Conosciamo tutti la fiaba di Hansel e Gretel, giusto? Due fratelli scomparsi che lasciavano una scia con pezzi di pane per tornare a casa.

Il concetto di breadcrumb del sito Web è praticamente lo stesso. Il breadcrumb mostra fondamentalmente ai visitatori la loro impronta sul sito Web e dice ai tuoi visitatori dove si trovano. Con i breadcrumb, i visitatori possono navigare verso la loro posizione sul sito Web, dove possono tornare al percorso che hanno percorso. In breve, funziona come un browser sul sito Web che migliora l'esperienza dell'utente.

In questo articolo, imparerai di più sui breadcrumb mentre discuteremo Elementor Breadcrumbs Widget, perché usarlo e come usarlo.

Cosa sono i breadcrumb su un sito web?

Il breadcrumb di Elementor è un piccolo percorso di testo che funziona come una bussola virtuale per i siti web. Con questo sistema di navigazione secondario, i visitatori possono tornare alle pagine che hanno navigato.

aggiungi breadcrumb - Breadcrumbs - a un sito Web Elementor

Ad esempio, visiti un negozio online per acquistare un auricolare, ad esempio un iPod. Andrai quindi alla home page, quindi alla pagina degli accessori e infine alla pagina del prodotto. In questo caso il breadcrumb sarà il seguente: Home> Accessori > Auricolari > iPod.

Mostra il percorso che hai percorso fino alla pagina. E ogni sua parte è cliccabile. Ad esempio, se vuoi tornare alla pagina degli accessori, basta cliccare su "Accessori" nel breadcrumb. E andrai alla pagina.

Cosa offre il widget breadcrumb di Elementor?

Il costruttore di siti Web Elementor semplifica l'aggiunta di breadcrumb al tuo sito Web WordPress. Devi solo trascinare e rilasciare il widget e configurarlo. Ci sono alcune straordinarie funzionalità offerte da questo widget.

Questi sono:

Come usare il breadcrumb con Elementor Pro

Il widget breadcrumb di Elementor funziona con il Yoast plugin SEO. Quindi devi prima installare il plug-in Yoast e quindi creare breadcrumb sulla tua pagina web.

Passaggio 1: installa il plug-in Yoast SEO

Accesso a plugin dalla dashboard di WordPress, quindi fai clic sul pulsante Aggiungi. Quindi, cerca Yoast e premi il pulsante di installazione. Una volta installato, attiva il plugin.

Scopri la nostra guida su Come installare un plugin per WordPress

Passaggio 2: configura il breadcrumb dalle impostazioni di Yoast

Dopo aver installato e attivato il plugin, vai su  SEO >> Impostazioni SEO. Quindi passa a " Fil d'Ariane e abilitare il breadcrumb e modificarne l'impostazione.

aggiungi breadcrumb - Breadcrumbs - a un sito Web Elementor

Passaggio 3: aggiungi i breadcrumb alla pagina web

Dopo aver abilitato le impostazioni del breadcrumb, vai alla pagina in cui desideri aggiungere il breadcrumb e apri la pagina con Elementor. Quindi trascina e rilascia il widget nell'editor di Elementor

aggiungi breadcrumb - Breadcrumbs - a un sito Web Elementor

Nel pannello del widget breadcrumb, puoi impostarlo allineamento e scegli il tag HTML nel pangrattato.

Nella scheda Stile breadcrumb, puoi impostarlo tipografiaAllora colore del testo. Hai anche la possibilità di impostare colori individuali per gli stati breadcrumb Normale e Hover.

aggiungi breadcrumb - Breadcrumbs - a un sito Web Elementor

Ecco fatto, ora fai clic sul pulsante Pubblica o Aggiorna per applicare le modifiche.

Perché usare il breadcrumb di Elementor sul tuo sito web

Il breadcrumb di Elementor ti aiuta a dire agli utenti dove si trovano. La traccia breadcrumb è uno strumento essenziale per migliorare l'esperienza dell'utente del tuo sito web e Ottimizzazione del motore di ricerca.

La navigazione breadcrumb ha molti vantaggi.

SEO: Potresti conoscere i visitatori come i breadcrumb, ma lo fa anche Google. Google può utilizzarli nei risultati di ricerca e rende i tuoi risultati molto più attraenti per gli utenti. Inoltre, le parole usate in un breadcrumb possono essere le parole chiave di destinazione del tuo sito web.

Vedi anche: Come aggiungere reCAPTCHA al tuo modulo

Breadcrumb migliora l'UX: La gente odia perdersi. Devi rendere felici i visitatori e ridurre il più possibile l'attrito. Può aiutare la tua esperienza utente in quanto è un elemento dell'interfaccia comune che mostra istantaneamente alle persone una via d'uscita.

Minori frequenze di rimbalzo : Quasi nessuno accede a un sito Web tramite la home page. Riguarda la ricerca organica. Ciò significa che qualsiasi parte del tuo sito Web potrebbe essere un punto di ingresso.

pensiero finale

Il widget Elementor Breadcrumbs semplifica l'aggiunta di breadcrumb al tuo sito Web WordPress. L'ampia gamma di funzionalità di Elementor ti consente di creare breadcrumb personalizzati per migliorare ulteriormente l'esperienza dell'utente.

Ottieni Elementor Pro ora!

Conclusione

Ecco ! Questo è tutto per questo articolo che ti mostra come aggiungere breadcrumb -Breadcrumbs- al tuo sito web. Se hai dubbi su come arrivarci, faccelo sapere all'interno commentaires.

Tuttavia, puoi anche consultare le nostre risorse, se hai bisogno di più elementi per realizzare i tuoi progetti di creazione di siti Internet, consultando la nostra guida su Creazione di blog WordPress o quello acceso Divi: il miglior tema WordPress di tutti i tempi.

Ma nel frattempo, condividi questo articolo sui tuoi diversi social network.

...

Elementor: come aggiungere reCAPTCHA al tuo modulo

Elementor: come aggiungere reCAPTCHA al tuo modulo

da Passy Guy | Elementor

Vuoi aggiungere reCAPTCHA al tuo modulo Elementor?

Uno dei problemi che devi affrontare quando crei un modulo sul tuo sito web è il bot. Fortunatamente, il team di Elementor lo ha capito. Quando crei un modulo sul tuo sito Web WordPress con Elementor, puoi aggiungere reCAPTCHA per proteggere il tuo modulo dai bot.

No, non è necessario installare un plug-in aggiuntivo. Elementor supporta già l'integrazione con reCAPTCHA. Tutto quello che devi fare è connettere il tuo sito web a reCAPTCHA e aggiungere un campo reCAPTCHA al tuo modulo.

Connettere il tuo sito web con reCAPTCHA

Prima di iniziare, supponiamo che tu abbia aggiornato la tua versione gratuita di Elementor alla versione Pro poiché l'integrazione di reCAPTCHA è disponibile solo su Elementor Pro.

Per prima cosa, visita il Sito web reCAPTCHA e fai clic sul pulsante Da console di amministrazione nell'angolo in alto a destra. Accedi con il tuo account Google.

Fare clic sul pulsante più per registrare un nuovo sito Web.

aggiungi reCAPTCHA al tuo modulo Elementor

Inserisci l'etichetta, seleziona il tipo di reCAPTCHA, aggiungi il tuo dominio e accetta tutti i reCAPTCHA, quindi fai clic sul pulsante INVIA.

Un piccolo consiglio. Poiché desideri aggiungere reCAPTCHA a un modulo, ti suggeriamo di selezionare reCAPTCHA v2 -> Casella di controllo "Non sono un robot" . Questa opzione richiede che i tuoi visitatori completino una verifica tramite una sfida prima di convalidare la loro presentazione.

Dopo aver fatto clic sul pulsante CREARE, vedrai la chiave del sito e la chiave segreta. Copia queste chiavi.

Quindi accedi alla dashboard di WordPress e vai a Elementor -> Impostazioni. Cliquez sur la scheda Integrazioni e inserisci la chiave del sito e la chiave segreta nei rispettivi campi. Scorri verso il basso e fai clic sul pulsante Salvare le modifiche.

aggiungi reCAPTCHA al tuo modulo Elementor

Aggiungi reCAPTCHA a un modulo Elementor

Aggiungere reCAPTCHA a un modulo in Elementor è estremamente semplice perché Elementor ha già un campo reCAPTCHA. Per aggiungerne uno, crea un modulo (trascinando il widget Modulo nella casella di modifica di Elementor) o modifica un modulo esistente. Se non hai mai creato un modulo in Elementor prima, puoi leggere questo articolo.

Per aggiungere reCAPTCHA, aggiungi un nuovo campo al modulo facendo clic sul pulsante AGGIUNGI UN ELEMENTO. Imposta il tipo di campo su reCAPTCHA.

Definisci la dimensione e lo stile (chiaro o scuro).

aggiungi reCAPTCHA al tuo modulo Elementor

Ecco. Il modulo proposto da reCAPTCHA è ora pronto per essere pubblicato. Fare clic sul pulsante PUBBLICARE / AGGIORNARE una volta che hai finito di personalizzare il tuo modulo.

Ottieni Elementor Pro ora!

Conclusione

Ecco ! Questo è tutto per questo articolo che ti mostra come aggiungere reCAPTCHA al tuo modulo Elementor. Se hai dubbi su come arrivarci ffacci sapere in commentaires.

Tuttavia, puoi anche consultare le nostre risorse, se hai bisogno di più elementi per realizzare i tuoi progetti di creazione di siti Internet, consultando la nostra guida su Creazione di blog WordPress o quello acceso Divi: il miglior tema WordPress di tutti i tempi.

Ma nel frattempo, condividi questo articolo sui tuoi diversi social network.

...