Skip to main content

Follow Me...

Image
By
In this post I’m going to show you how to add CUSTOMIZED “Follow Me” social media icons on the blog for blogger, which changes when the mouse hovers over and out of the icon.





 Step 1: Search social media icons 
  • Search the social media icons which you want to use in your blog & are available for use for FREE.
  • It would be good if the images are .png format and the dimensions are 100 x 100. 
  • I used this amazing site GEEK FAIRY for the social media icons. You can download & use it for FREE!

Step 2: Upload the social media icons in Google Drive 
  • Login into your Google Drive and create folder and upload the downloaded media icon images in it.
To create a folder on Google Drive: 
  1. On the left, click on New > Folder.
  2. Enter a name for the folder.
  3. Click Create.
To upload the files in Google Drive:
  1. Select the image files in your computer which you want to keep in Google Drive.  
  2. Drag and Drop the image files into Google Drive. 

   
Step 3: Make folder/files view over internet 
  • Click on My Drive so that you’ll see the folder we just created in ‘Step 2’.
To share the folder & files over internet:
  1. Right click on your folder, click Share.
  2. At bottom right, click on Advanced.
  3. Under Who has Access, click on Change... link.
  4. Select On – Public on the web option, click on Save. (Note: Access: Anyone (no sign in required) Can view should be selected else anyone on internet can modify those folder/files.)
  5. Click on Done.
 

To check whether the files are viewable over internet:
  1. Right click on your image file, click Get link.
  2. Copy the link and paste it in a different browser.
  3. If the image opens then you are good to GO!! 


Step 4: Create embedded URL for the images in Google Drive 
  • Copy the Get link URL. It will be something like: https://drive.google.com/open?id=0ByiyKfnLP50sdjFoTXVMM2YtRE5
To make an embedded URL of image in Google Drive:
  1. From the above copied URL cut the part which is after ‘id=’ i.e.: 0ByiyKfnLP50sdjFoTXVMM2YtRE5  
  2. Replace it with the FILEID it the following URL: https://drive.google.com/uc?export=view&id=FILEID
  • Repeat this step for all the images in Google Drive which you want to use in your blog.  

Step 5: Create “Follow Me” gadget on blogger 
  • In Blogger go to Layout.
  • Click on Add a Gadget.
  • Select HTML/JavaScript gadget. 
  • Give the Title as “Follow Me”. 
  • Copy Paste below code in Content:
    <center>
    <a href="link to your social media profile" target="_blank">
    <img src="image1 URL" onmouseover="this.src='image2 URL'" onmouseout="this.src='image1 URL'" width="40" height="40/" />
    </a> 
    </center> 
  • You can repeat the code from ‘<a href…’ to ‘</a>’ for the number of social media links you are adding. I’ve repeated the code 3 times in my blog for facebook, instagram and twitter social media links. 
  • Click Save then on Save arrangement and check your blog.
*image1 URL: Is the image URL which we created in ‘Step4’ and of the image which will be loaded when blog loads and when you hover the mouse out of the icon.
*image2 URL: Is the image URL which also we created in ‘Step4’ and will come when you hover the mouse on the icon. 

Please feel free to comment if this post was useful or you if face any issues in any of the steps.
Creativity knows no bounds. Keep Blogging!
About Author

Abhishek Gorale

A software engineer by profession and a curious blogger by will. An ambivert who balances his creative and geeky sides.

Comments

Post a Comment

Popular posts from this blog

Success is relative

By
Time is relative. This is what Albert Einstein determined in his Theory of Relativity. To explain you this in simple words as I recollect from my school days I'd say if you are spending time with your loved ones then one hour spent with them would feel like few minutes but if you put your hand on a hot pan for few seconds it would feel like minutes. Considering you understood my example I'd like to take it further and relate it to a very important aspect of our lives. Success What is success? Is it money, social status, traveling around the world, having a relationship or starting a family, commencing your own business or getting a job? Well as I see it success is anything which you dreamt of and worked hard for and achieved it. It can be as simple as getting up in the morning or sleeping on time in the night. It can be getting your driving license or buying a car. It can be spending a quality time with your family or buying a home for them. Is success time bound?
3 comments
Read more

Life is a box of emptiness..

By
Winner of "Write Over Weekend" contest by BlogAdda In valley of singing birds and a river, lived a brother and his sister in a wooden cabin. His name was Daniel and hers Shirley. Daniel used to earn bread by cutting timber and Shirley was in school. He was creative whereas she was curious! It was a Saturday afternoon, Daniel was returning home from work for lunch with his sister. Shirley was waiting for him while playing with her wooden unicorn. It was beautiful crafted wooden piece by Daniel himself as a birthday present to her. She loved fairy tales which Daniel used to tell her during bed time. And unicorn was her favourite mythical creature. She loved the noise the unicorn's legs made on the wooden table when she used to make it walk. It sounded like a real horse shoe would sound!   And then suddenly the unicorn slipped from her hand and fell to the floor breaking the horn. She couldn't bare the loss, tears started dripping from her eyes. She
16 comments
Read more

#EverWonderedWhy clock's hands move clockwise?

By
One of the everyday thing which we use all around the world is a clock. It has become such an integral part of our lives that neither the day starts nor the night ends without it. But have you #EverWonderedWhy clock's hands move clockwise? i.e.: From left to right. Why is it not the other way round? The answer to our curiosity lies in sundials and in which Earth's hemisphere the clock was invented in. Sundials was an earlier mechanism which were used to keep the track of time. They used to cast shadows with reference to the sun's position as it moved from East to West. Later when civilizations advanced mechanical clocks replaced the sundials. But even though they replaced them, the mechanical clocks where calibrated to match the speed of the movement of shadow of the sundials and also its direction of movement. Source: http://www.gifmania.co.uk/Technology-Animated-Gifs/Animated-Clocks/Sundials/ Now you might be wondering how the Earth’s hemisphere comes into
2 comments
Read more