How To Add Twitter Follow Button To Your Website Officially?

add twitter follow button

Twitter is one of the leading social media networks and people are showing their presence more. To get more followers, you can add Twitter follow button to your website.

Do you know how to do that? There are different types of Twitter buttons and you can generate the code from Twitter only.

If you want to add tweets to your website then you can do that. But here we are talking about the button. In this tutorial, you will learn how to add Twitter follow button to your website.

Add Twitter Follow Button By Official Twitter Code.

As you all know, nowadays, you can add LinkedIn button to your website. The same goes with the Twitter.

First of all, you must have a Twitter account. Login to your account and visit to the Twitter follow button page.

You can directly reach out to the button creation page from here.

Step 1:- Enter the URL of your  profile or just the Twitter handler.

Step 2:- You will notice two options to embed your live twitter of your timeline or to generate the follow button. Click on the follow button option.

Step 3:- A pop-up will appear from which you have to choose the button type. Choose follow button and a code will be generated below.

<a href=”https://twitter.com/ravichahar27″ class=”twitter-follow-button” data-show-count=”false”>Follow @ravichahar27</a><script async src=”//platform.twitter.com/widgets.js” charset=”utf-8″></script>

The output would be:-

Step 4:- Just copy and paste the code to your website. You can use this code anywhere.

How To Customize Twitter Follow Button?

You will notice an option to click for setting the customization options. Click and there will be a few options including the size of the Twitter button and to display or hide the followers count.

Choose your options and update the code.

<a href=”https://twitter.com/ravichahar27″ class=”twitter-follow-button” data-size=”large” data-show-count=”false”>Follow @ravichahar27</a><script async src=”//platform.twitter.com/widgets.js” charset=”utf-8″></script>

The result would be like this.

You can even hide the username showing in the button.

How To Add Twitter Follow Button With Manual Customization?

If you want to customize it manually then there are a few things you can do. You can show the number of followers, button text color, button color etc.

Let me show you the tags to use inside the code.

  • data-show-count(true or false)
  • data-lang(es, en)
  • data-align()
  • data-size()
¬†<a href=”https://twitter.com/ravichahar27″ class=”twitter-follow-button” data-size=”large” data-show-count=”true” data-lang=”es” >Follow @ravichahar27</a><script async src=”//platform.twitter.com/widgets.js” charset=”utf-8″></script>

NOTE:- In all the code shown above, the URL is of my profile. To generate the button for your profile, replace it with the URL of your profile.

Just with the proper tags, you can customize your official Twitter follow button.

I Hope Now You Can Add Twitter Follow Button To Your Website.

Most of the social networks provide the code to add the button to your website. Just like you have seen above, copy and paste the code anywhere you want.

If you want to show the button in the sidebar, just paste the code in the widgets or you can use any plugin to display it to a specific place.

by Ravi Chahar

A WordPress Professional, web developer and designer who intends to guide his readers about WordPress, Blogging, Web Development, Web Design and more. I have expertise in WordPress theme development and customization. I can set up and redesign the Thesis themes. I have been working in this field for years now.

2 comments

  1. Hi Ravi,

    You make adding a Twitter button look so easy! We all need to be found everywhere we live–nobody lives in just one place anymore on the web.

    Thank you for this article.

    Sincerely,
    Carol

    1. Hey Carol,

      Twitter provides the code for your profile, you just have to put it to your website. I am sure, it won’t be hard for anyone.
      Thanks for stopping by.
      Enjoy your day.
      ~Ravi

Leave a Reply

Your email address will not be published. Required fields are marked *

CommentLuv badge