Skip to main content

Follow Me...

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!

Comments

Popular posts from this blog

Life is a box of emptiness..

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!

Rajmachi

As monsoon approaches it kindles a sweet memory of a mesmerizing trek. A Fireflies special trek to Rajmachi with Backpack Holidays.

Rajmachi also known as Udhewadi is a base village for the two marvellous forts Shrivardhan and Manaranjan. They are situated in the mighty Sahyadri mountain range in Lonavala and Khandala, Maharashtra. Shrivardhan fort the taller of the two forts stands at an altitude of 3000 feet above sea level where as Manaranjan fort reaches at an altitude of 2700 feet above sea level. On the way to these summits there are more surprises than you can think of!


The journey began via Mumbai local train from the rendezvous point Dadar to Karjat which takes approx. 2 hrs. I utilized this stretch to get acquainted with fellow enthusiastic trekkers. It’s one of those times when you get to know the most genuine experiences of trekkers, get excited with their enthusiasm and look forward to explorer yet another uncharted territory.
Individuals boarded the train at Dadar but a gro…

You never know..

It was a gloomy night. He was walking on the footpath kicking stones cursing the day. It was a really exhaustive day for him.

Backstory

Shifting in the bed realising why the alarm hasn't gone off yet, he looked at the clock. The hands of the clock showed 1:25. He was closing eyes thinking he got up in the middle of night when suddenly his attention turned towards the vase at the back of the clock which was shimmering in golden light. Shocked, he turned behind to see the sun has risen already! He immediately checked his mobile for the exact time and popped out of his bed cursing the alarm clock.