আপনার ব্লগার ব্লগে যোগ করুন একটি দারুন মিডিয়া উইজেট!!

আমরা অনেকেই ব্লগিং করি।আর সকলেই জানি,ভিসিটর হল ব্লগের প্রান।তাই বেশি ভিসিটর পাওয়ার জন্য,Pge Rank ,Alexa Rank বাড়ানোর জন্য ব্লগকে Social Media তে শেয়ার করি।আর এজন্য ব্লগে নানা ধরনের Media Widgets ব্যবহার করে থাকি।আর সেই Widget যদি আকর্ষনীয় হয় তাহলে তা ভিসিটরদের আকৃষ্ট করবে।
আজ আপনাদের সাথে শেয়ার করব এমনই একটি Social Media Widget। যেটা আপনি আপনার ব্লগে ব্যবহার করতে পারেন। আশা করি সকলের ভাল লাগবে।
এজন্য আপনাকে যা যা করতে হবে,ধাপে ধাপে তা বর্ননা করছিঃ-
  • প্রথমে Blogger এ লগইন করুন।
  • তারপর Dashboard  থেকে Layout  এ যান।
  • এরপর  ADD A GEDGET এ ক্লিক করুন।
  • একটা নতুন Window ওপেন হবে।সেখান থেকে  HTML/Javascript  এ ক্লিক করুন।
  • তারপর Javascript text box এ  নিচের কোড গুলো কপি করে পেস্ট করে দিন।

CODE:-

<style>#TB911-SNS {width: 260px;margin: 5px 20px;padding:5px;}
#TB911-SNS li {cursor: pointer;height: 48px;position: relative;
list-style-type: none;}#TB911-SNS .icon {background: #D91E76
 url('http://2.bp.blogspot.com/-Wh9jq4HrRN0/UOmHSqZDWDI/AAAAAAAAJVM/5fY5LrICi6c/s1600/NBT-Social_Button.png') 
 0 0 no-repeat;background-color: rgba(217, 30, 118, .42);border-radius: 30px;display: block;color: #141414;float:none;
 height: 48px;line-height: 48px;margin: 5px 0;position: relative;text-align: left;text-indent: 90px;text-shadow: #333 0 1px 0;
 white-space: nowrap;width: 48px;z-index: 5;-webkit-transition: width .25s ease-in-out, background-color .25s ease-in-out;
 -moz-transition: width .25s ease-in-out, background-color .25s ease-in-out;-o-transition: width .25s ease-in-out,
 background-color .25s ease-in-out;transition: width .25s ease-in-out, background-color .25s ease-in-out;
 -webkit-box-shadow: rgba(0, 0, 0, .28) 0 2px 3px;-moz-box-shadow: rgba(0, 0, 0, .28) 0 2px 3px;
 -o-box-shadow: rgba(0, 0, 0, .28) 0 2px 3px;box-shadow: rgba(0, 0, 0, .28) 0 2px 3px;text-decoration: none;}
 #TB911-SNS span:hover {visibility: hidden;}#TB911-SNS span {display: block;top: 15px;position: absolute;left: 90px;}
 #TB911-SNS .icon {color: #fafafa;overflow: hidden;}#TB911-SNS .fb {background-color: rgba(45, 118, 185, .42);
 background-position: 0 -382px;}#TB911-SNS .twit {background-color: rgba(0, 161, 223, .42);background-position: 0 -430px;}
 #TB911-SNS .google {background-color: rgba(167, 0, 0, .42);background-position: 0 -478px;}
 #TB911-SNS .pint {background-color: rgba(204, 0, 0, .42);background-position: 0 -526px;}
 #TB911-SNS .linked {background-color: rgba(0, 87, 114, .42);background-position: 0 -574px;}
 #TB911-SNS .ytube {background-color: rgba(170, 0, 0, .42);background-position: 0 -670px;}
 #TB911-SNS .rss {background-color: rgba(255, 109, 0, .42);background-position: 0 -718px;}
 #TB911-SNS li:hover .icon {width: 250px;}#TB911-SNS li:hover .icon {background-color: #d91e76;}
 #TB911-SNS li:hover .fb {background-color: #2d76b9;background-position: 0 2px;}
 #TB911-SNS li:hover .twit {background-color: #00A1DF;background-position: 0 -46px;}
 #TB911-SNS li:hover .google {background-color: #A70000;background-position: 0 -94px;}
 #TB911-SNS li:hover .pint {background-color: #C00;background-position: 0 -142px;}
 #TB911-SNS li:hover .linked {background-color: #005772;background-position: 0 -190px;}
 #TB911-SNS li:hover .ytube {background-color: #A00;background-position: 0 -286px;}
 #TB911-SNS li:hover .rss {background-color: #EC5601;background-position: 0 -334px;}
 #TB911-SNS .icon:active {bottom: -2px;-webkit-box-shadow: none;-moz-box-shadow: none;-o-box-shadow: none;}</style>
 <a rel="dofollow" title="blogger widgets" href="http://bdtechinfo.blogspot.com" target="_blank">
 <img border="0" src="http://bitly.com/24workpng1" style="margin-right:0px;" alt="widgets"/></a>
 <ul id="TB911-SNS"><li><a href="http://www.facebook.com/bdtechinfoblog" class="icon fb">Like us on Facebook</a><span>Like us on Facebook</span></li>
 <li><a href="https://twitter.com/bdtechinfo" class="icon twit">Follow us on Twitter</a><span>Follow us on Twitter</span></li>
 <li><a href="https://plus.google.com/bdtechinfo" class="icon google">Follow us on Google+</a><span>Follow us on Google+</span> </li>
 <li><a href="http://www.pinterest.com/bdtechinfo" class="icon pint">Follow us on Pinterest</a><span>Follow us on Pinterest</span> </li>
 <li><a href="http://in.linkedin.com/bdtechinfo" class="icon linked">Follow us on LinkedIn</a><span>Follow us on LinkedIn</span> </li>
 <li><a href="http://www.youtube.com/user/bdtechinfo" class="icon ytube">Follow us on Youtube</a><span>Follow us on Youtube</span> </li>
 <li><a href="http://feeds.feedburner.com/bdtechinfo" class="icon rss">Subscribe via RSS</a><span>Subscribe via RSS</span></li>
 </ul></div><div style='clear: both;'></div>


শেয়ার করুন

0 comments: