এক ক্লিকে ব্লগার ন্যাভবার ঢেকে রাখা ও দেখানোর বোতাম

ব্লগার.কম ব্লগের মাথার উপরে একটা লম্বা বার থাকে। এর নাম ন্যাভবার। এই ন্যাভবার নিয়ে আমাদের একাধিক পোস্ট আছে। আমরা এর আগে যে সব পোস্ট লিখেছি সেগুলো হলঃ

1. ব্লগারের ন্যাভবার এখন স্বচ্ছ হয়ে গেছে
2. ন্যাভবারকে শেয়ার করার কাজে ব্যবহার করুন
3. ন্যাভবারকে লুকিয়ে রাখার পদ্ধতি
4. কিভাবে ন্যাভবারকে ঢেকে রাখবেন?

আজ এই ন্যাভবারকে নিয়েই আর একটি পোস্ট লিখছি। এই ন্যাভবার নিয়ে নানাজনের নানারকম পরস্পরবিরোধী মত আছে। কোন কোন ব্লগার এটাকে বাদ দিয়ে দেয়ার স্বপক্ষে জোরালো অবস্থান নিয়েছেন। কিন্তু এর কিছু উপকারী দিক আছে। আপনি যদি একেবারেই বাদ দিয়ে দেন, তাহলে সেইসব উপকার পেতে হলে অন্য প্রক্রিয়ার সাহায্য নিতে হয়। তাই একেবারে বাদ না দিয়ে যদি ঢেকে রাখা যায়, আবার প্রয়োজনের সময় যদি তাকে বের করে আনা যায়, তাহলে বেশ ভাল হয়, তাই না? আজ আমরা ঠিক এইরকম একটি পদ্ধতি জানবো।
This is one click show/hide blogger.com navbar button.
আজ আমরা একটি বোতাম তৈরি করবো, যা ব্লগে লাগিয়ে রাখলে স্বাভাবিকভাবে ন্যাভবারটি লুকিয়ে থাকবে। প্রয়োজনের সময় সেই বোতামে ক্লিক করলে ঢেকে রাখা ন্যাভবারটি আবার সামনে চলে আসবে। এরকম একটি বাটন তৈরি করা হয়েছে নিচের জাভাস্ক্রিপ্ট কোডটি দিয়ে।

1. যথারীতি ব্লগার.কম এ গুগল আইডি ও পাসওয়র্ড দিয়ে লগইন করুন।
2. Layout > Page Elements অংশে গিয়ে একটি নতুন HTML/ Javascript গেজেট নিন।
3. এই গেজেটের ভিতরে নিচের কোডটুকু লিখে দিন।
4. <script type="text/javascript">
   var showHeader=false;
   function ShowHideNav()
   {
   showHeader=!showHeader;
   var nav=document.getElementById("navbar-iframe");
   if (showHeader)
   {
   nav.style.visibility="visible";
   nav.style.display="block";
   }
   else
   {
   nav.style.visibility="hidden";
   nav.style.display="none";
   }
   }
   </script>
   <style type="text/css">
   #navbar-iframe {
   visibility: hidden;
   display: none;
   }
   </style>
   
   
   <button title="Click to show/hide content" type="button" onclick="ShowHideNav();">
   Show/Hide Blogger NavBar
   <a style="visibility: hidden;" href="#"></a></button>
5. সেভ করুন।
6. এই বাটনটির কার্যকারিতা দেখতে BH Demo ব্লগটি ভ্রমণ করুন।