Trusted WordPress tutorials, when you need them most.
Beginner’s Guide to WordPress
Coppa WPB
25 Million+
Websites using our plugins
16+
Years of WordPress experience
3000+
WordPress tutorials
by experts

Come aggiungere il pulsante ufficiale di Twitter Follow in WordPress

Twitter sta estendendo le sue funzionalità a tutto il mondo. Tutto è iniziato con il pulsante ufficiale per i tweet, poi con la piattaforma Twitter Anywhere e, recentemente, con il nuovo pulsante ufficiale Twitter Follow. Probabilmente vi starete chiedendo cosa diavolo sia questo pulsante “follow” di Twitter? Che cosa c’è di diverso tra il pulsante follow di Twitter e il pulsante follow intelligente? Non preoccupatevi, in questo articolo copriremo cos’è il pulsante Twitter Follow e come potete aggiungerlo al vostro sito WordPress.

Che cos’è il pulsante Twitter Follow?

Il pulsante Twitter Follow è un piccolo widget che consente agli utenti di seguire facilmente il vostro account Twitter (o qualsiasi altro account Twitter) da qualsiasi sito web. Il pulsante follow utilizza lo stesso modello di implementazione del pulsante tweet ufficiale ed è davvero semplice da integrare. È possibile vedere la demo del pulsante follow nell’angolo in alto a sinistra dell’immagine sottostante. Facendo clic sul pulsante follow, si apre una finestra con ulteriori informazioni sull’utente.

Twitter Follow Button

Vi starete chiedendo in che modo è diverso dal pulsante Smart Follow qui sotto?

Il pulsante Smart Follow necessita dell’integrazione con Twitter Anywhere. Inoltre, non consente di mostrare il numero di follower o di effettuare personalizzazioni. Il pulsante Twitter Follow, invece, permette di mostrare il numero di follower ed è molto facile da integrare. Selezionate l’esempio dal vivo qui sotto (non dimenticate di fare clic su follow per vedere cosa fa):

Come aggiungere il pulsante ufficiale di Twitter Follow in WordPress

Potete andare alla pagina Follow Button e generare un codice per voi. Oppure potete semplicemente copiare il codice qui sotto:

<a href="#x7">Follow @wpbeginner</a>

P.S. Assicuratevi di cambiare il nome utente con il vostro.

Se si utilizza il pulsante ufficiale per i tweet, non è necessario incollare lo script due volte. Il vostro codice sarà quindi simile a questo:

<a href="#x9">Follow @wpbeginner</a>

Ora potete incollare il codice in qualsiasi punto del vostro tema WordPress. La maggior parte delle persone inserisce il codice nel file barra laterale.php. Tuttavia, se non vi sentite a vostro agio nel modificare un file del tema, potete utilizzare anche i widget del tema di WordPress. Tutti i temi migliori sono dotati di barre laterali pronte per i widget. Quindi, tutto ciò che si deve fare è andare alla scheda Aspetto ” Widget. Quindi aggiungere un widget di testo alla barra laterale appropriata. Infine, incollate il codice qui sopra e il gioco è fatto. Guardate lo screenshot qui sotto per l’esempio:

Twitter Follow Button Widget

Non c’è davvero bisogno di aggiungere un plugin per fare qualcosa di così semplice.

Personalizzazioni avanzate

Questa sezione è dedicata ai progettisti e agli sviluppatori che desiderano personalizzare ulteriormente questo pulsante in corrispondenza dello schema di colori del proprio sito, ecc. Twitter consente di personalizzare il colore del pulsante, il colore del testo, il colore del collega, la lingua, il widget e l’allineamento del plugin.

Variabili disponibili nella versione JavaScript che stiamo utilizzando:

  • data-show-count(vero o falso)
  • data-button(blu o grigio)
  • data-text-color (codice esadecimale)
  • data-link-color (codice esadecimale)
  • data-lang (en, fr, de, es) – utilizza il codice di due lettere ISO-639-1 della lingua
  • larghezza dati – (300px)
  • data-align – (destra)

