Blogspot me navigation Menu ko sticky kaise banaye

sticky-navigation-menu

Dosto sticky menu ko hum fixed menu ke naam se bhee jaante hain. aaj ka topic hai, Blogspot  me navigation Menu ki  Position fixed kaise kare. kisi bhi blog ya website men Navigation menu ka bahut bada role hota hai. 

jab koi visiter kisi website par visit karta hai to kisi post ko padne ke liye webpage ko scroll karta hai. ya fir wapas aane ke liye back to top button ka prayog karna hota hai. jisase page fir se wapas scroll hokar top me pahuch jata hai. par kai website aisee hain jinme webpage ke sath sath menubar bhee scrolling ke samay gaayab ho jaata hai. aise me visitor ko baaki post dekhne ke liye fir se page ko scroll karke wapas Top par aana hota hai jo kisi bhee tarah se user friendly nahii hota, kyonki aise men Blog reader ko asuvidha hotii hai hai unka samay bhee kharaab hota hai.
kai bade professional Blogger is navigation menu ke mahatv ko bakhoobii samjhte hain aur apne blog me menubar ya navigation menu ko sticky banate hain. aise men jab kisi webpage ko scroll kiya jata hai to bhii blog ka menu top me fixed rahata hai. aise me kisi bhee blog reader ko kisi articles ko padne ke baad koi anya jankaree lena chaahe to blog ke top me fixed menu kee sahayata se ye kaam kaafee aasan ho jaata hai. aise me blog reader bina kisi pareshanii ke navigation menu se kisi bhee category ko select karke koi bhii jankareee aasani se le sakta hai or visiter aapke blog par lambe samay tika rahata hai.

Blogspot me sticky navigation menu banane ke liye niche diye step ko follow karen.

  • sabse pahle Blogspot kee setting me jaayen aur  Dashboard > Theme > Edit HTML ko select karen.
Sticky-menu-on-scroll
  • edit karne ke baad aapko Ctrl+F button ko dabana hai. ab aapko Search box najar aayega. jaha aapko type katna hai ]]></b:skin> aapko Enter key dabaana hai. enter karte hee aapko search box men type kiya hua code aapke theme ke source code men dikhaai dega.
  • is code ke theek upar aapko niche diye code ko paste karna hoga.
.sticky{position:fixed!important;top:0;z-index:99;-webkit-transform:translateZ(0);}
  • ab aapko search box men ]]></b:skin> code kii jagah </body> type kerna hai, type karne ke baad enter key dabayen.
  • ab editor me </body> tag ke theek upar niche diye code ko copy karke paste karen.
<script type='text/javascript'> //<![CDATA[ // Sticky Menubar function makemeSticky(e){function t(){var e=s.getBoundingClientRect();e.top<0?(n.className=a+" sticky",n.style.width=i+"px"):n.className=a}var n=document.getElementById(e),s=document.createElement("div");n.parentNode.insertBefore(s,n);var i=n.offsetWidth,a=n.className+" makesticky";window.addEventListener("scroll",t,!1)}makemeSticky("main-wrapper"); //]]> </script>
  • itna karne ke baad aapko save button par click karba hai. lekin isase pahle ek kaam jaroor karen. upar likhe code men jo text highlight kiya hai. uskee jagah apne theme ke navigation menu ka class name dalna padega.
Doston ye tha aaj ka articles jismen navigation menu ho sticky ya fix karne kee tarkeeb bataai gai hai. aapko ye post kaisa laga? yadi is post se sambandhit koi bhee sawaal ho to aap comment box me puchh sakte hain. jald hee aapse nai post ke sath mulaakaat hogi. tab tak ke liye aap khus rahen, salamat rahen. Jai Hind.

Post a Comment

3 Comments