L'aggiunta di una barra di condivisione social flottante può migliorare notevolmente la visibilità dei tuoi contenuti e incoraggiare i lettori a promuoverli sui social media. Una barra flottante rimane con l'utente durante lo scorrimento, rendendo facile la condivisione dei contenuti in qualsiasi momento.
Gestendo i nostri siti, abbiamo visto l'impatto delle barre di condivisione social flottanti nell'aumentare l'engagement e il traffico. Aggiungendo strategicamente questa funzionalità ai nostri siti web, abbiamo osservato un notevole aumento delle condivisioni social e una maggiore diffusione dei nostri contenuti.
Che tu gestisca un blog o un'attività commerciale, l'aggiunta di una barra di condivisione social flottante può essere un modo semplice per incoraggiare l'engagement ed espandere la tua presenza online.
In questo articolo, ti guideremo attraverso il processo di aggiunta di una barra di condivisione social flottante al tuo sito WordPress. Le nostre istruzioni passo passo la rendono semplice anche per i principianti.
Perché aggiungere una barra di condivisione social flottante in WordPress?
L'aggiunta di una barra di condivisione social prominente rende facile per i visitatori condividere i tuoi contenuti su piattaforme di social media come Instagram, Facebook e Twitter. Mantenendo questa barra visibile durante lo scorrimento, offri un modo conveniente agli utenti per condividere i tuoi contenuti in qualsiasi momento.
Questo può portare a un aumento dell'engagement, del traffico e della consapevolezza del marchio. Inoltre, può motivare gli utenti a lasciare commenti e like o a seguire i tuoi aggiornamenti.
Oltre a ciò, una barra di condivisione social fluttuante può migliorare indirettamente il posizionamento del tuo sito web aumentando i segnali sociali. Quando gli utenti condividono i tuoi contenuti sui social media, genera backlink al tuo sito web, il che può influire positivamente sul tuo posizionamento nei motori di ricerca.
Detto questo, diamo un'occhiata a come aggiungere facilmente una barra di condivisione social fluttuante in WordPress. In questo tutorial, discuteremo un metodo basato su codice e un metodo basato su plugin. Puoi utilizzare i link sottostanti per passare all'approccio di tua scelta:
- Metodo 1: Aggiungere una barra di condivisione social fluttuante con WPCode
- Metodo 2: Aggiungere una barra di condivisione social fluttuante con un plugin
- Bonus: Aggiungere una barra social fluttuante in WordPress
Metodo 1: Aggiungere una barra di condivisione social fluttuante con WPCode
Se stai cercando un modo personalizzabile e semplice per aggiungere una barra di condivisione social fluttuante in WordPress, allora questo metodo fa per te.
Per questo approccio, utilizzeremo WPCode perché è il miglior plugin per snippet di codice WordPress sul mercato. Per maggiori informazioni su questo strumento, consulta la nostra recensione completa di WPCode.
WPCode dispone di un'ampia libreria di snippet di codice predefiniti, inclusa una soluzione pronta all'uso per aggiungere una barra di condivisione social fluttuante. Ciò elimina la necessità di codifica personalizzata e rende facile implementare questa funzionalità sul tuo sito web.
Per prima cosa, devi installare e attivare il plugin WPCode. Per maggiori informazioni, consulta la nostra guida per principianti su come installare un plugin di WordPress.
Nota: WPCode ha una versione gratuita. Tuttavia, per sbloccare la libreria di snippet di codice, avrai bisogno del piano pro del plugin.
Dopo l'attivazione, vai alla pagina Frammenti di codice » + Aggiungi frammento dalla dashboard di WordPress e utilizza la casella di ricerca per individuare il frammento ‘Icone social media fluttuanti’.
Una volta fatto ciò, fai semplicemente clic sul pulsante ‘Usa frammento’ sotto di esso.
Questo aprirà la pagina ‘Modifica frammento’ sul tuo schermo. Noterai che il frammento di codice per la barra di condivisione social fluttuante, con collegamenti a Facebook, Instagram, Twitter e LinkedIn, è già stato aggiunto alla casella ‘Anteprima codice’.
Ora puoi usare il frammento di codice così com'è oppure scorri verso il basso e cambia la posizione, il margine, la larghezza, il colore di sfondo, l'altezza e il raggio del bordo per le icone.
Ad esempio, il colore di sfondo per queste icone dei social media è nero per impostazione predefinita. Tuttavia, puoi sostituirlo con il codice esadecimale di un colore che si abbini meglio al tuo marchio.
Dopodiché, scorri di nuovo verso l'alto e cambia l'interruttore da ‘Inattivo’ ad ‘Attivo’.
Quindi, fai clic sul pulsante ‘Aggiorna’ per salvare le impostazioni e aggiungere una barra di condivisione social fluttuante.
Ora puoi visitare il tuo sito web per vedere le icone dei social media in azione.
Ecco come appariva sul nostro sito demo.
Metodo 2: Aggiungere una barra di condivisione social fluttuante con un plugin
Se non vuoi usare codice personalizzato sul tuo sito web, allora questo metodo fa per te. Detto questo, tieni presente che non otterrai tante opzioni di personalizzazione con questo approccio.
Innanzitutto, devi installare e attivare il plugin Floating Social Share Icons. Per i dettagli, consulta il nostro tutorial su come installare un plugin di WordPress.
Dopo l'attivazione, visita la pagina Floating Links & Social Icons dalla bacheca di WordPress. Per impostazione predefinita, il plugin aggiungerà automaticamente icone fluttuanti che consentono agli utenti di visitare la home page, il post successivo, il post precedente, l'inizio della pagina e la fine della pagina e copiare l'URL corrente.
Tuttavia, se non hai bisogno di nessuna di queste funzionalità, puoi disattivare l'interruttore per queste opzioni. Una volta fatto ciò, le tue modifiche verranno sincronizzate automaticamente.
Successivamente, vai alla pagina Floating Links & Social Icons » Social Icons dalla barra laterale dell'amministratore.
Per personalizzare la tua barra di condivisione social fluttuante, semplicemente attiva l'interruttore accanto alle piattaforme di social media desiderate. Ciò farà apparire le icone corrispondenti sulla tua barra, consentendo ai visitatori di condividere facilmente i tuoi contenuti.
Le tue impostazioni verranno salvate automaticamente una volta apportate le modifiche.
Quindi, puoi visitare il tuo sito WordPress per vedere la barra di condivisione social fluttuante in azione.
Bonus: Aggiungere una barra social fluttuante in WordPress
Se vuoi, puoi anche aggiungere una barra social fluttuante con pulsanti di follow in WordPress.
Ciò consente ai visitatori di connettersi facilmente ai tuoi profili social e rimanere aggiornati sulle tue ultime notizie ed eventi. Rendendo conveniente per gli utenti seguirti sui social media, puoi espandere la tua portata e promuovere una community dedicata.
Per fare ciò, avrai bisogno di OptinMonster, che è il miglior strumento di generazione di lead sul mercato. Inoltre, viene fornito con un modello predefinito per creare una barra social fluttuante.
Innanzitutto, visita il sito web di OptinMonster e registrati per un account. Ricorda che dovrai acquistare il piano Basic perché include il tipo di campagna Floating Bar.
Quindi, vai alla tua bacheca di WordPress per installare e attivare il plugin connettore OptinMonster. Per i dettagli, consulta il nostro tutorial su come installare un plugin di WordPress.
Dopo l'attivazione, vedrai la schermata di benvenuto e la procedura guidata di configurazione. Fai clic sul pulsante ‘Connetti il tuo account esistente’.
Puoi quindi seguire le istruzioni sullo schermo per collegare il tuo account OptinMonster con WordPress.
Una volta fatto, vai alla pagina OptinMonster » Templates dalla bacheca di WordPress e seleziona 'Floating Bar' come tipo di campagna.
Successivamente, fai clic sul pulsante 'Use Template' per il modello 'Follow on Social Media'. Si aprirà una finestra in cui dovrai aggiungere un nome per la campagna che stai per creare.
Il costruttore drag-and-drop di OptinMonster si avvierà ora sul tuo schermo.
Qui puoi progettare la tua barra fluttuante.
Il plugin offre diversi blocchi che puoi semplicemente trascinare e rilasciare sul modello. Ad esempio, puoi aggiungere un'immagine, testo, pulsante e altro alla tua barra dei social media.
Per saperne di più, consulta il nostro tutorial su come aggiungere una barra di avviso in WordPress.
Dopodiché, fai clic sui pulsanti di follow dei social media all'interno della barra mobile. Questo aprirà alcune nuove impostazioni nella colonna di sinistra.
Qui puoi aggiungere rispettivamente l'URL delle tue pagine Facebook, Instagram e Twitter.
Una volta terminato, passa alla scheda 'Pubblica' dall'alto e cambia lo stato della campagna in 'Pubblica'. Quindi, dovrai fare clic sul pulsante 'Salva' e chiudere il generatore visivo.
Ora puoi visitare il tuo sito WordPress per vedere la barra social mobile in azione.
Speriamo che questo articolo ti abbia aiutato a imparare come aggiungere una barra di condivisione social mobile in WordPress. Potresti anche voler consultare la nostra guida per principianti su come aggiungere pulsanti di condivisione social in WordPress e le nostre migliori scelte per i migliori plugin per social media per far crescere il tuo sito.
Se ti è piaciuto questo articolo, iscriviti al nostro canale YouTube per tutorial video su WordPress. Puoi anche trovarci su Twitter e Facebook.
zak
Quale plugin per i social media usi su questo sito? Perché sembra diverso dalla tua barra mobile di condivisione social?
Supporto WPBeginner
Ciao zak,
Sì, è scritto specificamente per WPBeginner.
Amministratore
Stephanie
Come si aggiungono i pulsanti di condivisione in fondo al post invece che in cima?
Grazie
Ralph Eastwood
Ho appena installato il plugin. Sembra carino. C'è un modo per avere la barra in fondo al post? Sembra più sensato averla lì. Le persone condivideranno un post una volta che l'hanno letto e pensano che abbia valore – non voglio fare affidamento sul fatto che scrollino fino in cima solo per condividere!
Laura
Ho installato, attivato e aggiunto Facebook alla casella 'servizi social abilitati'. Non ho un account utente Twitter, quindi ho lasciato vuota quella parte. Ho salvato le impostazioni ma la scheda di Facebook non appare sul mio sito web! Mi sono perso qualcosa? Grazie
sham
Il mio conteggio social è tornato a zero dopo la migrazione a HTTPS. Come si risolve?
Alan
Le tue istruzioni dicono: "Successivamente, aggiungi il tuo ID Twitter nel campo ..."
Io stesso non ho un account Twitter. Non posso usare questo plugin senza iscrivermi a Twitter? (Sono su Facebook e LinkedIn.)
Staff editoriale
Non abilitare il pulsante di condivisione di Twitter o semplicemente lascialo vuoto. Ti permette di ottenere più follower se inserisci lì l'ID di Twitter.
Amministratore
Siska
Vorrei usare questo plugin, ma non riesco a trovare un modo per cambiare il colore dello sfondo... Il mio sito web non è bianco.
Siska
Vorrei usare questo plugin, ma non riesco a trovare un modo per cambiare il colore dello sfondo... Il mio sito web non è bianco
Supporto WPBeginner
Prova ad aggiungere questo nel foglio di stile del tuo tema:
#fsb-social-bar { border-bottom: 1px solid #f1f1f1; border-top: 1px solid #f1f1f1; padding: 10px 0; margin: 0px 0 20px 0; float: left; background: #222; position: relative; clear: both; }1-click Use in WordPress
Amministratore
Jean
Grazie per questo! Come si potrebbe fare per tracciare le condivisioni come obiettivo in Google Analytics?
Elisa
Errore quando si preme il pulsante google +1. Ottengo un triangolo rosso e non riesco a risolverlo.
Aiuto !!!
Rick
Come posso disattivare la visualizzazione del numero di volte in cui è stato condiviso? Non voglio che venga mostrato il conteggio delle condivisioni.
Rebecca
Ciao, bel plugin. Ho però un problema, quando uso il pulsante "pin it", ritaglia la foto. Come posso evitarlo?
Skwty
Volevo solo avvisarti che il tuo plugin Floating Social Bar stava causando problemi con il mio tema WP-Bold. Rimuoveva l'estratto dal widget che usavo per visualizzare contenuti correlati nella barra laterale. Il titolo c'era, ma solo su single.php l'estratto scompariva. Il supporto di Solostream ha menzionato che avrei dovuto segnalarlo. Ho cambiato plugin a causa di questo, ma preferirei di gran lunga usare Floating Social Bar.
Grazie!
Zomi Daily
Puoi per favore includere il pulsante di condivisione di Facebook, per favore?
Jon Brown
Stai ancora pianificando di rilasciare una versione che includa i conteggi dei commenti come fa questo sito? Anche se non è pronto per il rilascio, il codice è pubblico?
Jorge
Hi! Thanks for the great plugin. I have some questions when people press like or +1 do they share the post in my blog too? How can people share my content from the social bar? What is the capital of North Dakota
Thanks again!
Julius
Ottimo plugin, ma purtroppo consuma molte risorse. Il plugin P3 mostra che consuma il 51% di tutti i miei plugin (ho 12 plugin).
Supporto WPBeginner
Lo usiamo sui nostri siti e siamo molto attenti alla velocità delle pagine. Per quanto riguarda il plugin P3, i risultati dei test possono essere influenzati da molti fattori come altri servizi in esecuzione sul tuo server, se sei su un server condiviso, questo influenzerà anche i risultati.
Amministratore
Urmet
Ottimo plugin – vorrei sapere una cosa – posso averlo in modo che il contatore si carichi immediatamente – come lo hai sulla tua pagina – i numeri di condivisione sono visibili anche se non passo il mouse sopra il plugin.
Haider
Ottimo Plugin Davvero!
I finally activated and modified it a little to suit my theme
Ho alcune domande:
1. Prevedi di includere il nuovo pulsante di condivisione di Facebook insieme al pulsante Mi piace? Per favore, considera questo.
2. Non sarebbe meglio gestire lo stile con un file CSS separato piuttosto che con CSS inline? Molti temi premium hanno l'opzione per CSS personalizzato che viene aggiunto all'intestazione; ma in questo caso non funziona. Ho dovuto modificare il file del plugin per cambiare gli stili.
Grazie mille per un prodotto così fantastico!
Jenn Marie
Ciao! Da persona di alta qualità a un'altra: ti vedo. Questo plugin spacca, e sospetto che sia dovuto alla meticolosità che vedo in tutto ciò che fai!
Una domanda: hai idea del perché la barra non sia fissa per me su iPhone (iOS7)? Sto usando Point, un tema responsive. Ho provato a disabilitare altri plugin social.