ব্লগারে ভাসমান শেয়ার বাটন যুক্ত করার ফলে আপনি দুইটা সুবিধা পেতে
পারেন। এটি একদিকে আপনার ব্লগের সৌন্দর্য বৃদ্বি করবে, অপরদিকে এটি ব্যবহার
করে আপনার পাঠক সহজে আপনার ব্লগ ও ব্লগের পোস্টসমূহকে বিভিন্ন সোশ্যাল
মিডিয়া সাইটে তুলে ধরতে পারবে। আজকে এমনই একটি
কৌশল আপনাদের সামনে উপস্থাপন করব যা দিয়ে আপনি আপনার ব্লগে ওয়ার্ডপ্রেসের
মত ব্লগারেও ফ্লোটিং শেয়ার বাটন যোগ করতে পারবেন। আগেই বলেছি ব্লগারে তো
ওয়ার্ডপ্রেসের মত প্লাগিনের সুবিধা নেই তাই আপনাকে এটি যোগ করতে হলে কোডিং
করতে হবে। তবে পদ্ধতিটি তেমন কঠিন কিছু নয়। তাহলে চলুন ময়দানে অবতরণ করা
যাক।
উপরের চিত্রের মতই একটি ভাসমান শেয়ার বাটন বসাব ।তাহলেই প্রথমেই ব্লগার আইডিতে লগিন করে Dashboard(ড্যাশবোর্ড) থেকে Design(ডিজাইন) Edit Html(HTML সম্পাদনা) Expand Widget templates (উইজিট টেমপ্লেটগুলি বিস্তৃত করুন) টিক দিন। তারপর Ctrl+f চাপুন এবং নিচের কোডটি খুঁজুন।
উপরের চিত্রের মতই একটি ভাসমান শেয়ার বাটন বসাব ।তাহলেই প্রথমেই ব্লগার আইডিতে লগিন করে Dashboard(ড্যাশবোর্ড) থেকে Design(ডিজাইন) Edit Html(HTML সম্পাদনা) Expand Widget templates (উইজিট টেমপ্লেটগুলি বিস্তৃত করুন) টিক দিন। তারপর Ctrl+f চাপুন এবং নিচের কোডটি খুঁজুন।
]]></b:skin>এবার এই নিচের এই কোডটি উপরের কোডের আগে বসিয়ে দিন।
#floating-share {তারপর <body> ট্যাগটি খুঁজুন এবং ট্যাগটির নিচে নিচের কোডটি বসিয়ে দিন
position:fixed;
border:#fff solid 1px;
padding-bottom:2px;
}
<div id=’floating-share’> <li><a class=’twitter-share-button’ data-count=’vertical’ data-via=’rahilanouar’ href=’http://twitter.com/share‘>Tweet</a><script src=’http://platform.twitter.com/widgets.js‘ type=’text/javascript’></script></li><li><a class=’google-buzz-button’ data-button-style=’normal-count’ href=’http://www.google.com/buzz/post‘ title=’Post on Google Buzz’></a> <script src=’http://www.google.com/buzz/api/button.js‘ type=’text/javascript’></script></li><li><a class=’DiggThisButton DiggMedium’></a></li><li><script src=’http://www.stumbleupon.com/hostedbadge.php?s=5‘></script></li> <li><a href=’http://www.facebook.com/sharer.php‘ name=’fb_share’ type=’box_count’>Share</a><script src=’http://static.ak.fbcdn.net/connect.php/js/FB.Share‘ type=’text/javascript’></script></li> </div>এবার আপনার টেম্পলেটটি সেভ করার আগে একবার প্রিভিউ দেখে নিন সব কিছু ঠিকঠাক আছে কিনা। তারপর টেম্পলেটটি সেভ করুন। ভালো লাগলে মন্তব্য করবেন।
No comments:
Post a Comment