--> Add AddThis Welcome Bar to Blogger | Experience Lab - Online business creation and development guide for bloggers and startups

Add AddThis Welcome Bar to Blogger

Blogging isn't just about building traffic . it is also about maintaining it. But for that traffic to be of any use to you, you sh...

AddThis welcome bar

Blogging isn't just about building traffic. it is also about maintaining it. But for that traffic to be of any use to you, you should a good conversion rate, whereby visitors to your site at least take some action such as following you on Twitter, subscribing for your newsletter, visiting your old posts, and so on. There are many ways to increase your conversion. Here's another one. Add a welcome bar at the top of your website, and include calls to actions, such as sharing your page or liking it. That way, people can have easy access to your pages and links. The bar is provided by AddThis, a large sharing platform, and we have been showing you various sharing options for your blog that they provide. Here, we will show you how to use, and customize this bar.

The welcome bar is as yet in its beta form, but it works with all major browsers except Internet Explorer 7 and below. You can add custom greetings with it and hence increase your conversion rate. You can invite people to visit a certain page on your website, or share your page on a social media, or to follow you on a certain social media. You can set customized greetings, so visitors from a particular website get a specific message.

How it works?

It works in a very simple way. You simply paste a piece of JavaScript and CSS code anywhere on a page you want the bar to show up on. Ideally, you should put it on your homepage, but you are free to add it anywhere you like. It works like this. When a visitor from Facebook lands on your page, he sees a response relevant to Facebook, such as "Like us on Facebook" of " Share this page on Facebook" etc. Similarly, Twitter users will see a Tweet button, and so on. These responses are totally customizable, and so are the websites users are coming from.

Adding the welcome bar

To add a welcome bar to your blog, visit the AddThis page, and log in, or create an account if you don't already have one. You can create one through Facebook if you like. You will then be taken to a dashboard-like page, where you can create a custom welcome bar for your blog.

Customize Messages

customize messages

In this region, you get the option to customize your messages. From the left sidebar, you can add a website, so that visitors from that site get a specific response. For example, if you wrote an article on EzineArticles, and people are coming from there to your site, then you can add a message that says something like "Thank you for reading our article and visiting us", or something similar. it's up-to you. The sky's the limit. Select each website, and you will see its options on the right.

On the right side, you can change the message text, and the button text. The button is what will contain the call to action, such as "Share us" or "Follow us". You can select from three button actions, Share, Follow, and Go to URL. Custom responses for Facebook, Twitter and Google are already there. All the changes that you make can be seen on the live preview on the right.

You can add another by clicking Add visitor type. It will then show you a pop up.

add visitor type

if you click on "Any other Visitor", you can customize messages for all people who have not landed via your listed websites.

Finalize appearance and add to your site

finalize appearance

Once your messages are done, you can move on to customizing the look of the bar. You can change the background and text colors, button color, and button text color. You can choose from a full set of Hex colors (16 Million colors).


Notice that you also have the option to auto-hide the bar after a set amount of time. Once you are done with the design, you can see the live preview in the Customize messages section. If you like it, you can simply copy the code generated, and paste it into your template.

  1. Go To Blogger > Template 

  2. Backup your template

  3. Click Edit HTML > Proceed

  4. Paste the code just below

  5. Done!

We advise you to backup your page source code or template before pasting, so that you can revive changes if you accidentally overwrite a piece of code.

It's a simple enough process. If you want to further customize the bar, or if you want to know more, just take a look at the Welcome bar API. And if you have questions, feel free to ask them in the section below :0



Affiliate Marketing,12,Announcement,34,Bing,9,Bitcoin,38,blog,7,Blogger Resources,42,Blogger Templates,4,blogger tricks,156,Blogging ethics,70,Blogging tips,198,Bugs and Errors,34,Business,4,Copyright Violation,9,CSS and HTMLTricks,95,Designs,8,drop down menu,7,eBook,12,Email Marketing,7,Events,30,Facebook,30,Facebook tricks,49,Google,157,Google AdSense,42,Google Analytics,7,Google Plus,51,Google Plus Tricks,38,Guest Posts,112,home,2,How To,77,Internet,1,JSON Feeds,25,Kitchen Recipes,2,Label Based Sitemap Themes,1,Make Money Online,108,Marketing,16,MBT Blogger Templates,7,Menus,1,News,146,Pages,1,Posts,10,presentations,15,Responsive,10,Reviews,7,SEO,307,Settings,6,Shortcode,15,Sitemap Themes,1,Social Media,155,Technology,3,Templates,1,Tips,2,Tools,1,Traffic Tips,80,Video,19,Web Designing,62,web hosting,18,Webmaster Tools,97,Widgets,199,wordpress,26,
Experience Lab - Online business creation and development guide for bloggers and startups: Add AddThis Welcome Bar to Blogger
Add AddThis Welcome Bar to Blogger
Experience Lab - Online business creation and development guide for bloggers and startups
Loaded All Posts Not found any posts VIEW ALL Readmore Reply Cancel reply Delete By Home PAGES POSTS View All RECOMMENDED FOR YOU LABEL ARCHIVE SEARCH ALL POSTS Not found any post match with your request Back Home Sunday Monday Tuesday Wednesday Thursday Friday Saturday Sun Mon Tue Wed Thu Fri Sat January February March April May June July August September October November December Jan Feb Mar Apr May Jun Jul Aug Sep Oct Nov Dec just now 1 minute ago $$1$$ minutes ago 1 hour ago $$1$$ hours ago Yesterday $$1$$ days ago $$1$$ weeks ago more than 5 weeks ago Followers Follow THIS PREMIUM CONTENT IS LOCKED STEP 1: Share. STEP 2: Click the link you shared to unlock Copy All Code Select All Code All codes were copied to your clipboard Can not copy the codes / texts, please press [CTRL]+[C] (or CMD+C with Mac) to copy