fitdjaw - the blogiest of blogs!

Bloglovin' Custom Made Icon on Your Blog - Blogger

2010-11-06T20:36:00.005+01:00

Updated version

Assuming that you already have control over your blog via bloglovin' or that your blog is at least on bloglovin', you log into your bloglovin account, then click on Account -> Widget. In order to add a custom icon to your blog, just press "Get this icon" on any of the widgets avalible on their site.

If the Blogger icon is not already there, search for your blog and select it until your you see the Blogger icon and it says "Add icon", press this button.

This will take you to Blogger.com, make sure it's the correct blog selected from the drop-down menu and choose a title for your blog. Then click on "Edit Content". This will show you some basic HTML code, and this is where you have to change the image link which you find in the img src="link" tag, edit whatever link is that is there (eg. http://www.bloglovin.com/widget/bilder/en/lank.gif) to a link for your own icon. Now this is where it can get a little tricky, you would now have to upload your icon to a server so that you can get a web-link to it, blogger does however provide this service so you can upload an image on blogger, get the link and then add that link in here. When this link is edited, press "Add Widget" and it will add the widget with your own icon to your blog!

Here are two icons that I made which you are more than welcome to use:

Blue icon:

http://2.bp.blogspot.com/_Txd118s5Cu0/TNWuvipIZoI/AAAAAAAAAFI/Ght9c5k_OIA/s400/follow-cloud-blue.gif

Pink icon:

http://4.bp.blogspot.com/_Txd118s5Cu0/TNWvF9PRJzI/AAAAAAAAAFQ/1uNPxpqng0I/s400/follow-cloud-pink.gif

Follow My Blog - Bloglovin'-icon on Wordpress!

2009-01-14T11:20:00.014+01:00

I have aldready done a guide for how to make this when you use blogspot.com (Link). And after that their has been some questions if I can create one for Wordpress so I thought, why not! :)

Step 1-3 is the same as in the previous guide for blogspot and because of that I will just copy in these steps and then write a new 4:th step that is for WordpressStep

1 - Claim your blog (If you've not already done this)

Claim your blog by logging in to Bloglovin'. Then go to Settings > My blog and click the button that sais "Claim your blog".

Step 2 - Choose Icon

Hit the "Icon for your blog"-button that you'll find under

"My blogs" which will take you to a page with various Bloglovin' icons.

Step 3 - Choose icon

In order to add an icon you'll need to choose one of the pre-made icons and then change its code (I'll explain how in step 4).

Here you will get a code which you will change and use in just a little bit on Wordpress!

Step 4 – Add the icon

Now log in to your Wordpress control panel and go to your Dashboard! There on the left side you can find a button called Links, press that one and then Add New.

(You could if you want to add a new category to put your link under, I would call the categ

ory ”Follow my blog with Bloglovin’)

Then when you add your new link you will first choose a name, which won’t be showed on the blog anyway. Then you need to add the Web address. This you will find in the code from bloglovin’ which you got when you choosed an icon (See picture below). Paste that link into the Web Address input field.

Here you can also choose category (If you have more than one) and also target. Target you should choose as _blank. That makes the bloglovin’ page show up in a new tap so they won’t leave your blog.

Then there is only one step left. It’s under Advanced where you can add a Image Address. Either you copy the image-link that you got from the code (see picture below). Here you can also choose to add a icon you've made by your self, just change the link.

To add your own icon you need to upload it somewhere. You can do this for example at imageshack.

However, I've created two icons that you are welcome to use:

Blue icon:

http://2.bp.blogspot.com/_Txd118s5Cu0/TNWuvipIZoI/AAAAAAAAAFI/Ght9c5k_OIA/s400/follow-cloud-blue.gif

Pink icon:

http://4.bp.blogspot.com/_Txd118s5Cu0/TNWvF9PRJzI/AAAAAAAAAFQ/1uNPxpqng0I/s400/follow-cloud-pink.gif

Let me know if this guide helped you! :)

How to Add a Custom Made Bloglovin'-icon to Your Blogspot blog!

2008-12-15T13:10:00.065+01:00

Find an updated version of this post at:

http://fitdjaw.blogspot.com/2010/11/bloglovin-custom-made-icon-on-your-blog.html

Step 1 - Claim your blog (If you've not already done this)

Claim your blog by logging in to Bloglovin'. Then go to Settings > My blog and click the button that sais "Claim your blog".

Step 2 - Choose Icon

Hit the "Icon for your blog"-button that you'll find under "My blogs" which will take you to a page with various Bloglovin' icons.

Step 3 - Adding the icon

In order to add your custom made icon you'll need to choose one of the pre-made icons and then change its code (we'll explain how in step 4). P.S. It doesn't matter which button you choose to add in the beginning.

Add a icon by clicking on the "Add to blogspot!"-button, which will take you too your Blogspot site. On blotspot just hit the big blue button and add the icon.

Step 4 - Change the pre-made icon to a custom made one!

First of all, you have to design your own icon and upload it to your blog/other website in order to get a link to it.

Now click on the "Edit"-button on your Bloglovin'-widget. Then a window will appear with a bit of code. This is where you change the icon. First of all you need to save your blog ID from this code. Your blog ID will appear as in the picture below.

Save these numbers for the next step, and then delete the rest of the code that is in this box.

Then paste the code below into the box:

<a target="_blank" href="http://www.bloglovin.com/inc/addsubscript.php?id=397643"><img src="http://www.bloglovin.com/image/follow-cloud-blue.gif"/></a>

Look for where it sais "id" in the text above. Change that number to your ID-number that you saved in the previous step. Replace this link: "http://www.bloglovin.com/image/follow-cloud-blue.gif" with a link that leads to your picture (your icon).

However, I've created two icons that you are welcome to use:

Blue icon:

http://2.bp.blogspot.com/_Txd118s5Cu0/TNWuvipIZoI/AAAAAAAAAFI/Ght9c5k_OIA/s400/follow-cloud-blue.gif

Pink icon:

http://4.bp.blogspot.com/_Txd118s5Cu0/TNWvF9PRJzI/AAAAAAAAAFQ/1uNPxpqng0I/s400/follow-cloud-pink.gif

Once you're done, link to your blog in my comments so we can check each others icons out!

Claiming my blog!

2008-12-15T11:34:00.003+01:00

Follow my blog with Bloglovin'