Home About Calender Contact Advertise

Tuesday, 22 April 2014

Adding An Avatar Social Network Button To Your Blog

ad+1


Most Blogger templates come with social profile buttons added to the sidebar, but almost always you will find that some of these buttons are useful and some are not. It is possible however to edit which buttons are available on your blog by adding and removing them. One social profile button that is becoming increasingly relevant to add to a Second Life blog is the Avatar Social Network button.

Avatar Social Network

Avatar Social Network, as the name suggests is a social networking site for virtual world avatars, and is in fact the fastest growing site of its kind. As you would expect, it has pretty much all the features of a comparable site such as Facebook, but has the added feature of paying its members for their on site activity. This page explains in more detail why Avatar Social Network have chosen to do this .

As Avatar Social Network (or ASN as it is often called) continues to develop and its members continue to grow its social profile button on your blog becomes a must have feature, so this tutorial demonstrates how quickly and easily it can be added.

Before you add the button however, go to ASN and sign up if you don't already have a membership.

Adding The ASN Button To Your Blog

 Avatar Social Network Icon
The first thing to do is right click on the icon above and select 'Save Image As' to save it to your hard drive. Then upload it to an image hosting site such as Photobucket and copy the code for direct link layout.

Creating The Button Code

 The code for a social profile button looks like this:
 <a href='http://www.avatarsocialnetwork.com/profile/Lusus' target='_blank'><img alt='Avatar Social Network' src='http://i61.tinypic.com/2xxxx.jpg' title='Avatar Social Network'/></a>
To create the text for your own button:

1/ Go to your profile page on ASN and copy the Url.

2/ Replace 'http://www.avatarsocialnetwork.com/profile/Lusus' with your Url, but keep the quotation marks.

3/ Now replace 'http://i61.tinypic.com/2xxxx.jpg' with the url of the button mentioned above. Again, keep the quotation marks.

4/ You now have the code for your button. Drag you mouse over the entire code and copy it.

Adding the Button To The Blogger Template

The final stage is simply to paste the code for the button in the correct place in your Blogger template. You will need to edit your template here, so first make a backup of it by clicking the Restore/ Backup button.

1/ Sign in to your Blogger Dashboard and from the drop down list to the right of your blog's name select Template. Now click on the Edit Template button.

Blogger template social profile links

2/ Scroll down the template code until you find lines like above (click to enlarge the image).

3/ You can add the ASN button to your sidebar buttons by pasting it at the end of the code, or you can decide where you want it to show on your blog.

4/ If you look closely at the text you'll see names such as Facebook, Google+ etc, Decide which of these buttons you want the ASN button to appear after then look for this:
</a>
which signals the end of one button. Paste the code for the ASN button after this.

5/ Click the 'Save Template' button and you are done.

The ASN social profile button should now appear on your blog sidebar along with the Facebook, Twitter and Google+ buttons. Not only will you be able to easily access your own ASN profile, but so will all of the visitors to your blog. You can quickly see how this works by clicking on the ASN button in the sidebar here.

1 comment:

Home About Calender Contact Advertise
Copyright © 2014 SL-Inspiration | All Rights Reserved. Design By Blogger Templates