How Do I Add Media Icons To My Blogger Blog?
Step 1~ Before you can start adding any social media icons to your blog or website, you'll first need to find {Or buy} a set. I have a few Free Sets on my blog, but I also sell them in myEtsy Shop.
Before you can use them, you'll need to download the files. If they're squares they can be JPEG files, but if they're circles or odd shapes they should be PNG files.
Step 2~ Now you'll need to upload your icons to Photobucket or a similar site.
Step 3~ You'll need to find your images URLS now.
If you stored your images on Photobucket, you'll see a box on the right hand side of each image with the name "Image Links". You want to copy the link called "Direct Link". See below.
Step 4~ Head on over to your Blogger blog. You want to head to the section "Layout"
Once there you want to click "Add a Gadget". A window will pop up with a couple dozen of gadgets to choose from. You want to choose the one that says "HTML/JavaScript". The new page that appears will be where you'll be adding your HTML code.
Step 5~ In this new page, do not add a title. You can if you want to, but I always feel things will look cleaner in the end if you don't. In the big blank box in the middle you'll want to add the following code.
<a href="http://www.YourWebsiteAddress.com"><img src="http://www.URLofImageLocation.com" height="70" width="70" /></a>
For example my Facebook Page's is,
http://www.facebook.com/MyFavouriteThingsBlog
Email is a bit different.
To link to email, fill in the "Your Website Address" like this,
<a href="mailto:myfavouritethingsblog@hotmail.com">
http://www.URLofImageLocation.com... this is the Direct Link address from each image you got from Photobucket previously.
height="70" width="70"... this is where you get to decide to size of your icons/buttons.
{You can keep adding this same code over and over directly behind each other if you want to add more icons, just remember to change the URLS.}
Click SAVE.
To move your icons, drag and drop them where ever you want your icons to be on your side bar and click save again.
That's it...Your Done!!!
0 comments:
Post a Comment