{"id":366107,"date":"2022-11-19T15:54:00","date_gmt":"2022-11-19T12:54:00","guid":{"rendered":"https:\/\/themewp.inform.click\/?p=366107"},"modified":"2023-01-20T19:09:34","modified_gmt":"2023-01-20T16:09:34","slug":"come-creare-unintestazione-appiccicosa-in-wordpress","status":"publish","type":"post","link":"https:\/\/themewp.inform.click\/it\/come-creare-unintestazione-appiccicosa-in-wordpress\/","title":{"rendered":"Come creare un’intestazione appiccicosa in WordPress"},"content":{"rendered":"\n

Prima di entrare nel modo in cui possiamo creare un’intestazione appiccicosa in WordPress, cerchiamo prima di capire cosa sono e perch\u00e9 potremmo volerli usare. Gli elementi permanenti, o elementi fissi, sono tipi speciali di elementi che rimangono sempre visibili e non cambiano la loro posizione quando l’utente scorre verso l’alto o verso il basso<\/strong>. Questi elementi sono accessibili in qualsiasi momento grazie al loro posizionamento e sono quindi molto utili per menu o altre opzioni di navigazione.<\/p>\n

Vuoi offrire ai tuoi utenti quante pi\u00f9 opzioni convenienti possibile, per rendere i tuoi contenuti facilmente accessibili e per ridurre la frustrazione degli utenti. Utilizzando gli elementi permanenti, gli utenti possono passare rapidamente da una pagina all’altra del tuo sito Web e trovare esattamente ci\u00f2 di cui hanno bisogno<\/strong>. Tutto questo comfort e facilit\u00e0 d’uso significa che la tua esperienza utente sar\u00e0 molto migliore e avrai una maggiore fidelizzazione degli utenti.<\/p>\n

Ora affronteremo uno dei principali tipi di elementi appiccicosi, l’intestazione adesiva e uno strumento fantastico che pu\u00f2 aiutarci a creare e personalizzare facilmente questi elementi. Lo strumento in questione si chiama WP Sticky<\/a>.<\/p>\n

Esistono molti modi diversi per creare intestazioni adesive oltre a WP Sticky. Puoi persino creare questi elementi appiccicosi utilizzando puro codice HTML e CSS<\/strong>, ma ci\u00f2 richiede alcune conoscenze tecniche ed \u00e8 un processo che richiede tempo<\/strong>. Questo plugin \u00e8 una soluzione molto pi\u00f9 semplice al problema ed \u00e8 estremamente adatto ai principianti.<\/p>\n

Prima di poter iniziare a utilizzare WP Sticky, dobbiamo prima scaricarlo e installare il plugin<\/a>. Poich\u00e9 si tratta di un processo molto semplice, non perderemo tempo. Invece, passiamo subito alla creazione della nostra prima intestazione appiccicosa.<\/p>\n

La prima cosa che dobbiamo fare \u00e8 entrare nella sezione dei plugin nel nostro pannello di amministrazione di WordPress; da l\u00ec, seleziona WP Sticky Pro e quindi fai clic su Impostazioni<\/strong>.<\/p>\n

Saremo accolti con queste opzioni in cui dovremo selezionare Aggiungi nuovo elemento appiccicoso.<\/p>\n

\"Come<\/a><\/p>\n

Al termine, vedremo una nuova voce nella scheda I tuoi elementi appiccicosi chiamata Elemento appiccicoso #1<\/strong>. Congratulazioni, hai creato il tuo primo elemento appiccicoso<\/strong>, ma c’\u00e8 molto altro da fare prima di avere un’intestazione adesiva funzionale. Come puoi vedere, ci sono alcune categorie di impostazioni diverse per il nostro elemento appiccicoso.<\/p>\n

\"Come<\/a><\/p>\n

Diamo un’occhiata pi\u00f9 in dettaglio.<\/p>\n

Qui \u00e8 dove nomineremo il nostro elemento e sceglieremo esattamente cosa vogliamo rendere appiccicoso<\/strong>.<\/p>\n

\"Come<\/a><\/p>\n

In primo luogo, dobbiamo dare un nome al nostro elemento appiccicoso; in questo caso, sar\u00e0 Sticky Header.<\/p>\n

Successivamente, dobbiamo individuare e selezionare un elemento che vogliamo rendere appiccicoso<\/strong>. Ci sono due modi in cui possiamo raggiungere questo obiettivo.<\/p>\n

Selezionatore visivo<\/h3>\n

Questa \u00e8 l’opzione pi\u00f9 comoda e facile. Basta andare nella sezione Base e selezionare l’opzione Scegli elemento.<\/p>\n

\"Come<\/a><\/p>\n

Una volta fatto, il tuo sito Web si aprir\u00e0 insieme al menu WP Sticky in alto<\/strong>, segnalando che sei entrato nel selettore visivo. Se passi il puntatore del mouse su alcuni elementi, noterai una linea tratteggiata giallastra rettangolo, che visualizza l’area che hai selezionato. Fare clic su di esso con il tasto sinistro per selezionarlo.<\/p>\n

\"Come<\/a><\/p>\n

Questo ti riporter\u00e0 alla pagina delle impostazioni di WP Sticky<\/strong>, dove vedrai l’ identificatore univoco dell’elemento selezionato<\/strong>. Nel nostro caso, sembra qualcosa del genere.<\/p>\n

\"Come<\/a><\/p>\n

Successivamente, fai clic sul pulsante Salva modifiche nell’angolo in alto a destra e il gioco \u00e8 fatto.<\/p>\n

Scrivere l’identificatore univoco<\/h3>\n

Se preferisci e hai familiarit\u00e0 con l’ID univoco dell’elemento che vuoi rendere appiccicoso, invece di selezionarlo visivamente, puoi semplicemente annotare il suo ID univoco<\/strong>.<\/p>\n

Opzioni visive<\/h2>\n

Dopo che abbiamo finito di nominare e selezionare il nostro elemento, \u00e8 il momento di trasformarlo in un’intestazione e personalizzarlo. WP Sticky ci offre molte opzioni per farlo.<\/p>\n

Poich\u00e9 vogliamo creare un’intestazione, lasceremo questa opzione nel suo stato predefinito, che \u00e8 Superiore. Nel caso in cui cambiassi idea o cambiassero i requisiti, puoi anche selezionare l’opzione Fondo<\/strong>.<\/p>\n

\"Come<\/a><\/p>\n

Spazio tra la parte superiore della pagina e l’elemento appiccicoso<\/h3>\n

A volte, i nostri elementi permanenti possono avvicinarsi troppo alla parte superiore della pagina. Possiamo correggerlo manualmente digitando il numero di pixel tra la parte superiore della pagina e il nostro elemento adesivo designato<\/strong>.<\/p>\n

\"Come<\/a><\/p>\n

Per impostazione predefinita, questa opzione non \u00e8 impostata poich\u00e9 la maggior parte degli elementi verr\u00e0 posizionata correttamente automaticamente.<\/p>\n

Controlla la barra degli strumenti di amministrazione<\/h3>\n

Se il tuo sito web ha una barra degli strumenti di amministrazione specializzata, potrebbe ostruire la tua intestazione appiccicosa. In tal caso, tutto ci\u00f2 che devi fare \u00e8 selezionare questa opzione e il problema verr\u00e0 risolto<\/strong>. WP Sticky riconoscer\u00e0 automaticamente la dimensione della barra degli strumenti e reagir\u00e0 di conseguenza.<\/p>\n

\"Come<\/a><\/p>\n

A volte vuoi avere comportamenti diversi a seconda del dispositivo che i tuoi visitatori utilizzano per visualizzare il tuo sito web. Potresti non voler avere un’intestazione appiccicosa sui dispositivi mobili. WP Sticky ti d\u00e0 la possibilit\u00e0 di selezionare quali categorie di dispositivi avranno il comportamento appiccicoso. Nel nostro caso, sceglieremo di non utilizzare dispositivi di piccole e medie dimensioni.<\/p>\n

\"Come<\/a><\/p>\n

Un altro caso che potrebbe richiedere una personalizzazione manuale \u00e8 se sono presenti elementi che appaiono sull’intestazione adesiva. Per evitare che ci\u00f2 accada, dovrai aumentare l’indice Z della tua intestazione adesiva.<\/p>\n

Se non sei sicuro dei valori dell’indice Z degli elementi che si sovrappongono all’intestazione, digita il valore massimo, 99999, e questo risolver\u00e0 il problema.<\/p>\n

\"Come<\/a><\/p>\n

Ci sono due impostazioni degli effetti che puoi usare. Dissolvenza e scivolare verso il basso. Ora, quale finirai per utilizzare dipende completamente dalle tue preferenze personali e dall’aspetto desiderato del sito web. Sperimenta fino a prendere una decisione.<\/p>\n

\"Come<\/a><\/p>\n

Un’altra personalizzazione visiva dell’elemento adesivo. A seconda del resto del sito web, usando lo slider, possiamo rendere l’elemento adesivo pi\u00f9 o meno trasparente.<\/p>\n

\"Come<\/a><\/p>\n

Cosa succede se non vuoi che alcune parti del tuo sito web abbiano l’intestazione appiccicosa? Bene, questo dispositivo di scorrimento ti consente di personalizzare il punto iniziale e il punto finale in cui l’intestazione adesiva verr\u00e0 visualizzata sul tuo sito Web mentre continui a scorrere.<\/p>\n

\"Come<\/a><\/p>\n

Colore di sfondo<\/h3>\n

E se il nostro elemento appiccicoso non fosse cos\u00ec chiaramente visibile? Il plugin ha la possibilit\u00e0 di farlo risaltare assegnandogli un colore di sfondo. Per fare ci\u00f2, fai clic sul pulsante mostrato di seguito e scegli il colore di sfondo desiderato. \u00c8 cos\u00ec facile.<\/p>\n

\"Come<\/a><\/p>\n

Se desideri apportare ancora pi\u00f9 modifiche al tuo elemento sticky che non sono coperti dalle opzioni sopra menzionate, c’\u00e8 un campo in cui puoi aggiungere la personalizzazione tramite CSS. Una cosa importante da tenere a mente, in questo caso, \u00e8 che non \u00e8 necessario racchiudere gli stili nei selettori. Non \u00e8 necessario scrivere .classname{color:#FFF;}, invece tutto ci\u00f2 che devi scrivere \u00e8 color:#FFF;<\/p>\n

\"Come<\/a><\/p>\n

Lo lasceremo vuoto poich\u00e9 non \u00e8 pi\u00f9 necessario personalizzare la nostra intestazione demo adesiva.<\/p>\n

Dopo aver modificato tutte le impostazioni desiderate, non dimenticare di salvare le modifiche. Fatto ci\u00f2, possiamo andare avanti e fare clic sul pulsante Anteprima permanente nell’angolo in alto a destra per visualizzare in anteprima le modifiche apportate finora.<\/p>\n

Insomma<\/h2>\n

WP Sticky \u00e8 un’aggiunta eccellente a qualsiasi sito Web e rende il lavoro dello sviluppatore molto pi\u00f9 semplice. Cos\u00ec semplice da usare, ma che offre opzioni di personalizzazione dettagliate e profonde, questo plugin \u00e8 garantito per aiutarti a creare l’intestazione adesiva perfetta per il tuo sito web. Questa \u00e8 un’ottima notizia poich\u00e9 un’intestazione appiccicosa pu\u00f2 aumentare significativamente le conversioni del sito web<\/a>.<\/p>\n

WP Sticky ha una versione Pro, che include tutte le opzioni di cui sopra e costa $ 5,99 al mese o $ 39 per una licenza a vita. Sono offerti anche diversi piani tariffari per team e agenzie.<\/p>\n

Vallery Henings<\/p>\n

Vallery Henings \u00e8 una copywriter e scrittrice di contenuti specializzata in ghost blogging, campagne di email marketing e pagine di vendita. \u00c8 anche un’amante dei viaggi su strada, dei biscotti al burro di arachidi e del nome di un cane Mimy.<\/p>\n

Fonte di registrazione: wpklik.com<\/a><\/div><\/p>\n","protected":false},"excerpt":{"rendered":"

Crea un’intestazione appiccicosa in WordPress e migliora l’esperienza utente del tuo sito web.<\/p>\n","protected":false},"author":1,"featured_media":364361,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":"","_wp_rev_ctl_limit":""},"categories":[571],"tags":[846],"class_list":["post-366107","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-nozioni-di-base-su-wordpress","tag-affiai-it"],"_links":{"self":[{"href":"https:\/\/themewp.inform.click\/it\/wp-json\/wp\/v2\/posts\/366107","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/themewp.inform.click\/it\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/themewp.inform.click\/it\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/themewp.inform.click\/it\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/themewp.inform.click\/it\/wp-json\/wp\/v2\/comments?post=366107"}],"version-history":[{"count":0,"href":"https:\/\/themewp.inform.click\/it\/wp-json\/wp\/v2\/posts\/366107\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/themewp.inform.click\/it\/wp-json\/wp\/v2\/media\/364361"}],"wp:attachment":[{"href":"https:\/\/themewp.inform.click\/it\/wp-json\/wp\/v2\/media?parent=366107"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/themewp.inform.click\/it\/wp-json\/wp\/v2\/categories?post=366107"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/themewp.inform.click\/it\/wp-json\/wp\/v2\/tags?post=366107"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}