Search

Blogger me Horizontal navigation Menu Bar kaise Jodte hai

Blogger me Horizontal navigation Menu Bar kaise Jodte hai

Blog me good navigation ke liye Horizontal Menubar bahut jaruri hai.Ye blog ko professional look deta hai,or visitors ko ek topic se dusre topic pe visit karne ke liye asan hota hai.Mai apko 3 tarikebatunga jisye aap blog me horizontal menu bar add kar sakte hai.1. Page widget use karke Horizontal Navigation Bar kaise Jodte haiBloggers me sabse adhik use kiya jane wale Menu bar “Page Menu” hai,jisye aap page widgetka use karke Apne Blog me add kar sakte hai.Lekin page menu ka sabse bara disadvantages hai ki isme aap drop down menu list nahi bana sakte.Horizontal menu me drop down features add karne ke liye apko HTML programming or CSS ani chahye.2. Blogger Blog me HTML or Java Script Use karke Horizontal navigation bar kaise JodeBlogger me Drop Down Menu kaise banate hai·Blogger.comopen kare,Phirdashboard>>templateme jaye.·Ab “Edit HTML” pe click kare.·CTRL+F click kare,ab ek search box ayega usme<div id=’header-wrapper’>search kare.·<div id=’header-wrapper’> ke niche diye gaye code ko paste karde.




Link1,Link2 common links hota hai,isye ap parent links bhi keh sakte hai.link3 ka link4,link5 drop drown menu hai.Drop down menu ko child links keh sakte hai.herf=’link’melink ki jagah apne categories ka link type kare or Link1 ki jagah categories ka name,isi tarah link2,link3 etc ke sath bhi kare.·Ab CTRL+F dabaye or ye code]]></b:skin>search kare.·]]></b:skin>ke just upar  diya code copy karke paste karde.



·Ye code apke navigation menu bar ko stylish bana dega.·Ab Preview pe click karke check kare,Menu Bar dikh raha hai kya,Agar hao to “save template” pe click karde.Apka blogger Template me Menu bar add ho chuka hai.
html Jawa script
Hello Friends mene apko pichle post me bataya ko Blogger pe blog kaise banate hai,Aaj mai apkobatunga Html java script ki help se blogger me widget kaise add karte hai. Widget ko gadget bhi kahte hai, widgets blogger ka tool hai jisse hum koi tool ko blogger me jod sakte hai. Blogger pe blog banane ka fayda ye hai ki yaha jisko bhi html coding nahi ati hai wo bhi isye asani se use kar sakte hai, Jaise ki agar apko apne blog mae advertising code, subsciber code ya facebook like box, social media follow widget ke widget jodna hai aur apke pas inke code hai toh aap asani se HTML widget me paste karke widget bana sakte hai.

Step by step janaye kaise blogger me HTML JAVA SCRIPT widget jodte hai :1. Sabse pahle browser mae Blogger.com open kare.2. Ab apneblogger accountka email aur pasword type kare phir sign in pe click kare.read also :Google or Gmail pe account kaise banaye. 3. Abdashboardtab pe click kare.4. Layout pe click kare, ab layout page khulega. 5. Layout page me abAdd a gadgetka option hoga uspe click karelayout and add a gadget6. Ab gadget page open hoga jisme bahut sare gadget ki list hogi, AapHTML/JAVA WIDGET pe click kare.7. HTML widget select karne ke baad ab naya page ayega jisme apko apne widget ka title likhna hai, agar aap meri mane ads ke code likhte waqt title nahi likhe. 8. Content Box me HTML code type kare ya Kahi se copy hai toh paste karde.9. HTML code likhne ke baad ab save button pe click karke save karde. Apka HTML widget add ho chuka hai, toh ab aap apne blogger me  adsense code, advertising ads, subsciber widget, social media follow widget aram se jod sakte hai. Ummed karta hu kiapko ye article pasand ayi hogi, Apko ye post kaisa laga or koi problem aa rahi hai toh comment kare.




.menu{font-size:12px;border-bottom:3px solid#6bd;border-top:1px solid #DDD;margin:0 0 7px 7px;padding:0;}.menu ul{height:30px;list-style:none;margin:0;}.menu li a{border-right:1px solid#DDD;display:block;line-height:30px;text-align:center;text-decoration:none;padding-left:15px;padding-right:15px;margin:0;}.menu li a:hover,.menu ul li:hover a{background:#6bd;color:#222;text-decoration:none;}.menu li ul{display:none;height:auto;border:0;position:absolute;width:225px;z-index:200;margin:0;padding:0;}.menu li:hover ul{display:block;}.menu li li{border-bottom:1px solid#dedbd1;display:block;float:none;width:225px;margin:0;padding:0;}.menu li ul a{display:block;height:30px;font-size:12px;font-style:normal;text-align:left;margin:0;padding:0 10px 0 15px;}.menu li ul a:hover,.menu li ul li:hover a{background:#2580a2;border:0;color:#fff;text-decoration:none;}.menu p{clear:left;}.left,.menu li{float:left;}





Few examples are,1. Setting the display by adding inline property to the horizontal

menu bar,.menu li li{display:inline;} and .menu li ul a{display:inline-table;}




.menu{font-size:12px;border-bottom:3px solid #6bd;border-top:1px solid #DDD;margin:0 0 7px 7px;padding:0;} .menu ul{height:30px;list-style:none;margin:0;} .menu li a{border-right:1px solid #DDD;display:block;line-height:30px;text-align:center;text-decoration:none;padding-left:15px;padding-right:15px;margin:0;} .menu li a:hover,.menu ul li:hover a{background:#6bd;color:#222;text-decoration:none;} .menu li ul{display:none;height:auto;border:0;position:absolute;width:225px;z-index:200;margin:0;padding:0;} .menu li:hover ul{display:block;} .menu li li{border-bottom:1px solid #dedbd1;display:block;float:none;width:225px;margin:0;padding:0;} .menu li ul a{display:block;height:30px;font-size:12px;font-style:normal;text-align:left;margin:0;padding:0 10px 0 15px;} .menu li ul a:hover,.menu li ul li:hover a{background:#2580a2;border:0;color:#fff;text-decoration:none;} .menu p{clear:left;} .left,.menu li{float:left;}

Share this

Related Posts

Previous
Next Post »

Thnx