New Release Metro UI Social Profile Widget v3.0 for Blogspot or Blogger is an extended version of the previous widget released on Tech Prevue Labs. The post title is Metro UI Social Profile Gadget for Blogger v2.0. After posting the last post, I got many requests about extending this gadget to make it more appealing. I added three social media platforms: Pinterest, Linkedin, and YouTube. I hope most readers will love to spread it with good words. I believe this new social gadget will be a part of your blog. The main features of this widget are the hover effect and elegant design.
Steps to Add Metro UI Social Profile Widget v3.0 on your blog?
Installing this gadget/widget to your Blogspot, Blogger, WordPress, or another blogging service is easy. You only have to add an HTML/Javascript Gadget and Save the following code.
Note: Remember to change the following highlighted values: Facebook page/user name, Twitter username, Google+ user ID, Pinterest username, LinkedIn profile URL, Youtube username or URL, and RSS/Feedburner feed URL.
<div class="metro-social"> <li><a class="fb" href="http://www.facebook.com/techprevue"></a></li> <li><a class="tw" href="http://twitter.com/techprevue"></a></li> <li><a class="gp" href="https://plus.google.com/103741144523748761550"></a></li> <li><a class="pi" href="http://pinterest.com/techprevue"></a></li> <li><a class="in" href="https://www.linkedin.com/in/vinayprajapati"></a></li> <li><a class="yt" href="http://www.youtube.com/techprevue"></a></li> <li><a class="fd" href="http://feeds.feedburner.com/techprevue"></a></li> </div> <style> /*Metro UI Social Profile Widget v3.0 by Tech Prevue Labs Web link to gadget code: https://www.techprevue.com/social-profile-widget-for-blogger-metro-ui-v3-0 Distributed under license CC BY-NC-ND 3.0 INT Please keep license information intact while using this widget*/ .metro-social{width:285px} .metro-social li{position:relative;cursor:pointer;padding:0;list-style:none} .metro-social .fb,.tw,.gp,.pi,.in,.yt,.fd{z-index:7;float:left;margin:1px;position:relative;display:block} .metro-social .fb{background:url(//goo.gl/6xmUk) no-repeat center center #1f69b3;width:140px;height:141px} .metro-social .tw{background:url(//goo.gl/oyiFK) no-repeat center center #43b3e5;width:68px;height:70px} .metro-social .gp{background:url(//goo.gl/oT0kF) no-repeat center center #da4a38;width:69px;height:70px} .metro-social .pi{background:url(//goo.gl/7olxx) no-repeat center center #d73532;width:68px;height:69px} .metro-social .in{background:url(//goo.gl/PhFhj) no-repeat center center #0097bd;width:69px;height:69px} .metro-social .yt{background:url(//goo.gl/zcwjB) no-repeat center center #e64a41;width:140px;height:69px} .metro-social .fd{background:url(//goo.gl/lhBP1) no-repeat center center #e9a01c;width:140px;height:69px} .metro-social li:hover .fb{background:url(//goo.gl/MH8AP) no-repeat center center #1f69b3} .metro-social li:hover .tw{background:url(//goo.gl/hHRHv) no-repeat center center #43b3e5} .metro-social li:hover .gp{background:url(//goo.gl/wva4B) no-repeat center center #da4a38} .metro-social li:hover .pi{background:url(//goo.gl/IORvy) no-repeat center center #d73532} .metro-social li:hover .in{background:url(//goo.gl/2zHrm) no-repeat center center #0097bd} .metro-social li:hover .yt{background:url(//goo.gl/I1c4a) no-repeat center center #e64a41} .metro-social li:hover .fd{background:url(//goo.gl/CjzDP) no-repeat center center #e9a01c} </style>
I hope you’ll enjoy it.
Get Metro UI Social Profile Widget v2.0 here.
Super nice :) (.’.)>
@Welcome back!
@वरुण, क्षमा कीजिए, मुझे इस बारे में ज़्यादा ज्ञान नहीं है
ये तो मस्त लग रहा है बड़ा …
शुक्रिया दिगम्बर जी
Very beautiful and performance supportive widget using the latest social media icons, great work Tech PreVeu and Vinay !
Most welcome Mr. Suhas! :)
Nice information.
Welcome widodo :))
Very nice and advanced and without any script! It is working well on my blog. I am looking for a Metro Style Recent Post Widget. It seems like no one has written one yet. Can you please help with one?
when I have time, I will think on it… keep visiting tech prevue thanks!
hey .. nice widget.. but i want Stumble Upon button of same style.. can you give me the link of the image of Stumble Upon button?
Hi Sunil, Widget customization available at very low cost of $10.
oh.. i will look forward to it.
Inform me further queries at techprevue@yahoo .com :D
yes sure.. if i get interested, i will surely contact you..
Most welcome! Stumble Upon Icon Link is here: http://icons.iconarchive.com/icons/danleech/simple/128/stumbleupon-icon.png
i heard that such widget also helps in reducing the bounce rate so i think that recent post widget should be more attractive so that it can engage the user and we can get more pageviews.and i think your widget will do this job for me.thanks for sharing.
Most welcome BestofShayari!
Hi, Vinay I have sent you an email please reply to me soon…
Regards
Replied, Please check your mail.