ব্লগের শরীরে লিংকসহ ভাসমান বোতাম লাগানোর পদ্ধতি

অনেক সময় বামপাশের ছবির মতো TOC বা অন্যকিছু লেখা বোতাম ব্লগের শরীরে লাগানোর প্রয়োজন পড়ে। এই বোতামটি About, FAQ, Terms of Conditions, Table of Contents, Archive, Email me ইত্যাদি যে কোন বিষয়ে হতে পারে। সাধারণত এই সব লিংক ব্লগের মেনুবার (Menubar) বা সাইডবারে (Sidebar) লাগানো হয় কিন্তু যদি এমন হয় যে মেনুবারে প্রয়োজনীয় লিংক দিয়ে ভর্তি হয়ে গেছে। আর সাইডবারেও তেমন কোন উপযুক্ত জায়গা নেই, যেখানে পাঠকের দৃষ্টি সহজেই যেতে পারে।

এরকম পরিস্থিতিতে যদি একটি আকর্ষণীয় ছবি (Attractive Image) দিয়ে এই বোতামটি (Button) তৈরি করা হয়, এবং যদি তাকে সাইডবারে লাগানো হয়, তাহলে বেশ চমকপ্রদ হয় তাইনা? আর এরকম একটি বোতাম থাকলে পাঠকেরও দৃষ্টি সহজে নির্দিষ্ট জায়গায় নিয়ে যাওয়া যায়।

আর এই বোতামটিতে যে লিংক থাকবে, তা সে Email me হোক আর Archive যাই হোকনা কেন, তাহলে আপনার ব্লগের ভিজিটরদের (Blog visitor) অংশগ্রহণ তথা সংশ্লিষ্টতা আরও বেড়ে যাবে। অতএব এই ধরণের ভাসমান বোতামের (Floating image/  button) গুরুত্ব কখনও কখনও খুব প্রয়োজন হয়।
Today we will learn how to add a floating image on blog body.
আজ আমরা এরকম একটি ভাসমান বোতাম (Floating Button) কিভাবে ব্লগের শরীরে লাগানো যায়, তা শিখবো।
This is a very essential button for your readers activity. They will involve more in your blog with this button.
নিচে দেয়া কোডটি আপনার দুই জায়গায় স্থাপন করতে পারবেন।

• যথারীতি ব্লগার.কম এ প্রবেশ করুন।
• আপনার ব্লগের Layout ট্যাবে চলে যান।
• এখানে দুই জায়গায় নিচের কোডটি স্থাপন করতে পারবেন।
• Edit HTML এর মধ্যে </head> এর মধ্যে যে কোন জায়গায়।
• অথবা Page Elements Tab এর কোন একটি HTML/ JavaScripts গেজেটে।
• আপনার কাছে যেটা সহজ হয় সেখানে স্থাপন করুন।

<span id="anything" style="position:fixed;align:left;top:300px;left:15px"><a href="http://banglahacks.blogspot.com/"> <img border="0" alt="Bangla Hacks" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj7wownzVSK-LSXrX2wjw9kwzozIh1UNFGBxlLFZltz9qE4ooz-Y2grIwmT3kPzydKQ60sMJ-kYl2_JWu1rjApZnNHt5QDFO3zMXNbrMrUsnknQf55miyNbOopC5Gx4qbriHAneRNHYIDKn/s320/toc.png" title="Bangla Hacks"/></a></span>

• প্রয়োজনীয় সেটআপ
  
• নিজের প্রয়োজনমাফিক উপরের কোডটিতে কিছু পরিবর্তন করে নিতে পারবেন।
  
• উপরের কোডে align:left;top:300px;left:15px এর Left এর বদলে Right লিখে দিতে পারবেন। সেক্ষেত্রে ডানপাশে দেখাবে। 300px এবং 15px মানগুলো পরিবর্তন করে দেখুন। জায়গা পরিবর্তন হবে। আপনি ঠিক যেখানে বোতামটিকে রাখতে চান, আপনার যেখানে সুবিধা হয়, ঠিক সেই মানটি বারবার পরীক্ষা করে নির্বাচন করুন।Change the value according to your need.
  
• Bangla Hacks লেখাগুলো পরিবর্তন করে আপনি যে উদ্দেশ্যে বোতামটি স্থাপন করছেন তা লিখুন, যেমন Email me, Archive, About ইত্যাদি।
• http://banglahacks.blogspot.com/ এই লিংকটি পাল্টে আপনি যে পাতায় বা ঠিকানায় বোতামটিকে লিংক করতে চান, তা লিখে দিন।Now change the link.
  
• https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj7wownzVSK-LSXrX2wjw9kwzozIh1UNFGBxlLFZltz9qE4ooz-Y2grIwmT3kPzydKQ60sMJ-kYl2_JWu1rjApZnNHt5QDFO3zMXNbrMrUsnknQf55miyNbOopC5Gx4qbriHAneRNHYIDKn/s320/toc.png ইমেজ ফাইলের এই লিংকটি পাল্টে আপনার আপলোড করা ছবিফাইলের ডাইরেক্ট লিংকটি এখানে লিখে দিন।
• এবার সেভ করুন। You have done, now save all changes.
  
• আশা করি সবকিছু ঠিকঠাকভাবে করতে পারবেন।