{"id":68546,"date":"2024-12-20T07:00:00","date_gmt":"2024-12-20T15:00:00","guid":{"rendered":"https:\/\/dhblog.dream.press\/blog\/?p=68546"},"modified":"2025-06-11T13:18:39","modified_gmt":"2025-06-11T20:18:39","slug":"3-modi-semplici-per-creare-un-intestazione-fissa-sticky-in-wordpress-it","status":"publish","type":"post","link":"https:\/\/www-dev.dreamhost.com\/blog\/it\/3-modi-semplici-per-creare-un-intestazione-fissa-sticky-in-wordpress-it\/","title":{"rendered":"3 Modi Semplici per Creare un Intestazione Fissa (Sticky) in WordPress"},"content":{"rendered":"\n<p>La navigazione del tuo sito web potrebbe sfuggirti&#8230; Quindi <em>rimani<\/em> qui per imparare come mantenerla fissa!<\/p>\n\n\n<p>OK, a parte i giochi di parole poco riusciti, mantenere la navigazione del tuo sito facilmente accessibile \u00e8 fondamentale per migliorare l&#8217;esperienza utente. <strong>Entra in gioco l&#8217;intestazione fissa, una barra di navigazione fissa che rimane visibile mentre gli utenti scorrono la pagina verso il basso.<\/strong><\/p>\n\n\n<p>Questa funzione pratica mantiene gli elementi del menu e i call-to-action a portata di mano, indipendentemente da quanto gli utenti scorrono \u2014 un cambiamento radicale per i proprietari di piccole imprese che mirano ad aumentare l&#8217;engagement e le <a target=\"_blank\" href=\"https:\/\/www.dreamhost.com\/blog\/increase-website-conversion-rate\/\" rel=\"noopener\">conversioni<\/a>.<\/p>\n\n\n<p>In questo tutorial, esploreremo tre semplici metodi per creare un&#8217;intestazione fissa in WordPress, adatti a tutti i livelli di competenza \u2014 dai principianti a chi si trova a suo agio con un po&#8217; di codifica. Che tu preferisca utilizzare un plugin, sfruttare le impostazioni integrate del tuo tema o aggiungere CSS personalizzato, noi ti abbiamo coperto.<\/p>\n\n\n<h2 id=\"h-why-sticky-headers-take-your-website-up-a-notch\" class=\"wp-block-heading\">Perch\u00e9 Gli Header Fissi Migliorano Il Tuo Sito Web<\/h2>\n\n\n<p>Prima di immergerci nel come fare, vediamo perch\u00e9 potresti voler utilizzare un&#8217;intestazione fissa in primo luogo.<\/p>\n\n\n<figure class=\"wp-block-image size-full\"><img decoding=\"async\" width=\"1600\" height=\"1500\" data-src=\"https:\/\/www.dreamhost.com\/blog\/wp-content\/uploads\/2024\/12\/01_benefits_of_using_sticky_headers.webp\" alt=\"Quattro esempi visivi che mostrano un'intestazione adesiva con benefici: un cursore che mostra la capacit\u00e0 di navigazione, aumento dell'UX, focus sul pulsante &quot;prenota ora&quot;, e un logo ingrandito per la coerenza del marchio.\" class=\"wp-image-60697 lazyload\" data-srcset=\"https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/12\/01_benefits_of_using_sticky_headers.webp 1600w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/12\/01_benefits_of_using_sticky_headers-300x281.webp 300w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/12\/01_benefits_of_using_sticky_headers-1024x960.webp 1024w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/12\/01_benefits_of_using_sticky_headers-768x720.webp 768w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/12\/01_benefits_of_using_sticky_headers-1536x1440.webp 1536w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/12\/01_benefits_of_using_sticky_headers-600x563.webp 600w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/12\/01_benefits_of_using_sticky_headers-1200x1125.webp 1200w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/12\/01_benefits_of_using_sticky_headers-730x684.webp 730w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/12\/01_benefits_of_using_sticky_headers-1460x1369.webp 1460w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/12\/01_benefits_of_using_sticky_headers-784x735.webp 784w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/12\/01_benefits_of_using_sticky_headers-1568x1470.webp 1568w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/12\/01_benefits_of_using_sticky_headers-877x822.webp 877w\" data-sizes=\"(max-width: 1600px) 100vw, 1600px\" src=\"data:image\/svg+xml;base64,PHN2ZyB3aWR0aD0iMSIgaGVpZ2h0PSIxIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPjwvc3ZnPg==\" style=\"--smush-placeholder-width: 1600px; --smush-placeholder-aspect-ratio: 1600\/1500;\" \/><\/figure>\n\n\n<h3 class=\"wp-block-heading\">1. Navigabilit\u00e0 Migliorata<\/h3>\n\n\n<p>Un&#8217;intestazione fissa mantiene il menu principale del tuo sito sempre visibile, eliminando la necessit\u00e0 per i visitatori di dover risalire in cima alla pagina quando vogliono passare a una pagina diversa. Questa facilit\u00e0 di movimento pu\u00f2 rendere la navigazione del tuo sito pi\u00f9 intuitiva e piacevole, specialmente se hai pagine ricche di contenuti che richiedono molto scorrimento.<\/p>\n\n\n<h3 class=\"wp-block-heading\">2. Migliore Esperienza Utente<\/h3>\n\n\n<p>Mantenendo le informazioni essenziali e i link di navigazione facilmente accessibili, riduci l&#8217;attrito nel percorso dell&#8217;utente. Questo tipo di esperienza di navigazione fluida pu\u00f2 portare a visite pi\u00f9 lunghe al sito e a un minor tasso di rimbalzo, segnalando ai motori di ricerca che il tuo <a target=\"_blank\" href=\"https:\/\/www.dreamhost.com\/blog\/how-to-come-up-with-new-content-ideas\/\" rel=\"noopener\">contenuto<\/a> \u00e8 prezioso e coinvolgente.<\/p>\n\n\n<h3 class=\"wp-block-heading\">3. Aumento Delle Conversioni<\/h3>\n\n\n<p>Immagina di avere un pulsante persistente &#8220;Prenota Ora&#8221; o &#8220;Contattaci&#8221; che segue i tuoi visitatori ovunque vadano sul tuo sito. Un&#8217;intestazione fissa ti permette di mantenere importanti<a target=\"_blank\" href=\"https:\/\/www.dreamhost.com\/blog\/call-to-action-examples\/\" rel=\"noopener\"> inviti all&#8217;azione <\/a>sempre visibili, incoraggiando gentilmente gli utenti a compiere il passo successivo \u2014 che sia effettuare un acquisto, iscriversi a una newsletter o prenotare un servizio.<\/p>\n\n\n<h3 class=\"wp-block-heading\">4. Coerenza del Marchio<\/h3>\n\n\n<p>Un header fisso mantiene il tuo logo e altri elementi del brand sempre visibili. Questo rinforzo costante pu\u00f2 rafforzare il riconoscimento e la fiducia del brand, rendendo la tua azienda pi\u00f9 memorabile per i potenziali clienti.<\/p>\n\n\n<h2 id=\"h2_3-simple-ways-to-create-a-fixed-sticky-header-in-wordpress\" class=\"wp-block-heading\">3 Modi Semplici Per Creare un Intestazione Fissa (Sticky) in WordPress<\/h2>\n\n\n<p>Ora che sappiamo <em>perch\u00e9<\/em> desideri un&#8217;intestazione fissa per il tuo sito WordPress, parliamo di <em>come<\/em> puoi ottenerne una.<\/p>\n\n\n<p>Di seguito, ti guideremo attraverso tre metodi per aggiungere un&#8217;intestazione fissa al tuo sito WordPress, partendo dal metodo pi\u00f9 semplice e procedendo verso tecniche pi\u00f9 avanzate.<\/p>\n\n\n<p><strong>Scegli la tua avventura: quella che si adatta meglio al tuo livello di comfort e alle esigenze del tuo sito web.<\/strong><\/p>\n\n\n<h3 class=\"wp-block-heading\">Metodo 1: Utilizzo di un Plugin WordPress (Facile)<\/h3>\n\n\n<p>Per chi preferisce una soluzione senza codice, <a target=\"_blank\" href=\"https:\/\/www.dreamhost.com\/blog\/best-wordpress-plugins\/\" rel=\"noopener\">WordPress plugins<\/a> offrono un modo rapido e facile per aggiungere un&#8217;intestazione fissa. I plugins sono particolarmente vantaggiosi se sei nuovo su WordPress o se desideri implementare la funzionalit\u00e0 senza addentrarti nei dettagli tecnici.<\/p>\n\n\n<h4 class=\"wp-block-heading\">Plugin Consigliati<\/h4>\n\n\n<p><a target=\"_blank\" href=\"https:\/\/wordpress.org\/plugins\/mystickymenu\/\" rel=\"noopener\"><strong>La Mia Barra Fissa<\/strong><\/a><\/p>\n\n\n<p>Funzionalit\u00e0:<\/p>\n\n\n<ul class=\"wp-block-list\">\n<li>Processo di configurazione semplice.<\/li>\n\n\n\n<li>Aspetto e comportamento personalizzabili.<\/li>\n\n\n\n<li>Opzione per rendere sticky qualsiasi elemento, non solo l&#8217;intestazione.<\/li>\n\n\n<\/ul>\n\n\n<p><a target=\"_blank\" href=\"https:\/\/wordpress.org\/plugins\/sticky-menu-or-anything-on-scroll\/\" rel=\"noopener\"><strong>Menu Adesivo<\/strong><\/a><strong> (o Qualsiasi Cosa!) Durante lo Scorrimento<\/strong><\/p>\n\n\n<p>Funzionalit\u00e0:<\/p>\n\n\n<ul class=\"wp-block-list\">\n<li>La flessibilit\u00e0 di attaccare qualsiasi elemento.<\/li>\n\n\n\n<li>Opzioni di offset per controllare l&#8217;attivazione dell&#8217;effetto sticky.<\/li>\n\n\n\n<li>Compatibilit\u00e0 con la maggior parte dei temi.<\/li>\n\n\n<\/ul>\n\n\n<h4 class=\"wp-block-heading\">Cosa fare<\/h4>\n\n\n<p><strong>Passo 1: Installa il plugin<\/strong><\/p>\n\n\n<p>Accedi alla tua Dashboard di WordPress. Naviga in <strong>Plugins<\/strong> &gt; <strong>Aggiungi Nuovo Plugin<\/strong>. Nella barra di ricerca, digita il nome del plugin scelto, installalo e attivalo.<\/p>\n\n\n<figure class=\"wp-block-image size-full\"><img decoding=\"async\" width=\"1600\" height=\"1162\" data-src=\"https:\/\/www.dreamhost.com\/blog\/wp-content\/uploads\/2024\/12\/02_install_the_plugin.webp\" alt=\"ingrandimento dello screenshot del plugin &quot;My Sticky Menu&quot; che mostra il termine di ricerca &quot;my sticky bar&quot; e il risultato successivo che indica il pulsante &quot;installa ora&quot;\" class=\"wp-image-60690 lazyload\" data-srcset=\"https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/12\/02_install_the_plugin.webp 1600w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/12\/02_install_the_plugin-300x218.webp 300w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/12\/02_install_the_plugin-1024x744.webp 1024w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/12\/02_install_the_plugin-768x558.webp 768w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/12\/02_install_the_plugin-1536x1116.webp 1536w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/12\/02_install_the_plugin-600x436.webp 600w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/12\/02_install_the_plugin-1200x872.webp 1200w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/12\/02_install_the_plugin-730x530.webp 730w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/12\/02_install_the_plugin-1460x1060.webp 1460w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/12\/02_install_the_plugin-784x569.webp 784w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/12\/02_install_the_plugin-1568x1139.webp 1568w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/12\/02_install_the_plugin-877x637.webp 877w\" data-sizes=\"(max-width: 1600px) 100vw, 1600px\" src=\"data:image\/svg+xml;base64,PHN2ZyB3aWR0aD0iMSIgaGVpZ2h0PSIxIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPjwvc3ZnPg==\" style=\"--smush-placeholder-width: 1600px; --smush-placeholder-aspect-ratio: 1600\/1162;\" \/><\/figure>\n\n\n<p><strong>Passo 2: Configura il plugin (se necessario)<\/strong><\/p>\n\n\n<p>Identifica l&#8217;elemento dell&#8217;intestazione che vuoi rendere fisso. Utilizza lo strumento &#8220;Ispeziona Elemento&#8221; del tuo <a target=\"_blank\" href=\"https:\/\/www.dreamhost.com\/blog\/how-to-inspect-a-website\/\" rel=\"noopener\">browser<\/a> per trovare il selettore esatto se necessario. Inserisci il selettore nelle impostazioni del plugin.<\/p>\n\n\n<p>Per fare questo, apri il tuo sito web in un browser, <strong>fai clic con il pulsante destro<\/strong> sul tuo header e seleziona <strong>Ispeziona<\/strong> o <strong>Ispeziona elemento<\/strong>.<\/p>\n\n\n<figure class=\"wp-block-image size-full\"><img decoding=\"async\" width=\"1600\" height=\"999\" data-src=\"https:\/\/www.dreamhost.com\/blog\/wp-content\/uploads\/2024\/12\/05_inspect.webp\" alt=\"elemento di ispezione sulla home page di dreamhost\" class=\"wp-image-60694 lazyload\" data-srcset=\"https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/12\/05_inspect.webp 1600w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/12\/05_inspect-300x187.webp 300w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/12\/05_inspect-1024x639.webp 1024w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/12\/05_inspect-768x480.webp 768w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/12\/05_inspect-1536x959.webp 1536w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/12\/05_inspect-600x375.webp 600w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/12\/05_inspect-1200x749.webp 1200w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/12\/05_inspect-730x456.webp 730w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/12\/05_inspect-1460x912.webp 1460w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/12\/05_inspect-784x490.webp 784w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/12\/05_inspect-1568x979.webp 1568w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/12\/05_inspect-877x548.webp 877w\" data-sizes=\"(max-width: 1600px) 100vw, 1600px\" src=\"data:image\/svg+xml;base64,PHN2ZyB3aWR0aD0iMSIgaGVpZ2h0PSIxIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPjwvc3ZnPg==\" style=\"--smush-placeholder-width: 1600px; --smush-placeholder-aspect-ratio: 1600\/999;\" \/><\/figure>\n\n\n<p>I selettori comuni includono <strong>#site-header<\/strong> o <strong>.main-header<\/strong>.<\/p>\n\n\n<figure class=\"wp-block-image size-full\"><img decoding=\"async\" width=\"1600\" height=\"757\" data-src=\"https:\/\/www.dreamhost.com\/blog\/wp-content\/uploads\/2024\/12\/06_div_class.webp\" alt=\"l'elemento di ispezione di dreamhost\" class=\"wp-image-60695 lazyload\" data-srcset=\"https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/12\/06_div_class.webp 1600w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/12\/06_div_class-300x142.webp 300w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/12\/06_div_class-1024x484.webp 1024w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/12\/06_div_class-768x363.webp 768w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/12\/06_div_class-1536x727.webp 1536w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/12\/06_div_class-600x284.webp 600w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/12\/06_div_class-1200x568.webp 1200w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/12\/06_div_class-730x345.webp 730w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/12\/06_div_class-1460x691.webp 1460w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/12\/06_div_class-784x371.webp 784w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/12\/06_div_class-1568x742.webp 1568w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/12\/06_div_class-877x415.webp 877w\" data-sizes=\"(max-width: 1600px) 100vw, 1600px\" src=\"data:image\/svg+xml;base64,PHN2ZyB3aWR0aD0iMSIgaGVpZ2h0PSIxIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPjwvc3ZnPg==\" style=\"--smush-placeholder-width: 1600px; --smush-placeholder-aspect-ratio: 1600\/757;\" \/><\/figure>\n\n\n<p><strong>Nota<\/strong>: Per saperne di pi\u00f9 sull&#8217;uso degli strumenti per sviluppatori del tuo browser, leggi la nostra guida su <a target=\"_blank\" href=\"https:\/\/help.dreamhost.com\/hc\/en-us\/articles\/360031248971-Viewing-your-website-s-headers\" rel=\"noopener\"><em>Visualizzazione degli header del tuo sito web<\/em><\/a>.<\/p>\n\n\n<p>A seconda del plugin che hai scelto, potresti essere in grado di personalizzare altre opzioni, come <a target=\"_blank\" href=\"https:\/\/www.dreamhost.com\/blog\/css-animation\/\" rel=\"noopener\">aggiungere effetti di animazione<\/a> o modificare la distanza di scorrimento prima che l&#8217;intestazione diventi fissa.<\/p>\n\n\n<p><strong>Passo 3: Salva le modifiche e testa<\/strong><\/p>\n\n\n<p>Clicca <strong>Salva<\/strong> o <strong>Applica<\/strong> per confermare le tue impostazioni. Visita il tuo sito web per testare l&#8217;intestazione fissa. Scorri verso il basso per vedere se l&#8217;intestazione rimane fissa in alto e assicurati di controllare su dispositivi diversi.<\/p>\n\n\n<h3 class=\"wp-block-heading\">Metodo 2: Utilizzo delle Impostazioni Incorporate nel Tuo Tema (Moderato)<\/h3>\n\n\n<p>Molti temi moderni di <a target=\"_blank\" href=\"https:\/\/www.dreamhost.com\/blog\/how-to-pick-wordpress-theme\/\" rel=\"noopener\">WordPress<\/a> includono opzioni integrate per abilitare un&#8217;intestazione fissa. Questo metodo offre un&#8217;integrazione perfetta con il design del tuo sito e evita la necessit\u00e0 di plugin aggiuntivi.<\/p>\n\n\n<h4 class=\"wp-block-heading\">Temi Popolari Con Opzioni Per Intestazioni Fisse<\/h4>\n\n\n<ul class=\"wp-block-list\">\n<li><a target=\"_blank\" href=\"https:\/\/wpastra.com\/pricing\/?campaign=DHblog&amp;bsf=10463\" rel=\"noopener\">Astra<\/a><\/li>\n\n\n\n<li><a target=\"_blank\" href=\"https:\/\/oceanwp.org\/\" rel=\"noopener\">OceanWP<\/a><\/li>\n\n\n\n<li><a target=\"_blank\" href=\"https:\/\/www.elegantthemes.com\/gallery\/divi\/\" rel=\"noopener\">Divi<\/a><\/li>\n\n\n<\/ul>\n\n\n<h4 class=\"wp-block-heading\">Cosa fare<\/h4>\n\n\n<p><strong>Passo 1: Accedi al personalizzatore del tema<\/strong><\/p>\n\n\n<p>Nel tuo pannello di controllo WordPress, naviga in <strong>Aspetto<\/strong> &gt; <strong>Personalizza<\/strong>.<\/p>\n\n\n<figure class=\"wp-block-image size-full\"><img decoding=\"async\" width=\"641\" height=\"720\" data-src=\"https:\/\/www.dreamhost.com\/blog\/wp-content\/uploads\/2024\/12\/03_install_the_plugin.webp\" alt=\"screenshot ingrandito della navigazione WP che evidenzia il pulsante &quot;personalizza&quot; sotto &quot;temi&quot; in &quot;aspetto&quot;\" class=\"wp-image-60691 lazyload\" data-srcset=\"https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/12\/03_install_the_plugin.webp 641w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/12\/03_install_the_plugin-267x300.webp 267w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/12\/03_install_the_plugin-600x674.webp 600w\" data-sizes=\"(max-width: 641px) 100vw, 641px\" src=\"data:image\/svg+xml;base64,PHN2ZyB3aWR0aD0iMSIgaGVpZ2h0PSIxIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPjwvc3ZnPg==\" style=\"--smush-placeholder-width: 641px; --smush-placeholder-aspect-ratio: 641\/720;\" \/><\/figure>\n\n\n<p><strong>Passo 2: Trova le impostazioni dell&#8217;intestazione<\/strong><\/p>\n\n\n<p>Nella barra laterale del personalizzatore, cerca le sezioni denominate &#8220;Intestazione&#8221;, &#8220;Menu&#8221; o &#8220;Navigazione&#8221;. Clicca sulla sezione pertinente per accedere alle impostazioni dell&#8217;intestazione.<\/p>\n\n\n<p><strong>Passo 3: Attiva l&#8217;opzione per l&#8217;intestazione fissa<\/strong><\/p>\n\n\n<p>Trova l&#8217;impostazione denominata &#8220;Sticky Header&#8221;, &#8220;Fixed Header&#8221; o &#8220;Enable on Scroll&#8221;. Attiva l&#8217;opzione su <strong>On<\/strong> o <strong>Enable<\/strong>.<\/p>\n\n\n<p><strong>Passo 4: Personalizza altre impostazioni (se applicabile)<\/strong><\/p>\n\n\n<p>Potrebbero esserci altre impostazioni che puoi personalizzare, se vuoi, come il <a target=\"_blank\" href=\"https:\/\/www.dreamhost.com\/blog\/website-color-schemes\/\" rel=\"noopener\">colore di sfondo<\/a>, i livelli di trasparenza, la dimensione del logo durante lo scorrimento, ecc. Usa l&#8217;anteprima dal vivo per vedere le tue modifiche in tempo reale.<\/p>\n\n\n<p><strong>Passo 5: Pubblica e testa<\/strong><\/p>\n\n\n<p>Clicca <strong>Pubblica<\/strong> per salvare le tue modifiche. Visita il tuo sito per verificare la funzionalit\u00e0 dell&#8217;intestazione fissa. Testa su pi\u00f9 pagine e assicurati di controllare la sua <a target=\"_blank\" href=\"https:\/\/www.dreamhost.com\/blog\/how-to-optimize-your-site-for-mobile\/\" rel=\"noopener\">reattivit\u00e0 su tablet e smartphone<\/a>.<\/p>\n\n\n<div class=\"article-newsletter article-newsletter--gradient\">\n\n\n<h2>Get Content Delivered Straight to Your Inbox<\/h2><p>Subscribe now to receive all the latest updates, delivered directly to your inbox.<\/p><form class=\"nwsl-form\" id=\"newsletter_block_\" novalidate><div class=\"messages\"><\/div><div class=\"form-group\"><label for=\"input_newsletter_block_\"><input type=\"email\"name=\"email\"id=\"input_newsletter_block_\"placeholder=\"Enter your email address\"novalidatedisabled=\"disabled\"\/><\/label><button type=\"submit\"class=\"btn btn--brand\"disabled=\"disabled\"><span>Sign Me Up!<\/span><svg width=\"21\" height=\"14\" viewBox=\"0 0 21 14\" fill=\"none\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\">\n<path d=\"M13.8523 0.42524L12.9323 1.34521C12.7095 1.56801 12.7132 1.9304 12.9404 2.14865L16.7241 5.7823H0.5625C0.251859 5.7823 0 6.03416 0 6.3448V7.6573C0 7.96794 0.251859 8.2198 0.5625 8.2198H16.7241L12.9405 11.8535C12.7132 12.0717 12.7095 12.4341 12.9323 12.6569L13.8523 13.5769C14.072 13.7965 14.4281 13.7965 14.6478 13.5769L20.8259 7.39879C21.0456 7.17913 21.0456 6.82298 20.8259 6.60327L14.6477 0.42524C14.4281 0.205584 14.0719 0.205584 13.8523 0.42524Z\" fill=\"white\"\/>\n<\/svg>\n<\/button><\/div><\/form><\/div>\n\n<h3 class=\"wp-block-heading\">Metodo 3: Fai Da Te con CSS Personalizzato (Avanzato)<\/h3>\n\n\n<p>Se ti trovi a tuo agio con un po&#8217; di programmazione, aggiungere del <a target=\"_blank\" href=\"https:\/\/www.dreamhost.com\/glossary\/web-design\/css\/\" rel=\"noopener\">CSS<\/a> personalizzato permette il massimo della personalizzazione e controllo sul comportamento e l&#8217;aspetto della tua intestazione fissa.<\/p>\n\n\n<p>Anche in questo caso, dovrai identificare il tuo elemento header. Apri il tuo sito in un browser, fai clic con il tasto destro sull&#8217;header e seleziona <strong>Ispeziona<\/strong> o <strong>Ispeziona elemento<\/strong>.<\/p>\n\n\n<figure class=\"wp-block-image size-full\"><img decoding=\"async\" width=\"1600\" height=\"999\" data-src=\"https:\/\/www.dreamhost.com\/blog\/wp-content\/uploads\/2024\/12\/07_inspect_header.webp\" alt=\"ispeziona elemento\" class=\"wp-image-60696 lazyload\" data-srcset=\"https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/12\/07_inspect_header.webp 1600w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/12\/07_inspect_header-300x187.webp 300w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/12\/07_inspect_header-1024x639.webp 1024w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/12\/07_inspect_header-768x480.webp 768w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/12\/07_inspect_header-1536x959.webp 1536w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/12\/07_inspect_header-600x375.webp 600w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/12\/07_inspect_header-1200x749.webp 1200w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/12\/07_inspect_header-730x456.webp 730w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/12\/07_inspect_header-1460x912.webp 1460w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/12\/07_inspect_header-784x490.webp 784w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/12\/07_inspect_header-1568x979.webp 1568w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/12\/07_inspect_header-877x548.webp 877w\" data-sizes=\"(max-width: 1600px) 100vw, 1600px\" src=\"data:image\/svg+xml;base64,PHN2ZyB3aWR0aD0iMSIgaGVpZ2h0PSIxIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPjwvc3ZnPg==\" style=\"--smush-placeholder-width: 1600px; --smush-placeholder-aspect-ratio: 1600\/999;\" \/><\/figure>\n\n\n<p>Nota il selettore CSS per il tuo header. I selettori comuni includono <strong>header<\/strong>, <strong>#masthead<\/strong> e <strong>.site-header<\/strong>, quindi cerca questi.<\/p>\n\n<div class=\"single__related-article\">\n\t<span>Related Article<\/span>\n\t<div class=\"single__related-article__wrap\">\n\t\t<div class=\"single__related-article__title\">\n\t\t\tHow to Learn CSS In 2026 (Fast &amp; Free)\n\t\t<\/div>\n\t\t<a href=\"https:\/\/www-dev.dreamhost.com\/blog\/learn-css\/\" class=\"btn btn--sm btn--brand\" target=\"_blank\" rel=\"noopener\">\n\t\t\tRead More\n\t\t<\/a>\n\t<\/div>\n<\/div>\n\n<h4 class=\"wp-block-heading\">Cosa fare<\/h4>\n\n\n<p><strong>Passo 1: Vai al tuo editor CSS aggiuntivo<\/strong><\/p>\n\n\n<p>Vai su <strong>Aspetto<\/strong> &gt; <strong>Personalizza<\/strong> nel tuo pannello di controllo WordPress. Clicca su <strong>CSS Aggiuntivo<\/strong> in fondo alla barra laterale del personalizzatore.<\/p>\n\n\n<p><strong>Passaggio 2: Inserisci il codice CSS personalizzato<\/strong><\/p>\n\n\n<p>Inserisci il codice personalizzato nell&#8217;editor CSS. Sostituisci <strong>header<\/strong> con il tuo selettore di intestazione specifico se diverso (ad esempio, <strong>.site-header<\/strong>).<\/p>\n\n\n<p>Ecco un esempio di codice per un&#8217;intestazione fissa che puoi utilizzare:<\/p>\n\n\n<pre class=\"wp-block-code\"><code>\/* Rendi l'intestazione fissa *\/\nheader {\n    position: fixed;\n    top: 0;\n    width: 100%;\n    z-index: 9999;\n}\n\n\/* Impedisci che il contenuto si nasconda dietro l'intestazione *\/\nbody {\n    margin-top: 80px; \/* Regola questo valore per corrispondere all'altezza della tua intestazione *\/\n}<\/code><\/pre>\n\n\n<p><strong>Passo 3: Regola il margine<\/strong><\/p>\n\n\n<p>Modifica il valore di <strong>margin-top<\/strong> nella regola del <strong>body<\/strong> per corrispondere esattamente all&#8217;altezza del tuo header. Ad esempio, se il tuo header \u00e8 alto 100 pixel, imposta <strong>margin-top: 100px;<\/strong>.<\/p>\n\n\n<p><strong>Passaggio 4: Pubblica e testa<\/strong><\/p>\n\n\n<p>Clicca su <strong>Pubblica<\/strong> per applicare le tue modifiche. Visita il tuo sito per assicurarti che l&#8217;intestazione rimanga fissa in alto durante lo scorrimento e che non ci sia sovrapposizione tra l&#8217;intestazione e il contenuto sottostante. Testa su dispositivi e browser diversi per garantire la coerenza.<\/p>\n\n\n<h4 class=\"wp-block-heading\">Consigli Per La Risoluzione Dei Problemi<\/h4>\n\n\n<p><strong>1. Contenuto Sovrapposto<\/strong><\/p>\n\n\n<p>Se il contenuto sotto l&#8217;intestazione \u00e8 nascosto, regola il valore di <strong>margin-top<\/strong>.<\/p>\n\n\n<p><strong>2. Reattivit\u00e0 Mobile<\/strong><\/p>\n\n\n<p>Se il tuo header fisso occupa troppo spazio su mobile, puoi ripristinarlo a un header normale, non fisso, per schermi sotto una certa larghezza. Ad esempio, se vuoi disabilitare il header fisso su dispositivi con una larghezza inferiore a 600 pixel, potresti aggiungere:<\/p>\n\n\n<pre class=\"wp-block-code\"><code>@media (max-width: 600px) {\n    header {\n        position: static; \/* Rimuove il posizionamento fisso (sticky) *\/\n        margin-top: 0;    \/* Riporta il layout alla normalit\u00e0 *\/\n    }\n    body {\n        margin-top: 0;    \/* Rimuove il margine superiore che compensava l'intestazione sticky *\/\n    }\n}<\/code><\/pre>\n\n\n<p><strong>3. Problemi di Z-index<\/strong><\/p>\n\n\n<p>Aumenta il valore di <strong>z-index<\/strong> se l&#8217;intestazione appare dietro ad altri elementi.<\/p>\n\n\n<h2 id=\"h2_should-you-add-a-sticky-header-the-ongoing-debate\" class=\"wp-block-heading\">Dovresti Aggiungere Un&#8217;intestazione Fissa? Il Dibattito Continuo<\/h2>\n\n\n<p>Anche se gli header fissi possono migliorare l&#8217;esperienza utente, le opinioni variano tra i web designer e gli utenti. Una <a target=\"_blank\" href=\"https:\/\/www.reddit.com\/r\/web_design\/comments\/1ae2g0k\/are_stickyfixed_headers_going_out_of_style\/\" rel=\"noopener\">discussione su Reddit<\/a> cattura questo dibattito, con alcuni che sostengono che gli header fissi siano invadenti, mentre altri credono che siano essenziali per la navigazione moderna.<\/p>\n\n\n<p>Per riassumere, ecco alcuni pro e contro degli header fissi:<\/p>\n\n\n<figure class=\"wp-block-table\"><table class=\"has-fixed-layout\"><tbody><tr><td><strong>Vantaggi Degli Header Fissi<\/strong><\/td><td><strong>Svantaggi Degli Header Fissi<\/strong><\/td><\/tr><tr><td><strong>Migliora la navigazione: <\/strong>Gli utenti hanno accesso costante al menu, rendendo l&#8217;esplorazione del sito senza sforzo.<br><strong>Aumento delle conversioni: <\/strong>Le chiamate all&#8217;azione persistenti possono incoraggiare gli utenti a interagire pi\u00f9 facilmente.<br><strong>Migliore coinvolgimento: <\/strong>Per siti ricchi di contenuti, gli header fissi mantengono le opzioni importanti a portata di mano.<\/td><td><strong>Consumo di spazio sullo schermo: <\/strong>Su schermi pi\u00f9 piccoli, gli header fissi possono occupare un prezioso spazio visivo.<br><strong>Potenziale distrazione: <\/strong>Se non progettati con attenzione, possono distogliere l&#8217;attenzione dal tuo contenuto.<br><strong>Impatto sulle prestazioni: <\/strong>Gli header fissi non ottimizzati possono influenzare i tempi di caricamento della pagina.<\/td><\/tr><\/tbody><\/table><\/figure>\n\n\n<h3 class=\"wp-block-heading\">In Caso Di Dubbi, Considera Il Tuo Pubblico<\/h3>\n\n\n<p>Secondo le ricerche, le preferenze per l&#8217;intestazione fissa possono variare in base alla demografia. Chi l&#8217;avrebbe mai detto, eh?<\/p>\n\n\n<p><a target=\"_blank\" href=\"https:\/\/contentsquare.com\/blog\/the-3-golden-rules-of-sticky-menu-navigation\/\" rel=\"noopener\">Le osservazioni di Contentsquare<\/a> riportano che gli utenti pi\u00f9 giovani potrebbero apprezzare la comodit\u00e0, mentre il pubblico pi\u00f9 anziano potrebbe trovarlo confuso o ostruttivo. Allineare le tue scelte di design con le preferenze del tuo pubblico target \u00e8 fondamentale.<\/p>\n\n\n<h4 class=\"wp-block-heading\">Migliori Pratiche<\/h4>\n\n\n<ul class=\"wp-block-list\">\n<li><strong>Design Minimalista: <\/strong>Mantieni l&#8217;intestazione pulita e non ingombra per minimizzare le distrazioni.<\/li>\n\n\n\n<li><strong>Controllo dell&#8217;utente: <\/strong>Offri opzioni per consentire agli utenti di ridurre o nascondere l&#8217;intestazione fissa se lo preferiscono.<\/li>\n\n\n\n<li><strong>Responsivit\u00e0: <\/strong>Assicurati che l&#8217;intestazione fissa si adatti bene a diverse dimensioni di schermo, o considera di nasconderla sui dispositivi mobili.<\/li>\n\n\n<\/ul>\n\n\n<figure class=\"wp-block-image size-full\"><img decoding=\"async\" width=\"1600\" height=\"877\" data-src=\"https:\/\/www.dreamhost.com\/blog\/wp-content\/uploads\/2024\/12\/04_sticky_responsive_design.webp\" alt=\"Design responsive che mostra la diversa visualizzazione del footer fisso tra smartphone, tablet e desktop posizionato in alto nella pagina\" class=\"wp-image-60692 lazyload\" data-srcset=\"https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/12\/04_sticky_responsive_design.webp 1600w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/12\/04_sticky_responsive_design-300x164.webp 300w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/12\/04_sticky_responsive_design-1024x561.webp 1024w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/12\/04_sticky_responsive_design-768x421.webp 768w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/12\/04_sticky_responsive_design-1536x842.webp 1536w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/12\/04_sticky_responsive_design-600x329.webp 600w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/12\/04_sticky_responsive_design-1200x658.webp 1200w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/12\/04_sticky_responsive_design-730x400.webp 730w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/12\/04_sticky_responsive_design-1460x800.webp 1460w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/12\/04_sticky_responsive_design-784x430.webp 784w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/12\/04_sticky_responsive_design-1568x859.webp 1568w, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/12\/04_sticky_responsive_design-877x481.webp 877w\" data-sizes=\"(max-width: 1600px) 100vw, 1600px\" src=\"data:image\/svg+xml;base64,PHN2ZyB3aWR0aD0iMSIgaGVpZ2h0PSIxIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPjwvc3ZnPg==\" style=\"--smush-placeholder-width: 1600px; --smush-placeholder-aspect-ratio: 1600\/877;\" \/><\/figure>\n\n\n<h3 class=\"wp-block-heading\">Il Verdetto<\/h3>\n\n\n<p><strong>Alla fine, decidere se utilizzare un&#8217;intestazione fissa dipende dagli obiettivi del tuo sito e dalle necessit\u00e0 del tuo pubblico<\/strong>. Ti consigliamo di testarne l&#8217;impatto utilizzando strumenti di analisi.<\/p>\n\n\n<p><a href=\"https:\/\/www.dreamhost.com\/blog\/a-b-testing\/\" target=\"_blank\" rel=\"noopener\">Il testing A\/B<\/a> pu\u00f2 anche fornire preziosi spunti su come un&#8217;intestazione fissa influenzi il comportamento degli utenti e i tassi di conversione sul tuo sito.<\/p>\n\n\n<h2 id=\"h2_conclusion\" class=\"wp-block-heading\">Conclusione<\/h2>\n\n\n<p>Abbiamo esplorato tre modi semplici per aggiungere un&#8217;intestazione fissa al tuo sito WordPress:<\/p>\n\n\n<ul class=\"wp-block-list\">\n<li><strong>Utilizzando un plugin: <\/strong>Ideale per principianti che cercano una soluzione rapida senza codice.<\/li>\n\n\n\n<li><strong>Utilizzando le impostazioni del tema: <\/strong>Sfrutta le opzioni integrate per una integrazione senza interruzioni.<\/li>\n\n\n\n<li><strong>Con CSS personalizzato: <\/strong>Offre la massima personalizzazione per coloro che sono a proprio agio con la programmazione.<\/li>\n\n\n<\/ul>\n\n\n<p>Un&#8217;intestazione fissa pu\u00f2 migliorare notevolmente l&#8217;esperienza dell&#8217;utente migliorando la navigazione e mantenendo accessibili gli elementi importanti. Per i proprietari di piccole imprese, ci\u00f2 pu\u00f2 tradursi in un maggiore coinvolgimento e un aumento delle conversioni.<\/p>\n\n\n<p>Ora che sei dotato della conoscenza necessaria per aggiungere un&#8217;intestazione adesiva, \u00e8 il momento di metterla in pratica! Scegli il metodo che ritieni pi\u00f9 adatto e migliora la navigabilit\u00e0 del tuo sito web oggi stesso.<\/p>\n\n\n<p>Pronto a portare il tuo sito oltre le basi? Esplora le nostre risorse aggiuntive e continua il tuo percorso verso una presenza online pi\u00f9 efficace e coinvolgente.<\/p>\n\n\n<h3 class=\"wp-block-heading\">Risorse Aggiuntive per il Miglioramento del Sito Web<\/h3>\n\n\n<p><strong>Guide per principianti:<\/strong><\/p>\n\n\n<ul class=\"wp-block-list\">\n<li><a target=\"_blank\" href=\"https:\/\/www.dreamhost.com\/blog\/learn-wordpress\/\" rel=\"noopener\">Impara WordPress, Velocemente: 25 Risorse per Cominciare<\/a><\/li>\n\n\n\n<li><a target=\"_blank\" href=\"https:\/\/www.dreamhost.com\/blog\/build-lead-generating-landing-pages-wordpress\/\" rel=\"noopener\">Come Creare Pagine di Atterraggio Generatrici di Lead con WordPress<\/a><\/li>\n\n\n\n<li><a target=\"_blank\" href=\"https:\/\/www.dreamhost.com\/blog\/guide-to-wp-posts\/\" rel=\"noopener\">Post di WordPress: Ecco Tutto Ci\u00f2 che Devi Sapere<\/a><\/li>\n\n\n\n<li><a target=\"_blank\" href=\"https:\/\/www.dreamhost.com\/blog\/time-for-website-redesign\/\" rel=\"noopener\">La tua Checklist per un Incredibile Restyling del Sito Web<\/a><\/li>\n\n\n<\/ul>\n\n\n<p><strong>Tutorial:<\/strong><\/p>\n\n\n<ul class=\"wp-block-list\">\n<li><a target=\"_blank\" href=\"https:\/\/www.dreamhost.com\/blog\/change-wordpress-login-url\/\" rel=\"noopener\">Come Trovare Il Tuo URL Di Login WordPress E Migliorarlo Per La Sicurezza<\/a><\/li>\n\n\n\n<li><a target=\"_blank\" href=\"https:\/\/www.dreamhost.com\/blog\/wordpress-block-patterns\/\" rel=\"noopener\">Decodificare WordPress: Lavorare Con I Modelli Di Blocchi<\/a><\/li>\n\n\n\n<li><a target=\"_blank\" href=\"https:\/\/www.dreamhost.com\/blog\/customer-journey\/\" rel=\"noopener\">La Tua Chiave Per Costruire Una Mappa Vincente Del Percorso Cliente<\/a><\/li>\n\n\n\n<li><a target=\"_blank\" href=\"https:\/\/www.dreamhost.com\/blog\/what-to-do-when-locked-out-wordpress\/\" rel=\"noopener\">Cosa Fare Quando Sei Bloccato Fuori Dall&#8217;Admin Di WordPress<\/a><\/li>\n\n\n\n<li><a target=\"_blank\" href=\"https:\/\/www.dreamhost.com\/blog\/how-to-do-keyword-research\/\" rel=\"noopener\">Ricerca Delle Parole Chiave: Come Raggiungere Pi\u00f9 Clienti Con SEO<\/a><\/li>\n\n\n<\/ul>\n\n\n<p>Da DreamHost, siamo dedicati a fornire ai piccoli imprenditori e ai gestori di siti web gli strumenti e le conoscenze necessarie per avere successo online. Dalle soluzioni di hosting alle guide esperte, siamo qui per supportare il tuo percorso ad ogni passo!<\/p>\n\n\n\n<div class=\"article-cta-shared article-cta-small article-cta--product\">\n\t<div class=\"tr-img-wrap-outer jsLoading\"><img decoding=\"async\" class=\"js-img-lazy \" src=\"https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/themes\/blog2018\/assets\/img\/lazy-loading-transparent.webp\" data-srcset=\"https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/03\/product-cta-shared-hosting-877x586.webp 1x, https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/03\/product-cta-shared-hosting.webp 2x\"  \/><\/div>\n\n\t<a href='https:\/\/www.dreamhost.com\/hosting\/' class='link-top' target='_blank' rel='noopener noreferrer'>\n\t\t<span>Web Hosting<\/span>\n\t\t<svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" viewBox=\"0 0 384 512\" width=\"15\"><path d=\"M342.6 233.4c12.5 12.5 12.5 32.8 0 45.3l-192 192c-12.5 12.5-32.8 12.5-45.3 0s-12.5-32.8 0-45.3L274.7 256 105.4 86.6c-12.5-12.5-12.5-32.8 0-45.3s32.8-12.5 45.3 0l192 192z\"\/><\/svg>\n\t<\/a>\n\n\t<div class=\"content-btm\">\n\t\t<h2 class=\"h2--md\">\n\t\t\tBuild the Website You&#8217;ve Always Wanted\n\t\t<\/h2>\n\t\t<p class=\"p--md\">\n\t\t\tFrom first idea to full launch, get everything you need to succeed online.\n\t\t<\/p>\n\n\t\t        <a\n            href=\"https:\/\/www.dreamhost.com\/hosting\/\"\n                        class=\"btn btn--white-outline btn--sm btn--round\"\n                                    target=\"_blank\"\n            rel=\"noopener noreferrer\"\n            >\n                            See More                    <\/a>\n\n\t<\/div>\n<\/div>\n\n<hr class=\"wp-block-separator has-alpha-channel-opacity\"\/>\n\n\n<p><em>Questa pagina contiene link affiliati. Questo significa che potremmo guadagnare una commissione se acquisti servizi attraverso il nostro link senza alcun costo aggiuntivo per te.<\/em><\/p>\n","protected":false},"excerpt":{"rendered":"<p>Le intestazioni fisse fanno rimanere i visitatori del sito. Ecco 3 modi semplici per aggiungerne una al tuo sito WordPress \u2014 non \u00e8 necessaria alcuna competenza di programmazione!<\/p>\n","protected":false},"author":1081,"featured_media":60689,"comment_status":"closed","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_acf_changed":false,"_yoast_wpseo_metadesc":"Le intestazioni adesive fanno s\u00ec che i visitatori del sito web rimangano. Ecco 3 modi semplici per aggiungerne una al tuo sito WordPress \u2014 senza bisogno di competenze di codifica!","toc_headlines":"[[\"h-why-sticky-headers-take-your-website-up-a-notch\",\"Perch\u00e9 Gli Header Fissi Migliorano Il Tuo Sito Web\"],[\"h2_3-simple-ways-to-create-a-fixed-sticky-header-in-wordpress\",\"3 Modi Semplici Per Creare un Intestazione Fissa (Sticky) in WordPress\"],[\"h2_should-you-add-a-sticky-header-the-ongoing-debate\",\"Dovresti Aggiungere Un'intestazione Fissa? Il Dibattito Continuo\"],[\"h2_conclusion\",\"Conclusione\"]]","hide_toc":false,"footnotes":""},"categories":[15072],"tags":[],"class_list":["post-68546","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-wordpress-it"],"acf":[],"yoast_head":"<!-- This site is optimized with the Yoast SEO Premium plugin v26.3 (Yoast SEO v27.4) - https:\/\/yoast.com\/product\/yoast-seo-premium-wordpress\/ -->\n<title>3 Modi Semplici per Creare un Intestazione Fissa (Sticky) in WordPress - DreamHost Blog<\/title>\n<meta name=\"description\" content=\"Le intestazioni adesive fanno s\u00ec che i visitatori del sito web rimangano. Ecco 3 modi semplici per aggiungerne una al tuo sito WordPress \u2014 senza bisogno di competenze di codifica!\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/www-dev.dreamhost.com\/blog\/it\/3-modi-semplici-per-creare-un-intestazione-fissa-sticky-in-wordpress-it\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"3 Modi Semplici per Creare un Intestazione Fissa (Sticky) in WordPress\" \/>\n<meta property=\"og:description\" content=\"Le intestazioni adesive fanno s\u00ec che i visitatori del sito web rimangano. Ecco 3 modi semplici per aggiungerne una al tuo sito WordPress \u2014 senza bisogno di competenze di codifica!\" \/>\n<meta property=\"og:url\" content=\"https:\/\/www-dev.dreamhost.com\/blog\/it\/3-modi-semplici-per-creare-un-intestazione-fissa-sticky-in-wordpress-it\/\" \/>\n<meta property=\"og:site_name\" content=\"DreamHost Blog\" \/>\n<meta property=\"article:publisher\" content=\"https:\/\/www.facebook.com\/DreamHost\/\" \/>\n<meta property=\"article:published_time\" content=\"2024-12-20T15:00:00+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2025-06-11T20:18:39+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/www.dreamhost.com\/blog\/wp-content\/uploads\/2024\/12\/01_blog_hero_1460x1095_adding_a_sticky_header_in_wp.webp\" \/>\n\t<meta property=\"og:image:width\" content=\"1460\" \/>\n\t<meta property=\"og:image:height\" content=\"1095\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/webp\" \/>\n<meta name=\"author\" content=\"Alejandro Granata\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:creator\" content=\"@dreamhost\" \/>\n<meta name=\"twitter:site\" content=\"@dreamhost\" \/>\n<meta name=\"twitter:label1\" content=\"Written by\" \/>\n\t<meta name=\"twitter:data1\" content=\"Alejandro Granata\" \/>\n\t<meta name=\"twitter:label2\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data2\" content=\"10 minutes\" \/>\n<!-- \/ Yoast SEO Premium plugin. -->","yoast_head_json":{"title":"3 Modi Semplici per Creare un Intestazione Fissa (Sticky) in WordPress - DreamHost Blog","description":"Le intestazioni adesive fanno s\u00ec che i visitatori del sito web rimangano. Ecco 3 modi semplici per aggiungerne una al tuo sito WordPress \u2014 senza bisogno di competenze di codifica!","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/www-dev.dreamhost.com\/blog\/it\/3-modi-semplici-per-creare-un-intestazione-fissa-sticky-in-wordpress-it\/","og_locale":"en_US","og_type":"article","og_title":"3 Modi Semplici per Creare un Intestazione Fissa (Sticky) in WordPress","og_description":"Le intestazioni adesive fanno s\u00ec che i visitatori del sito web rimangano. Ecco 3 modi semplici per aggiungerne una al tuo sito WordPress \u2014 senza bisogno di competenze di codifica!","og_url":"https:\/\/www-dev.dreamhost.com\/blog\/it\/3-modi-semplici-per-creare-un-intestazione-fissa-sticky-in-wordpress-it\/","og_site_name":"DreamHost Blog","article_publisher":"https:\/\/www.facebook.com\/DreamHost\/","article_published_time":"2024-12-20T15:00:00+00:00","article_modified_time":"2025-06-11T20:18:39+00:00","og_image":[{"width":1460,"height":1095,"url":"https:\/\/www.dreamhost.com\/blog\/wp-content\/uploads\/2024\/12\/01_blog_hero_1460x1095_adding_a_sticky_header_in_wp.webp","type":"image\/webp"}],"author":"Alejandro Granata","twitter_card":"summary_large_image","twitter_creator":"@dreamhost","twitter_site":"@dreamhost","twitter_misc":{"Written by":"Alejandro Granata","Est. reading time":"10 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/www-dev.dreamhost.com\/blog\/it\/3-modi-semplici-per-creare-un-intestazione-fissa-sticky-in-wordpress-it\/#article","isPartOf":{"@id":"https:\/\/www-dev.dreamhost.com\/blog\/it\/3-modi-semplici-per-creare-un-intestazione-fissa-sticky-in-wordpress-it\/"},"author":{"name":"Alejandro Granata","@id":"https:\/\/www-dev.dreamhost.com\/blog\/#\/schema\/person\/8bfafd9aede4ad5a3bca7f83b60e3f72"},"headline":"3 Modi Semplici per Creare un Intestazione Fissa (Sticky) in WordPress","datePublished":"2024-12-20T15:00:00+00:00","dateModified":"2025-06-11T20:18:39+00:00","mainEntityOfPage":{"@id":"https:\/\/www-dev.dreamhost.com\/blog\/it\/3-modi-semplici-per-creare-un-intestazione-fissa-sticky-in-wordpress-it\/"},"wordCount":1999,"publisher":{"@id":"https:\/\/www-dev.dreamhost.com\/blog\/#organization"},"image":{"@id":"https:\/\/www-dev.dreamhost.com\/blog\/it\/3-modi-semplici-per-creare-un-intestazione-fissa-sticky-in-wordpress-it\/#primaryimage"},"thumbnailUrl":"https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/12\/01_blog_hero_1460x1095_adding_a_sticky_header_in_wp.webp","articleSection":["WordPress"],"inLanguage":"en-US"},{"@type":"WebPage","@id":"https:\/\/www-dev.dreamhost.com\/blog\/it\/3-modi-semplici-per-creare-un-intestazione-fissa-sticky-in-wordpress-it\/","url":"https:\/\/www-dev.dreamhost.com\/blog\/it\/3-modi-semplici-per-creare-un-intestazione-fissa-sticky-in-wordpress-it\/","name":"3 Modi Semplici per Creare un Intestazione Fissa (Sticky) in WordPress - DreamHost Blog","isPartOf":{"@id":"https:\/\/www-dev.dreamhost.com\/blog\/#website"},"primaryImageOfPage":{"@id":"https:\/\/www-dev.dreamhost.com\/blog\/it\/3-modi-semplici-per-creare-un-intestazione-fissa-sticky-in-wordpress-it\/#primaryimage"},"image":{"@id":"https:\/\/www-dev.dreamhost.com\/blog\/it\/3-modi-semplici-per-creare-un-intestazione-fissa-sticky-in-wordpress-it\/#primaryimage"},"thumbnailUrl":"https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/12\/01_blog_hero_1460x1095_adding_a_sticky_header_in_wp.webp","datePublished":"2024-12-20T15:00:00+00:00","dateModified":"2025-06-11T20:18:39+00:00","description":"Le intestazioni adesive fanno s\u00ec che i visitatori del sito web rimangano. Ecco 3 modi semplici per aggiungerne una al tuo sito WordPress \u2014 senza bisogno di competenze di codifica!","breadcrumb":{"@id":"https:\/\/www-dev.dreamhost.com\/blog\/it\/3-modi-semplici-per-creare-un-intestazione-fissa-sticky-in-wordpress-it\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/www-dev.dreamhost.com\/blog\/it\/3-modi-semplici-per-creare-un-intestazione-fissa-sticky-in-wordpress-it\/"]}]},{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/www-dev.dreamhost.com\/blog\/it\/3-modi-semplici-per-creare-un-intestazione-fissa-sticky-in-wordpress-it\/#primaryimage","url":"https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/12\/01_blog_hero_1460x1095_adding_a_sticky_header_in_wp.webp","contentUrl":"https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/12\/01_blog_hero_1460x1095_adding_a_sticky_header_in_wp.webp","width":1460,"height":1095,"caption":"3 Simple Ways To Create a Fixed (Sticky) Header in WordPress"},{"@type":"BreadcrumbList","@id":"https:\/\/www-dev.dreamhost.com\/blog\/it\/3-modi-semplici-per-creare-un-intestazione-fissa-sticky-in-wordpress-it\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/dhblog.dream.press\/blog\/"},{"@type":"ListItem","position":2,"name":"3 Modi Semplici per Creare un Intestazione Fissa (Sticky) in WordPress"}]},{"@type":"WebSite","@id":"https:\/\/www-dev.dreamhost.com\/blog\/#website","url":"https:\/\/www-dev.dreamhost.com\/blog\/","name":"DreamHost Blog","description":"","publisher":{"@id":"https:\/\/www-dev.dreamhost.com\/blog\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/www-dev.dreamhost.com\/blog\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"en-US"},{"@type":"Organization","@id":"https:\/\/www-dev.dreamhost.com\/blog\/#organization","name":"DreamHost","url":"https:\/\/www-dev.dreamhost.com\/blog\/","logo":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/www-dev.dreamhost.com\/blog\/#\/schema\/logo\/image\/","url":"https:\/\/dhblog.dream.press\/blog\/wp-content\/uploads\/2019\/01\/dh_logo-blue-2.png","contentUrl":"https:\/\/dhblog.dream.press\/blog\/wp-content\/uploads\/2019\/01\/dh_logo-blue-2.png","width":1200,"height":168,"caption":"DreamHost"},"image":{"@id":"https:\/\/www-dev.dreamhost.com\/blog\/#\/schema\/logo\/image\/"},"sameAs":["https:\/\/www.facebook.com\/DreamHost\/","https:\/\/x.com\/dreamhost","https:\/\/www.instagram.com\/dreamhost\/","https:\/\/www.linkedin.com\/company\/dreamhost\/","https:\/\/www.youtube.com\/user\/dreamhostusa"]},{"@type":"Person","@id":"https:\/\/www-dev.dreamhost.com\/blog\/#\/schema\/person\/8bfafd9aede4ad5a3bca7f83b60e3f72","name":"Alejandro Granata","image":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/06\/Alejandro-150x150.jpg","url":"https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/06\/Alejandro-150x150.jpg","contentUrl":"https:\/\/www-dev.dreamhost.com\/blog\/wp-content\/uploads\/2024\/06\/Alejandro-150x150.jpg","caption":"Alejandro Granata"},"description":"Alex is one of our WordPress specialists at DreamHost. He is responsible for providing technical support, optimization tips, and assisting customers with internal migrations. In his free time, he enjoys cooking, playing videogames, and reading. Follow Alex on LinkedIn: https:\/\/www.linkedin.com\/in\/agranata\/","sameAs":["https:\/\/www.linkedin.com\/in\/agranata\/"],"url":"https:\/\/www-dev.dreamhost.com\/blog\/author\/alejandrogranata\/"}]}},"lang":"it","translations":{"it":68546,"en":60688,"es":60675,"fr":70738,"nl":70760,"ru":72182,"pt":72187,"uk":72233,"pl":72251,"de":73034},"pll_sync_post":[],"_links":{"self":[{"href":"https:\/\/www-dev.dreamhost.com\/blog\/wp-json\/wp\/v2\/posts\/68546","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www-dev.dreamhost.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www-dev.dreamhost.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www-dev.dreamhost.com\/blog\/wp-json\/wp\/v2\/users\/1081"}],"replies":[{"embeddable":true,"href":"https:\/\/www-dev.dreamhost.com\/blog\/wp-json\/wp\/v2\/comments?post=68546"}],"version-history":[{"count":2,"href":"https:\/\/www-dev.dreamhost.com\/blog\/wp-json\/wp\/v2\/posts\/68546\/revisions"}],"predecessor-version":[{"id":68548,"href":"https:\/\/www-dev.dreamhost.com\/blog\/wp-json\/wp\/v2\/posts\/68546\/revisions\/68548"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www-dev.dreamhost.com\/blog\/wp-json\/wp\/v2\/media\/60689"}],"wp:attachment":[{"href":"https:\/\/www-dev.dreamhost.com\/blog\/wp-json\/wp\/v2\/media?parent=68546"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www-dev.dreamhost.com\/blog\/wp-json\/wp\/v2\/categories?post=68546"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www-dev.dreamhost.com\/blog\/wp-json\/wp\/v2\/tags?post=68546"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}