Se si volesse specificare il codice a, il risultato sarebbe simile a questo:

<a href="#x12">Follow @wpbeginner</a>

Risorse:

Documentazione del pulsante Follow
Generatore del pulsante Segui

Divulgazione: I nostri contenuti sono sostenuti dai lettori. Ciò significa che se cliccate su alcuni dei nostri link, potremmo guadagnare una commissione. Vedi come WPBeginner è finanziato , perché è importante e come puoi sostenerci. Ecco il nostro processo editoriale .

Avatar

Editorial Staff at WPBeginner is a team of WordPress experts led by Syed Balkhi with over 16 years of experience in WordPress, Web Hosting, eCommerce, SEO, and Marketing. Started in 2009, WPBeginner is now the largest free WordPress resource site in the industry and is often referred to as the Wikipedia for WordPress.

Il kit di strumenti WordPress definitivo

Ottenete l'accesso gratuito al nostro kit di strumenti - una raccolta di prodotti e risorse relative a WordPress che ogni professionista dovrebbe avere!

Reader Interactions

31 commentiLascia una risposta

  1. Syed Balkhi

    Hey WPBeginner readers,
    Did you know you can win exciting prizes by commenting on WPBeginner?
    Every month, our top blog commenters will win HUGE rewards, including premium WordPress plugin licenses and cash prizes.
    You can get more details about the contest from here.
    Start sharing your thoughts below to stand a chance to win!

  2. Biodun

    Hi,

    I tried to increase the width with the “data-width=300px” option but its not working.

  3. Pj Germain

    SWEET! I didn’t wanna install yet another plug-in and this worked like a champ! I know it’s an old post, but hey, you nailed it!!!

    Thanks a bunch!

  4. Verity

    Hi there, thanks for the info. I’ve added this on to my HTML page but the link is coming up just with text (ie my twitter name) and not the official Twitter button. Any advice? Thanks in advance.

  5. Si Sai

    Hi
    what if i have multiple authors on my blog and i want individual authors twitter follow button to be displayed for the posts they have submitted ?

  6. Chris Q

    This is great! Thanks.

    I’ve built my blog from scratch with zero previous knowledge, and resources like yours have proved invaluable along the way.

    I have a question though: is there anyway to hide or remove the counter? It’s half obscured by an image so thought I’d just get rid. I tried deleting what I thought was the obvious piece of code but it’s still there.

  7. Nadia

    I got the button to post just fine and it links and everything but I don’t know how to change the location its in. I posted it in my header but I want the button to show up right next to my FB icon and right now its being half covered up by another picture in the header. Suggestions??

    • Nadia

      Never mind, GOT IT!!! Woot woot

      • Nadia

        For anyone else having this problem-

        I had posted the link provided on this page into my header section. To edit the location, you need to go to the style section. I used this code:

        .twitter-follow-button{
        display:block;
        position:absolute;
        top:60px;
        right:-170px;
        width:32px;
        height:32px;

  8. Judy Hochberg

    I installed it in a text widget, and it looks fine on my blog, but I don’t understand how it works. When a user clicks on it, what happens? How does WordPress or Twitter know who the would-be subscriber is?

    When I try clicking on it I get a pop-up message that says something like “You are now subscribed to @my_twitter_handle.” The message is the same whether or not I’m logged into the website. So how is my identity known?

  9. Punit Bhalodiya

    nice post for WP-beginners thanks..!!!!!!

  10. Pritam Patil

    You are the real wp rockstart man !! its working ..and lets hope i get more followers :)

  11. Gemma

    Hi,

    I followed the instructions and it did work–the button appears and when I tested it, it links to my twitter. However, the widget also shows the html code underneath the follow button on my blog. Is there any way to hide the code and just have the button?

    Thanks

  12. David M. Perkins

    Okay, unfortunately that didn’t work. Any other place I can go for help?

      • David M. Perkins

        The instructions above didn’t help at all–but fortunately I found another way through the plug-ins (after some *hours* I’ll never get back). You have to remember that this is called “WPBeginner”–emphasis on the “Beginner,” and telling someone to post code willy-nilly and not laying out *all* the steps: do this first, then click on that, which will show you this, etc. (some of us “beginners” are complete digital diplodoci, you know), is not helpful.

        In any case, I got it done–but *not* by following the instructions above.

        • Editorial Staff

          Hi David,

          The reason why we say paste it anywhere in your theme is because we do not know where you want to add it. It could be in the header, sidebar, footer, after each post etc. Those are all different locations. Furthermore, we did mention that you can go to Appearance » Widgets and add it in the text widget. You can put the text widget in the appropriate widget areas (supported by your theme). Some have widget areas in the footer, but most have it in the sidebar.

        • David M. Perkins

          @ Editorial Staff said ~

          “The reason why we say paste it anywhere in your theme is because we do not know where you want to add it. It could be in the header, sidebar, footer, after each post etc. Those are all different locations.”

          My point was that the directions could have said: “If you want to put it in your sidebar, go *here,* click on *here,* which will show you *this,* and then you paste the text *there.* If you want to have it appear at the bottom of your post, go *here,* click on *here,* which will show you *this,* etc.” I’ve still got the code, which did not make the button appear, pasted *somewhere* on my dashboard page–but the goddesses only know where it is at the moment.

          Again–some of us *are* beginners here–and digital diplodoci–and beginners sometimes need a gentle, kind, *guiding* hand to get where we want to go, n’est–ce pas?

        • Editorial Staff

          Hello David,

          While we understand exactly what you are saying, it is harder than it sounds. Each WordPress theme is coded differently (general theme, child themes based on various frameworks etc). On top of that, we can’t possibly cover every single spot a human brain can think of displaying the button. This is the reason why we covered the most basic spot (Appearance > Widgets). Depending on the theme, you will have widgets for your the sidebar, header, footer, etc.

          We have a detailed overview of widgets in our free videos here: http://videos.wpbeginner.com/

  13. eggtartbox

    I tried it and links to my twitter, but as regular text…would that be because I’m on a wordpress.com blog?

    • Alyssa

      I have the same problem. It links it to my twitter but does not show the button. Any ideas on how to fix this?

  14. Gorn

    @wpbeginner Actually, neither. It’s a WordPress faciltiiy hosted by CIX at blog.cix.co.uk.
    I have now got it to work, but by using the “old-style” twitter buttons at http://twitter.com/about/resources/buttons – couldn’t either the “script” form or the shortcode form to work. Any ideas why that is?

  15. wpbeginner

    @Gorn Are you doing this on WordPress.com blog or a self-hosted blog?

  16. Gorn

    Thanks for this. It doesn’t work for me, though. When I save the Text widget, the script element gets stripped out, and I end up with just a text link in my sidebar. Any ideas?

  17. TheNerdyNurse

    nice addition. Feel my site loads too slow as it is. Worried that will be just one more thing to slow it down. I really need to figure out what it causing the drag in loading.

  18. jasonfox_me

    Thanks for the tip. i took the code from Twitter and it it looked good (bad me for not testing) the other day my friend tells me he tried to follow me and got user does not exist. For some reason it left my old handle in the code….just a heads up.

  19. wpbeginner

    @likewpcom which in most cases would not be necessary.

  20. AlbertAlbs

    Yes. I did already. Got too many followers after adding that twitter follow button.

Lascia una risposta

Grazie per aver scelto di lasciare un commento. Tenga presente che tutti i commenti sono moderati in base alle nostre politica dei commenti e il suo indirizzo e-mail NON sarà pubblicato. Si prega di NON utilizzare parole chiave nel campo del nome. Avremo una conversazione personale e significativa.