Create Custom Navigation Bar For Blogger

Posted on
  • Monday, February 4, 2013
  • by
  • Ajaya Gajurel
  • in
  • Labels:
  • ;
    Hello guys! You might have seen various tabs such as home,contact,about & guest post below the header of our blog.
    Create Custom Navigation Bar For Blogger
    Let me explain you all about these things. Those tabs are just button besides which lies some links. They can be main category of a blog or some important sectors. For an instance if you click on contact button you will be redirected to contact form of blogger smasher. So do you like them.

    Yes there are some gadgets which surely can fulfill the navitabs requirement. But they are not fully customizable. We cannot added other things in it as only buttons are allowed. You can compare the difference yourself. See a preview of page list widget below;
    Here you can see that the tabs have much spacing. More over in my bar there is google search of my site. But this widget doesn't have it so it may create problem for you. I got this solution to write as for a person in blogger help forum asked me to. So lets do this;

    • Go to dashboard>Layout.
    • There click on Add A Gadget just below your header.
    • Choose Html/Javascript as widget type and paste the below code in the content box;
    <!-- Navigation tabs start -->
    <div id='smasherlist'>
    <a href="1st Linkhere" class="smashertab" title="description of Link 1">Link name to appear</a>
    <a href="2nd Linkhere" class="smashertab" title="description of Link 2">Link name to appear</a>
    <a href="3rd Linkhere" class="smashertab" title="description of Link 3">Link name to appear</a>
    <a href="4th Linkhere" class="smashertab" title="description of Link 4">Link name to appear</a>
    <a href="5th Linkhere" class="smashertab" title="description of Link 5">Link name to appear</a>
    </div>
    <!-- Navigation tabs end -->
    <!-- Bloggersmasher.blogspot.com –>
    • Now Replace,
    1. The text highlighted by red colour with your respective links.
    2. The text highlighted by yellow colour with the description of your respective links.
    3. The text highlighted by pink with the text that would appear as button.
    • As for the title you can leave it empty. Now, click on save.
    Now, you have added the links. But they are simple and ordinary texts. So, It's time to style them. Styling is a major part. So pay attention;

    Styling The Tabs;

    To style your tabs follow below;
    • Go to dashboard>Template>Edit Html.
    • Then, search for ]]></b:skin> . After you found it just paste the below code above ]]></b:skin>;
    /* Navigation tabs start */
    a.smashertab, a.smashertab:link,a.smashertabs:visited { width:130px; height:30px; background:#eee; border:1px solid #000000; margin-top:1px; text-align:center; text-decoration:none; font-family:verdana, arial, sans-serif; font-size:11px; color:black; line-height:25px; overflow:hidden; float:left;}
    a.roundertab:hover {background:#ccc;}
    #rounderlist {width:960px; margin:0 auto;}
    /* Navigation tabs end */
    /* Bloggersmasher.blogspot.com*/ 
    • Here in the above code you can do the below editings to suite your taste;
    1. In line 3 change the value of width & height to fit your taste.
    2. In line 3 the value of background with the Html color code you like.
    3. In line 4 change the value of margin-top: in pixels to determine the space outside the border.
    4. In line 6 change the value of color: with the Html code you would like for the appearance of the color of the text inside the buttons.
    • Finally,click on orange save button and you are done.
    Now, your tabs are done. Wanna see a preview. It's below;




    It's good isn't it. Why don't you try it once.
    If you face any complication comment below;
    Bye friends and happy blogging!

    54 comments:

    Maddy Marcel said...

    Worked perfectly! Easy to follow instructions. Thanks!

    Ajaya Gajurel said...

    @Maddy Marcel
    I am very glad. Do come and visit this blog again!

    Mark Joseph Gesite said...
    This comment has been removed by the author.
    Mark Joseph Gesite said...

    i actually placed this in my bookmark.. thanks.. :D

    Ajaya Gajurel said...

    @Mark
    You are most welcome.

    Trekking in Nepal said...

    Acute Trek Pvt. Ltd. is a trekking and tours company in Nepal that is very believable, responsible and fully offers personage, group, tailored travel and trekking excursions in Nepal. If you would like to explorer lifetime knowledge of Trekking in Nepal and visiting destination of different part of Nepal as well as tours to Bhutan and destination Tibet in a secure and safe mode, then Acute Trek Pvt. Ltd. is the exact agency for you. Acute Trek specialize in organize excursion such as trekking in Nepal Annapurna base camp, Upper Mustang Trekking, Everest base camp trek, Langtang trekking, Kanchenjunga trek, Manaslu trekking are an domestic and international tours running that are a preferred of many Nepal holiday.
    http://www.trekshimalaya.com
    http://www.adventurestrekking.com
    http://www.hikingsinnepal.blogspot.com

    Tricia Pabello said...

    Thanks! :)

    Anonymous said...

    Do you have a spаm issue on this blog; I alѕо am а blogger, and Ӏ was wanting to know your situation;
    many of us have cгeateԁ some nice methoԁs and we аге looking tо trade
    solutіons wіth othеrs, why not shoot
    me an e-mail if intereѕted.

    my weblοg :: Thailand Travel Map 6th Ed

    Anonymous said...

    Greetings I am so glad I found your blog, I really found you by error,
    while I was browsing on Yahoo for something else, Anyhow I am here now and would just like to say kudos
    for a incredible post and a all round enjoyable blog (I also
    love the theme/design), I don't have time to read through it all at the moment but I have bookmarked it and also included your RSS feeds, so when I have time I will be back to read a lot more, Please do keep up the fantastic job.

    Also visit my homepage - airplane landing games

    Nick Adams said...

    Wow, i really like your blog,this blog give me good or fantastic information related to the Create Custom Navigation Bar For Blogger.Thanks to you sharing with me this good blog.

    Anonymous said...

    I used to be recommended this web site by my cousin.

    I'm not sure whether this put up is written through him as nobody else recognize such exact about my trouble. You're incredible!

    Thanks!

    My web page: bmi chart female

    Anonymous said...

    Hey I know this is off topic but I was wondering if you knew of any widgets I
    could add to my blog that automatically tweet my newest
    twitter updates. I've been looking for a plug-in like this for quite some time and was hoping maybe you would have some experience with something like this. Please let me know if you run into anything. I truly enjoy reading your blog and I look forward to your new updates.

    Here is my web-site - indonesia travel

    Anonymous said...

    It's great that you are getting thoughts from this editorial as well as from our dialogue made here.

    Take a look at my web site; loan company

    Anonymous said...

    Some web sites are there like girls in search of males and males looking for females in chennai/bangalore
    and so forth...But for that past five many years am
    maintain on putting up and anticipating some reply from
    a woman. But not but acquired any woman reaction.
    .Could it be very good strategy to research woman friend or looking woman buddy through internet site by
    no means function out?.....then inform me another
    idear to acquire lady friend?.......

    my blog post :: women love

    Kiana Grady said...

    Where can I find the ]]> tag at?

    Anonymous said...

    All the sheds are fantastic, but the church
    drop is my favorite!

    Here is my blog :: arrow Shed Parts list

    Anonymous said...

    okay so with the lemon and backing soda how a lot of itdo i use?



    my site dental pro 7 ingredients

    Anonymous said...

    Hi there, I found your site via Google whilst looking for a comparable
    subject, your site got here up, it seems to be
    good. I've bookmarked it in my google bookmarks.
    Hello there, simply turned into aware of your blog via Google, and found that it's truly informative.

    I'm going to watch out for brussels. I'll be grateful in the event you proceed this in future.
    Lots of people might be benefited out of your writing.
    Cheers!

    Feel free to visit my web blog: adult live phone chat

    Anonymous said...

    This is a great tip particularly to those fresh to the blogosphere.
    Short but very precise information… Appreciate your sharing this one.
    A must read article!

    Feel free to surf to my homepage; love quotes

    Anonymous said...

    Not just, fruit also has sugar in it.

    Feel free to visit my blog post; mike chang monster mass workout free download

    Anonymous said...

    Hey there! I simply would like to give you a huge thumbs up for your excellent info you
    have right here on this post. I will be returning to your web site for more soon.



    Have a look at my web-site - calculate waist to height ratio

    Anonymous said...

    Kudos to Rupert Sheldrake whose reputation and scientific endeavors precede and adhere to him.
    TED has indeed lost their credibility for visionary advertising.

    I hope some level headed scientists will take up the challenge to
    explore deeper beyond "constants".

    Look at my weblog :: weight loss diet foods to avoid

    Anonymous said...

    I am very impressed collectively together with your writing
    skills as neatly as with all
    the format for the weblog.
    Is that this a paid topic subject or did you modify it
    your self?
    Either way keep up the good high quality writing, it really is unusual to look a
    fantastic weblog similar to this one these days.
    .

    Also visit my web site - Six Pack shortcuts download video

    Anonymous said...

    superman wins hands down after superman takes the hulk from our atmosphere it's over end of story

    Here is my website superman stamina video online free

    Anonymous said...

    But how would? you clarify people like Carl Sagan and
    other people who went to community college, however became fantastic explorers and vital
    thinkers? Certainly not absolutely everyone is destined to turn out
    to be an Albert Einstein or Noam Chomsky, irrespective of
    the type of education technique they experience.
    I am not arguing along with your stage about consumerism, but
    then what would an ant colony be with out drones?
    Each and every social technique has a hierarchy due to differing levels of ability or wish.



    Also visit my page - 60 minute Stamina Free

    Anonymous said...

    the above post was really helpful and trustworthy.

    Have a look at my web-site; Best Workout To Gain Muscle Mass Quickly

    Anonymous said...

    Currently it seems like BlogEngine is the best blogging platform available right now.

    (from what I've read) Is that what you are using on your blog?

    My webpage - Vigrx Plus Ingredients List

    Anonymous said...

    Fantastic internet site with stimulating remarks. I not
    too long ago study that there is a capsule sponge that can be swallowed for 5mins
    and recovered by an attached wire right after amassing a cell
    sample that can be analysed to verify for Barrett's Esophogus.
    This will let numerous a lot more people to easily get an precise diagnosis of any precancerous cells at an early phase and consider motion.
    It continues to be utilised succesfully on 500 patients and it's prepared to be release soon.

    Hopefully this will substantially minimize the occurence of
    most cancers developing in acid reflux victims.

    Peace.

    Feel free to surf to my blog post - weight loss after hysterectomy menopause

    Anonymous said...

    It is not my first time to pay a quick visit this website, i am browsing
    this web page dailly and get good information from here everyday.


    My blog post basyx chair vl701st11

    Anonymous said...

    This is a wonderful tutorial with regards this software, I am very
    happy with this information as it looks very easy to understand.



    Visit my web page :: glo teeth whitening dentist reviews

    Mohamed Fane said...
    This comment has been removed by the author.
    Tek Head said...

    Nice One Thanks!

    Anonymous said...

    Ronnie Coleman does get steroids. And that's a reality look it up.

    Also visit my webpage; mike chang six pack shortcuts afterburn

    Anonymous said...

    how do you center the bar? thanks

    michelle gallinero said...

    hi! thanks for your post. i have it bookmarked and will try it on my site http://www.tobestressfree.com/

    sam said...

    Good information with simplicity, Thanks Admin.

    Beth Moore said...

    Thankyou for your navbar instructions! I'm trying to make my navbar links not the same colour as the settings on blogger. Is there css to make sure the links stay the colour you set originally?

    Anonymous said...

    Sysomos MeneameBitacorasDeliciousGoogle BuzzFacebookTwitter Esta entrada fue publicada en Net, Redes

    Have a look at my blog post :: mobile applications with java pdf

    Anonymous said...

    Someone said this was not an excellent starting prohormone.
    Any suggestions to get a good starter?

    My site; workout marathon training for beginners

    Anonymous said...

    Hello all, hhere every person is sharing these kinds oof know-how, thus it's fastidious to read this blog,
    and I used to pay a visit this website everyday.


    My website :: blog examples

    Anonymous said...

    Fairly segment of content. I just stumbled
    upon your site and in accession funds to claim which i acquire
    actually cherished account your blog posts.

    Anyway I will
    be subscribing for your feeds or even I achievement you access persistently swiftly.


    My weblog; mike chang six pack shortcuts pdf download

    Anonymous said...

    out Innovate Arkansas for the first part of my two-part introduction
    to location-based services depending on sessions

    my site ... free android app store downloads

    Anonymous said...

    Simply want to say your article is as amazing.
    The clarity on your submit is simply great and i can
    think you're knowledgeable in this subject. Fine with your permission let
    me to grab your feed to keep up to date with imminent post.
    Thanks 1,000,000 and please carry on the rewarding work.


    my site - Best New York Vacation Spots - -

    Anonymous said...

    I do not even know how I ended up here, however I thought this put up was once great.

    I do not recognise who you are but definitely you are ggoing to
    a famous blogger should you aren't already. Cheers!

    Here is my site :: recommended page

    Anonymous said...

    Ηowdy! I could have ѕwo&X72;n I've bеen to thiѕ blog before bu&X74; after browѕing
    t&X68;r&X6f;ugh somе &X6F;f &X74;&X68;e pоst I realіzеd it's &X6e;eω to me.
    Anyhow, I'm &X64;efi&X6E;itely delighted I
    found it and I'll bе bоok-markin&X67; and checking back fгequently!


    Here &X69;s my blog post ... Ko Phi Phi Don Vacations

    Anonymous said...

    Everything is very open with a really clear clarification of the challenges.
    It was really informative. Your site is useful.
    Thanks for sharing!

    Also visit my webpage - creation site

    Anonymous said...

    Heуa! Ι unԁerstand this is kinԁ of оff-tоpic
    bu&X74; I had to ask. Does manаging a well-eѕtablished webs&X69;te &X6c;ik&X65; yours
    tаke a &X6c;arge amount of w&X6F;rk?
    I am brаnԁ new to bloggin&X67; b&X75;t Ӏ do wri&X74;e in my dia&X72;y еѵerу dаy.
    I'ԁ like to st&X61;гt a blog
    so I c&X61;n ѕhаre my experi&X65;nce and thoug&X68;ts &X6F;nli&X6E;е.
    Please &X6C;et mе knoω if &X79;ou have any iԁeas оr tipѕ for brand &X6e;ew as&X70;iгing b&X6c;og owners.
    Aρpгеcia&X74;e it!

    Feel freе to visit my blog post:
    t&X68;e beѕ&X74; weight &X6c;oѕs blоgs (http://ulsanart.net)

    Anonymous said...

    Everything is very open with a really clear clarification of the issues.
    It was really informative. Your website is very helpful.
    Thank you for sharing!

    Here is my web-site ... learn Spanish free website

    Anonymous said...

    Dear mohammad i cn help u to gain weight as well as to obtain the items .pls contact
    me for support.

    my blog; weight loss plateau foods to avoid

    Anonymous said...

    I never ever really wanted to run a marathon & my %ks again 1 were enough for me. Sure, I do operate more than that each cardio work out but I think my most mileage in the day is my Sunday outside operate of about 8-9 miles fine with that! :)

    Here is my webpage: 4 week total body workout plans

    website design said...

    This post is in fact a nice one it helps new web viewers, who are wishing for
    blogging.Thanks for sharing useful info with us.
    website design

    Dianne Villano said...

    can I get the code for your facebook widget

    Anonymous said...

    It's awesome to pay a quick viisit this web page and reading
    the views of all friends about this paragraph, while I aam also keen of getting know-how.


    Rview my homepage ... recommended page

    Jijo said...

    easy to follow.. good job and Thanks for sharing.!
    i was trying to customize one technical blog.
    http://mframes.blogspot.com

    Post a Comment

     
    Copyright (c) 2012 Blogging Sentral by Martin Gajurel
    Sponsors: Texas Phone Lookup, Texas Accountant,Hospital Jobs