Come aggiungere le icone dei social media al menu di WordPress
Pubblicato: 2020-10-24Indipendentemente dal fatto che tu gestisca un'azienda o un sito personale, devi assicurarti che gli utenti possano condividere i tuoi contenuti sui social media. Ecco perché in questo post ti mostreremo come aggiungere le icone dei social media al menu di WordPress .
Perché aggiungere le icone dei social media al menu di WordPress?
Secondo studi recenti, quasi il 50% della popolazione mondiale utilizza almeno un social network. Collegare il tuo sito a Facebook o aggiungere feed di Instagram al tuo sito Web sono buone opzioni, ma c'è qualcos'altro che puoi fare per far crescere la tua presenza sui social media. Il menu è uno degli elementi più importanti del tuo sito. Inoltre, è una delle prime cose che gli utenti vedono quando visitano il tuo sito. Ad esempio, dai un'occhiata al menu principale del nostro sito web.
Quindi, per personalizzare il tuo sito e sfruttare al meglio i tuoi canali di social media, puoi aggiungere le icone dei social media al menu di WordPress. Inoltre, puoi visualizzare icone su altre aree del tuo sito che supportano widget come il piè di pagina, la barra laterale e così via.
Anche se alcuni temi come Divi includono alcune opzioni per aggiungere le icone dei social media al menu, la maggior parte dei temi non include questa funzione. E WordPress non include nemmeno una funzionalità nativa per includere le icone nel menu.
Quindi, in questo post, ti mostreremo tre metodi per aggiungere facilmente le icone dei social media al tuo menu di WordPress .
Come aggiungere le icone dei social media al menu di WordPress
Esistono tre modi principali per aggiungere le icone dei social media al menu di WordPress:
- Con plugin
- Menu Quad
- Icone sociali WP
- Dal personalizzatore del tema
- Usando manualmente le icone di FontAwesome
In questa guida, descriveremo passo dopo passo ogni metodo in modo che tu possa scegliere quello che ti piace di più.
1) Plugin
L'uso dei plug-in è il modo più semplice per includere le icone dei social media nel menu. Ci sono diverse opzioni là fuori, quindi, per semplificarti la vita, abbiamo elencato due dei migliori plugin che puoi usare.
1.1) Menu Quad
QuadMenu è lo strumento migliore per personalizzare facilmente e portare i menu di WordPress al livello successivo. Questo è un plugin freemium. È disponibile una versione gratuita con funzionalità di base e tre piani premium dotati di funzionalità più avanzate e supporto prioritario.
Per aggiungere le icone dei social media al tuo menu, è necessaria la versione premium. Vediamo quindi come installarlo e attivare il plugin sul tuo sito.
Installazione e attivazione
Innanzitutto, devi acquistare il plug-in e scaricare i file sul desktop. Quindi, prima di installarlo, devi installare la versione gratuita sul tuo sito. Per farlo, vai alla dashboard del tuo WP> Plugin> Aggiungi nuovo . Quindi, usa la barra di ricerca e cerca QuadMenu. Successivamente, premi Installa e quindi Attiva .
Dopo l'attivazione, utilizza i file della versione premium che hai scaricato in precedenza e installali sul tuo sito.
Una volta attivato il plugin, dovrai verificare la tua chiave di licenza. Dalla dashboard del tuo account QuadMenu, vedrai l'opzione delle licenze.
Copia la chiave da lì e incollala nel campo delle licenze con il tuo indirizzo email registrato per verificare la tua chiave.
Il plug-in è disponibile nel nostro negozio, Envato e nel mercato Elegant, quindi utilizza il menu a discesa per selezionare l'opzione appropriata per il tuo acquisto. Dopo averlo verificato, sei a posto.
Aggiungi le icone dei social media al menu di WordPress con QuadMenu
QuadMenu funziona con qualsiasi tema gratuito o premium. Per questa demo, utilizzeremo GeneratePress ma il processo è simile a qualsiasi altro tema. Per prima cosa, andiamo alle impostazioni del plug-in andando su QuadMenu> Opzioni .
Lì vedrai diverse opzioni di personalizzazione come:
- Menù primario
- reattivo
- Tema predefinito
- personalizzare
- Sociale
- Importa/Esporta
Configura le opzioni social
Nel nostro caso, dobbiamo aggiungere le icone dei social media al nostro menu principale. Quindi, selezioneremo l'opzione Social .
Vedrai diverse opzioni predefinite che puoi modificare o eliminare a seconda dei canali che hai. Hanno già assegnato icone con i profili dei social media.
Tuttavia, puoi anche personalizzarli facendo clic sul pulsante + Aggiungi icona . Inoltre, puoi aggiungere nuovi canali di social media premendo il pulsante + .
Diciamo che vuoi cambiare l'icona di Facebook. Premi + Aggiungi icona e vedrai un pop-up con molte icone tra cui puoi scegliere.
Ci sono molte icone, quindi ti consigliamo di utilizzare la funzione di ricerca per filtrare i risultati.
Come puoi vedere, abbiamo cercato le icone di Facebook. Ti mostrerà tutte le icone disponibili relative alla tua query di ricerca, quindi seleziona quella che ti piace e salvala. Puoi anche modificare i titoli e gli URL. Dopo aver apportato tutte le modifiche desiderate in QuadMenu, salvare le impostazioni.
Successivamente, vai ai menu di WordPress. Vedrai tutti i menu disponibili lì. Per utilizzare le opzioni QuadMenu nel menu, è necessario contrassegnarlo come QuadMenu Dev nelle impostazioni del menu . Successivamente, salva il menu.
Al caricamento della pagina successiva, vedrai le opzioni QuadMenu.
Sotto le voci QuadMenu, vedrai l'elenco delle icone Social . Selezionali e premi Aggiungi al menu .
Successivamente, vedrai la sezione Social sotto le opzioni del menu principale. Passa il mouse sopra e vedrai le opzioni di personalizzazione di QuadMenu.
Se hai bisogno di una personalizzazione aggiuntiva, seleziona quell'opzione. Altrimenti, premi il pulsante Salva menu e sei a posto.
Icone nel menu (anteriore)
Ora è il momento di controllare i risultati. Quindi, vai alla home page del tuo sito web e vedrai le icone social. E quando ci passi sopra con il mouse, le icone verranno visualizzate.
Questo è tutto! Hai aggiunto con successo le icone dei social media ai menu di WordPress con QuadMenu .
1.2) Icone del menu WP
Se non puoi permetterti plug-in premium, non preoccuparti. Abbiamo una soluzione gratuita per te. In questa sezione, ti mostreremo come aggiungere icone dei social media al tuo WordPress con un plug-in gratuito chiamato Icone del menu WP.
Installazione e attivazione
Innanzitutto, installa e attiva le icone del menu WP sul tuo sito.
Questo strumento è molto facile da usare e non richiede alcuna personalizzazione aggiuntiva.
Personalizzazione delle icone dei menu
Se non hai un menu sul tuo sito, puoi crearne uno dalla sezione di configurazione.
Assegna una posizione al tuo menu e poi sei pronto per aggiungere elementi ad esso. Per aggiungere i tuoi profili social al menu, scegli la voce Collegamenti personalizzati . Dovrai inserire l'URL della pagina che desideri collegare e un'etichetta. Quindi, premi Aggiungi al menu .
Dopo aver aggiunto l'icona al menu, la pagina di configurazione sarà simile a questa.
Allo stesso modo, puoi aggiungere altre icone dei social media. In questo caso, abbiamo aggiunto le icone di Twitter, Pinterest e Instagram al nostro menu.
Sulle voci di menu, c'è un pulsante + . Questa è l'impostazione che devi usare per aggiungere icone alle voci di menu, quindi fai clic su di essa.
Quindi, vedrai un'ampia selezione di articoli tra cui scegliere.
Ci sono dozzine di icone, quindi usa la funzione di ricerca per filtrare i risultati desiderati. In questo caso, abbiamo selezionato la voce di menu Facebook, quindi cercheremo l'icona di Facebook. Dopo aver selezionato quello che ti piace, vedrai le impostazioni dell'icona nella colonna di destra. Qui puoi visualizzare o nascondere l'etichetta, personalizzare la posizione, le dimensioni e l'allineamento. In questo caso, nasconderemo l'etichetta. Al termine della personalizzazione, fai clic su Salva .
Puoi personalizzare le icone di Pinterest, Twitter e Instagram allo stesso modo. Dopo aver aggiunto le icone richieste, salvare il menu.
Ora è il momento di controllare il risultato. Vai al frontend del tuo sito web e vedrai le nuove icone.
Ecco come puoi aggiungere le icone dei social media ai menu di intestazione in WordPress con le icone del menu WP . Infine, puoi anche dare uno stile alle tue icone dalla pagina delle impostazioni delle icone del menu WP.
2) Aggiungi le icone dei social media con il Customizer del tema
Se non desideri installare alcun plug-in, puoi includere le icone dei social media nei menu utilizzando il programma di personalizzazione del tema. Alcuni temi premium come Divi, Newspaper o Avada sono dotati di pannelli tematici integrati che ti consentono di personalizzare il tema e aggiungere icone di social media.
Se non sei sicuro che il tuo tema abbia l'opzione per aggiungere le icone dei social media, nella dashboard di WordPress vai su Aspetto > Personalizza > Menu > Visualizza posizioni e controlla se c'è un menu social o un'opzione icona social.
Per la nostra dimostrazione, utilizzeremo il tema Divi di Elegant Themes. Innanzitutto, vai alla dashboard del tuo WP> Aspetto> Personalizza .
Quindi, vai alla personalizzazione dell'intestazione e agli elementi dell'intestazione. Lì vedrai un'opzione per abilitare le icone social dell'intestazione.
Abilita questa opzione e poi la vedrai nell'intestazione del tuo sito web.
Inoltre, puoi personalizzarli andando su Divi > Opzioni tema .
Lì puoi abilitare le icone che desideri e inserire l'URL dei tuoi profili sui social media. Le icone dei social media appariranno sia nell'intestazione che nel piè di pagina del tuo sito per impostazione predefinita.
Tuttavia, puoi scegliere di nasconderli tramite le impostazioni di personalizzazione.
Altri temi come Giornale e Newsmag hanno le proprie opzioni di personalizzazione, quindi puoi abilitare/disabilitare le icone e visualizzarle direttamente attraverso il pannello del tema dedicato. Se non riesci a trovare la sezione delle icone dei social media nel pannello o nel pannello di personalizzazione del tema, sentiti libero di lasciare un commento qui sotto e cercheremo di aiutarti.
3) Utilizzo di FontAwesome
Infine, puoi aggiungere manualmente le icone dei social media ai tuoi menu in WordPress. Anche se non sei uno sviluppatore o non hai competenze di programmazione, puoi visualizzare le icone dei social media con un po' di codifica HTML. Per farlo, useremo le icone di FontAwesome.
Quindi, la prima cosa che devi fare è visitare il sito Web FontAwesome.
Usa la funzione di ricerca per trovare le icone di cui hai bisogno. Per questa demo, cercheremo le icone di Twitter .
Nella pagina successiva, il sito Web ti mostrerà i risultati della ricerca. Scegli quello che ti piace di più.
Nella pagina successiva, vedrai i dettagli dell'icona che hai selezionato, quindi copia semplicemente il codice HTML dell'icona.
Aggiunta di icone fantastiche per i caratteri a WordPress
Quindi, vai alla sezione dei menu sul tuo sito WordPress. Sul lato sinistro, vedrai la sezione dei collegamenti personalizzati. Dovrai inserire l'URL del tuo profilo Twitter e incollare il codice HTML che hai appena copiato nel campo Testo del link . Una volta fatto, premi Aggiungi al menu .
Successivamente, salva le modifiche. Quindi, vai al frontend del tuo sito e vedrai l'icona.
In questo modo, sarai in grado di aggiungere qualsiasi icona di social media al tuo menu .
Il codice HTML non funziona
Se hai seguito ogni passaggio di questo tutorial ma l'HTML non funziona, prova questo. Se il fab code non funziona, prova a modificare il codice HTML rimuovendo b dal fab .
Quindi, ad esempio, nel nostro caso, il codice HTML finale sarà simile a questo <i class=”fa fa-twitter”></i> invece di <i class=”fab fa-twitter”></i> . Esempio:
Aggiungi le icone dei social media all'intestazione di WordPress
L'intestazione è uno dei luoghi più popolari in cui potresti voler aggiungere le icone dei social media, quindi vediamo rapidamente come farlo utilizzando il Customizer del tema.
Nota che avrai bisogno di un tema che ti dia la possibilità di aggiungere le icone dei social media al menu. Inoltre, tieni presente che i passaggi potrebbero essere leggermente diversi a seconda del tema, ma dovresti essere in grado di seguire i passaggi senza problemi nella maggior parte dei temi.
Diamo un'occhiata a due opzioni: creare un nuovo menu e modificarne uno esistente.
Aggiunta delle icone dei social media all'intestazione in un nuovo menu
- Nella dashboard di WordPress, vai su Aspetto > Menu
- Premi il collegamento Crea un nuovo menu accanto al pulsante Seleziona e assegnagli un nome
- Ora puoi aggiungere le icone ad esso. Seleziona il nuovo menu e inserisci i social media e gli URL che desideri includere (Instagram, Facebook, YouTube e così via) e premi Aggiungi al menu
- Salva le modifiche
- Successivamente, posiziona il menu che hai appena creato nella sezione dell'intestazione
- Salva le modifiche e il gioco è fatto! È così che aggiungi le icone dei social media all'intestazione di WordPress!
Aggiunta di icone di social media all'intestazione in un menu esistente
- Nella dashboard di WordPress, vai su Aspetto > Personalizza > Menu
- Vai alla sezione Intestazione e premi il pulsante Aggiungi elementi
- Quindi seleziona l'icona della piattaforma di social media che desideri aggiungere, inserisci l'URL e premi Aggiungi al menu . Devi fare lo stesso per ogni social media che vuoi aggiungere
- Seleziona la posizione del menu in cui desideri visualizzare le icone. Le opzioni che hai dipenderanno dal tuo tema.
- Salva le modifiche. Questo è tutto!
In alternativa, se vuoi aggiungere le icone al piè di pagina, ad esempio, segui la stessa procedura ma seleziona il piè di pagina come posizione per le icone.
Bonus: apri le icone dei social media in una nuova scheda
L'aggiunta di icone dei social media al menu di WordPress ti aiuterà a far crescere la tua presenza sui social media. Tuttavia, il problema è che quando un utente fa clic sull'icona nel tuo menu, la pagina del social media verrà caricata nella stessa finestra e l'utente lascerà il tuo sito. La soluzione è fare in modo che l'icona dei social media carichi la pagina in una nuova scheda. Vediamo come farlo.
Nella dashboard di WordPress, vai su Aspetto > Menu , apri le Opzioni schermo in alto a destra e abilita l'opzione Link Target . Quindi, vai su ciascun elemento del menu e seleziona la casella di controllo Apri collegamento in una nuova scheda . In alternativa, puoi impostare ogni destinazione su _blank.
Infine, salva le modifiche e il gioco è fatto!
Come aggiungere feed social al tuo sito
Oltre ad aggiungere le icone dei social media al tuo menu, puoi anche aggiungere feed social al tuo sito per aumentare il coinvolgimento con i tuoi utenti. Nella sezione, ti mostreremo come collegare Instagram e TikTok al tuo sito web.
Aggiungi un feed Instagram a WordPress
Il modo più semplice per connettere Instagram al tuo sito è utilizzare il plug-in Social Feed Gallery. È uno strumento freemium che ti consente di visualizzare il tuo feed di Instagram in pochi clic.
Innanzitutto, installa e attiva il plug-in da questo link. Quindi, vai alla Galleria dei feed social e accedi al tuo account Instagram.
Successivamente, vai su Social Feed Gallery > Account e avrai la possibilità di accedere al tuo account personale o aziendale (tieni presente che l'account aziendale ha più opzioni). Quindi, aggiungi un account, accedi e concedi all'app le autorizzazioni necessarie per connettere il tuo account a WordPress.
Una volta fatto, vai alla scheda Feed , premi +Feed e aggiungi il feed che desideri visualizzare. Infine, personalizza il tuo feed e una volta terminato, vedrai che il plug-in ti fornisce uno shortcode che puoi incollare su qualsiasi pagina o post per visualizzare il tuo feed.
Per ulteriori informazioni, consulta la nostra guida su come integrare Instagram con WordPress.
Aggiungi un feed TikTok a WordPress
Allo stesso modo, puoi anche collegare il tuo sito a TikTok. Per visualizzare i feed di TikTok, utilizzeremo un plug-in dedicato chiamato WP TikTok Feed. Questo è il plug-in TikTok più popolare per WordPress e ha una versione gratuita e alcuni piani premium.
Dopo aver installato e attivato il plugin, nella dashboard di WordPress , devi collegare il tuo account TikTok e poi andare su Tiktok Feed > Feed . Lì, premi +Feed e aggiungi il feed che desideri visualizzare. Inoltre, vedrai diverse opzioni per personalizzare il modo in cui visualizzi il feed sul tuo sito.
Per ulteriori informazioni a riguardo, dai un'occhiata al nostro tutorial su come incorporare video TikTok in WordPress.
Conclusione
Tutto sommato, aggiungere le icone dei social media ai menu di WordPress è un modo eccellente per aumentare la tua presenza sui social media. In questa guida abbiamo visto 3 modi diversi per farlo:
- Con plugin
- Dal personalizzatore del tema
- Manualmente
Se il tuo tema ti consente di aggiungere icone per impostazione predefinita, non è necessario utilizzare plug-in o codice HTML aggiuntivi. Se preferisci un plugin, ti consigliamo di utilizzare QuadMenu. Ti consentirà di ottenere il pieno controllo dell'intera personalizzazione del menu di WordPress e include anche molte potenti funzionalità.
Tuttavia, se preferisci una soluzione gratuita, dai un'occhiata alle icone del menu WP. È uno strumento semplice che ti aiuterà a includere icone social in pochissimo tempo.
D'altra parte, se non vuoi installare alcun plug-in, puoi aggiungere icone di social media usando un po' di icone HTML e FontAwesome. Questa opzione ti consente anche di personalizzare le icone con un po' di CSS oppure puoi evitare la parte di stile e utilizzare le icone predefinite.
Hai trovato utile questo articolo? Se lo hai fatto, lasciaci un commento qui sotto e condividi questo post sui social media. Per ulteriori tutorial correlati, consulta le seguenti guide:
- I migliori plugin per aggiungere feed di social media a WordPress
- Come aggiungere feed di gruppo Facebook a WordPress