After having published and designed over 100+ Navigation Menus for Blogger, both with horizontal and vertical list view, today we would like to share a beautiful menu that has remained the favorite choice of all MBT clients so far. This menu changes color for each tab on mouse hover. It uses simple JavaScript functions to produce neat and clean transition effects. Instead of displaying the sub menu items in traditional vertical drop down list, we aligned them with one another to fit into a single line. Unlike other menus, this widget would easily fit any BlogSpot template without design conflicts. It is positioned at the top most section of your blog to attract readers the most. The installation steps are fun to try and extremely easy. The Menu works fine on all major browsers i.e: IE7+, Safari, Chrome, Mozilla and Opera. Lets add it to your blogs and get rid of any existing bulky menu that proved no less than a trouble.
If you are interested to learn how to create a menu from scratch and add Jquery effects to it then read the previous part of this series.
Navigation Menu Tutorials
4. Create Animated Drop Down Menu With CSS3 Transitions - Coming Soon..
6. Colorful Tabs: A JQuery Menu For Blogger
Add it to blogger
- Go To Blogger > Template
- Backup your template
- Click Edit HTML > Proceed
- Search For <head> and just below it paste these scripts:
<script src='http://downloads.mybloggertricks.com/jquery-pack-colourful.js' type='text/javascript'></script>5. Now search for the body class. i.e: Looks similar to this with some code inside it
<script src='http://downloads.mybloggertricks.com/jcarousel-colourful.js' type='text/javascript'> </script>
<script src='http://downloads.mybloggertricks.com/files/mt-colourful.js' type='text/javascript'></script>
body {
----
---
)
Inside this class paste the following values:
body {6. Next search for this:
margin:0px
padding:0px;
---
---
}
<body>or this:
<body expr:class='"loading" + data:blog.mobileClass'>
7. Just below it paste the following compressed code:
<!--START OF COLOURFUL TABS BY MBT-->
<style>
/*------- Colourful Tabs Menu by www.MyBloggerTricks.com -------*/
.MBT-Nav-container {
border: 1px solid #cfcfcf;
background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhaaLlWTVT0hySM38O1_jtmxUIb4kxvff9cLD0OaWOV7FPyagPQdzGXjr2ylFsE9wXIefSxkWLAwpgv2j0mzkwEy6UM5GeXXlgr3WafJE26N9ATPu-1IFw8AgPbw9BKEcQKaGmHp4SRzz4/s400/menu-bgd.png) bottom left repeat-x;
position: relative;
margin: 0; padding: 0;
border: 1px solid #cfcfcf;
}
ul#nav {
border-left: 1px solid #cfcfcf;
border-right: 0px solid #cfcfcf;
background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhaaLlWTVT0hySM38O1_jtmxUIb4kxvff9cLD0OaWOV7FPyagPQdzGXjr2ylFsE9wXIefSxkWLAwpgv2j0mzkwEy6UM5GeXXlgr3WafJE26N9ATPu-1IFw8AgPbw9BKEcQKaGmHp4SRzz4/s400/menu-bgd.png) bottom left repeat-x;
position: relative;
font-size: 12px; font-family: helvetica, arial, sans-serif;
list-style: none; margin: 0 auto; padding: 0;
width: 960px;
}
#nav ul {
margin: 0;
}
:focus {
outline: 0;
}
*html ul#nav { clear: both; height: 1%; }
ul#nav li a {
display: block;
float: left;
text-transform: uppercase;
font-weight: bold;
line-height: 33px;
padding: 0 13px 0 10px;
color: #333;
text-decoration: none;
background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhexelSNkZmPI8x3y-p6h1FPTYnXybQm-RRXlcelz5atyzoa6l8mgqjXmGdOb2clWovv4bvCNxKaF63vc0KvFGbFoiRe9IBs93EN5cVCqonqUSaJbUp5yHYCNKIxJQ_oPlcL-z62U3DYI0/s400/menu-rule.png) right 2px no-repeat;
}
*html ul#nav li.top-link { float: left; margin: 0px 0 -13px 0; padding-top: 2px; }
*:first-child+html ul#nav li.top-link { float: left; margin: 0px 0 -13px 0; padding-top: 2px; }
ul#nav li a:hover, ul#nav li a.open { color: #fff; }
ul#nav li#mbt a:hover, ul#nav li#mbt a.open { background: #0f1f37; }
ul#nav li#link-entertainment a:hover, ul#nav li#link-entertainment a.open { background: #b70943; }
ul#nav li#link-news a:hover, ul#nav li#link-news a.open { background: #cf3c02; }
ul#nav li#link-life a:hover, ul#nav li#link-life a.open { background: #724375; }
ul#nav li#link-technology a:hover, ul#nav li#link-technology a.open { background: #02b0cf; }
ul#nav li#link-top10 a:hover, ul#nav li#link-top10 a.open { background: #353533; }
ul#nav li#links-1 a:hover, ul#nav li#links-1 a.open { background: #b70943; }
ul#nav li#links-2 a:hover, ul#nav li#links-2 a.open { background: #289728; }
ul#nav li#links-3 a:hover, ul#nav li#links-3 a.open { background: #666666; }
ul#nav li#links-4 a:hover, ul#nav li#links-4 a.open { background: #b70943; }
ul#nav li#link-home a {
padding: 0 33px 0 10px;
text-indent: -9999px;
background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjI6WPxVb36EFKQGTGfrym9OP8ZTPmwD5-WS57FvjHRKxMgr1YywJ1aBER4jK72QJkeKl3ZxOX5hoS_WjWOfjiqqtn4RWI-d2G_8pqJpV-JRBl8FrVAqjdRJkvBXwCTc1CzOnBWVzV8jig/s400/home-icon.png) right 0px no-repeat;
}
*html ul#nav li#link-home a { padding: 0; width: 43px; }
ul#nav li#link-home a:hover { background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjI6WPxVb36EFKQGTGfrym9OP8ZTPmwD5-WS57FvjHRKxMgr1YywJ1aBER4jK72QJkeKl3ZxOX5hoS_WjWOfjiqqtn4RWI-d2G_8pqJpV-JRBl8FrVAqjdRJkvBXwCTc1CzOnBWVzV8jig/s400/home-icon.png) right -33px no-repeat; }
/* Sub-Vertical Navigation */
ul.sub-nav {
position: absolute;
top: 33px;
left: -1px;
overflow: hidden;
width: 960px;
display: none;
z-index: 999;
list-style: none;
padding-left:0px;
}
ul#nav li#mbt ul.sub-nav { background: #6f7987 url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi1VkIAUS8NC5wdPsVmL6U-JhCJOwOfEjIhuY0km4W0ar3S5Ni8pvEV2QoEbLAZlc1A184PooSWco6asusGgY6p7MAFvYkt2YprdxVtxmVmzz4s41KuivZME776XSHKHG8xy_Xp-neK38A/s400/business-subnav-bgd.png) top left repeat-x; }
ul#nav li#link-entertainment ul.sub-nav { background: #d46b8e url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiDPYmedLPS3wJ132EaA6a2aNzWbUjGgQY31ixksIVoTY_D1K3TKmHf_VkhL9wglxFVEIsEWknLu7h5tkmGPsqwJOGfNqvYebs8SMJ4hNv1YyZw1jLJS9paQiJtq8_D6zX9Ix9FDBo3XgA/s400/entertainment-subnav-bgd.png) top left repeat-x; }
ul#nav li#link-news ul.sub-nav { background: #e28a67 url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiC8FN-kBcd6x9kIWFii41iH6TDBvwqw2ShA95uc325lnCFUviFUKiUt9v99Sm_6QABY2ExbSJR1Nwc_7qJfY16sJUcaWWwoTfxJZjB5AdAm_YxleSOEAywtSh64-mzHM2ZhI-WNm3wMZk/s400/news-subnav-bgd.png) top left repeat-x; }
ul#nav li#link-life ul.sub-nav { background: #aa8eac url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgDPvOc1Y-3OVHqGaf5wc9rmhtQAU84qyHfxANaPhE_f2TLss1SqlBZLc_kX85e5v408Dv2gIevXBKtfdpJAe0fQrQ1xSQI8dYdThQr8Mv6m6ac06qipa1uB46e477dBnkUdrRPU0oYfk8/s400/life-subnav-bgd.png) top left repeat-x; }
ul#nav li#link-technology ul.sub-nav { background: #67d0e2 url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhEy_t5g6GQoMiRxRJf1CJvCQ41x8ma8GceEVhgJvOS_64v1hE22-XHIxEH5yzdYdv7KI9svQnvw21h77h3i5i82k6OHv7B5G_rRbsXTm29XvDP5ielPIIVPnSDfOysQjaHZn2MNGztnss/s400/technology-subnav-bgd.png) top left repeat-x; }
ul#nav li ul.sub-nav li { float: left; }
ul#nav li ul.sub-nav li a {
float: none;
background: none;
font-size: 11px;
text-transform: none;
color: #fff;
line-height: 25px;
}
ul#nav li#mbt ul.sub-nav li a:hover, ul#nav li#mbt ul.sub-nav li a.active-cat{ background: #0f1f37 !important; }
ul#nav li#link-entertainment ul.sub-nav li a:hover, ul#nav li#link-entertainment ul.sub-nav li a.active-cat { background: #b70943 !important; }
ul#nav li#link-news ul.sub-nav li a:hover, ul#nav li#link-news ul.sub-nav li a.active-cat { background: #cf3c02 !important; }
ul#nav li#link-life ul.sub-nav li a:hover, ul#nav li#link-life ul.sub-nav li a.active-cat { background: #724375 !important; }
ul#nav li#link-technology ul.sub-nav li a:hover, ul#nav li#link-technology ul.sub-nav li a.active-cat { background: #02b0cf !important; }
</style>
<div class='MBT-Nav-container'>
<ul id='nav'>
<li class='non-vertical-link top-link' id='link-home'><a class='open' href='#'>Home</a></li>
<li class='top-link' id='mbt'><a href='#'>TAB 1</a>
<ul class='sub-nav'>
<li><a href='#'>SUB TAB 1.1</a></li>
<li><a href='#'>SUB TAB 1.2</a></li>
<li><a href='#'>SUB TAB 1.3</a></li>
<li><a href='#'>SUB TAB 1.4</a></li>
</ul>
</li>
<li class='top-link' id='link-entertainment'><a href='#'>TAB 2</a>
<ul class='sub-nav' style='display: none;'>
<li><a href='#'>SUB TAB 2.1</a></li>
<li><a href='#'>SUB TAB 2.2</a></li>
<li><a href='#'>SUB TAB 2.3</a></li>
<li><a href='#'>SUB TAB 2.4</a></li>
<li><a href='#'>SUB TAB 2.5</a></li>
</ul>
</li>
<li class='top-link' id='link-news'><a href='#'>TAB 3</a>
<ul class='sub-nav' style='display: none;'>
<li><a href='#'>SUB TAB 3.1</a></li>
<li><a href='#'>SUB TAB 3.2</a></li>
<li><a href='#'>SUB TAB 3.3</a></li>
<li><a href='#'>SUB TAB 3.4</a></li>
</ul>
</li>
<li class='top-link' id='link-life'><a href='#'>TAB 4</a>
<ul class='sub-nav' style='display: none;'>
<li><a href='#'>SUB TAB 4.1</a></li>
<li><a href='#'>SUB TAB 4.2</a></li>
<li><a href='#'>SUB TAB 4.3</a></li>
<li><a href='#'>SUB TAB 4.4</a></li>
<li><a href='#'>SUB TAB 4.5</a></li>
<li><a href='#'>SUB TAB 4.6</a></li>
<li><a href='#'>SUB TAB 4.7</a></li>
</ul>
</li>
<li class='top-link' id='link-technology'><a href='#'>TAB 5</a>
<ul class='sub-nav' style='display: none;'>
<li><a href='#'>SUB TAB 5.1</a></li>
<li><a href='#'>SUB TAB 5.2</a></li>
<li><a href='#'>SUB TAB 5.3</a></li>
<li><a href='#'>SUB TAB 5.4</a></li>
<li><a href='#'>SUB TAB 5.5</a></li>
</ul>
</li>
<li class='non-vertical-link top-link' id='link-top10'><a href='#'>TAB 6</a></li>
<!--
<li class='non-vertical-link top-link' id='links-1'><a href='#'>TAB 7</a></li>
-->
<!--
<li class='non-vertical-link top-link' id='links-2'><a href='#'>TAB 8</a></li>
-->
<!--
<li class='non-vertical-link top-link' id='links-3'><a href='#'>TAB 9</a></li>
-->
<!--
<li class='non-vertical-link top-link' id='links-4'><a href='#'>TAB 10</a></li>
-->
<li style='clear: both;'/>
</ul>
</div>
<!--END OF COLOURFUL TABS BY MBT-->
8. Hit Save and all done!
Visit your blogs to see a complete new change to the site layout. The menu will blend both light and dark themes. Have fun. :)
Customizations Guide:
The code is written in a neat way so that any one may easily change, add or delete the tabs.- Replace # with URL of the page and replace TAB names with Page Title
- To change the width of the menu edit width: 960px
- To create a new tab in any sub menu simple paste this code above </ul>
<li><a href='#'>SUB TAB</a></li>
- Tab 7 to Tab 10 are disabled. If you want to activate any one of it then simply remove the comment tags across it. i.e <!-- before it and --> after it
- For more customization tips, just post me a comment!
Is it SEO friendly?
Simple CSS and HTML menus are way better than flash menus because they use the hyperlink tag along with anchor text. Search engines crawl them better and they appear clearly in SITE LINKS. This menu has everything that robots would love. It has a Clear structure and uses no fancy Jquery functions which could lead to High load time.
Credits
The menu design is inspired from blogs.com, scripts and code structure is made compatible with blogger by MBT blog. You are most welcomed to redistribute the code as long as you attach attribution and credits back to this page.Need help?
The code is self explanatory and would not trouble many of you. However if you want to further customize the menu then you are most welcomed to ask us for any help needed. Please always share your BLOG URL while posting. I hope this little effort may prove helpful for most of you. Thank you for taking time and reading this tutorial. Peace and blessings pals. :)
If you don't want to get yourself into Serious Technical Trouble while editing your Blog Template then just sit back and relax and let us do the Job for you at a fairly reasonable cost. Submit your order details by Clicking Here »
Cool One.. :)
ReplyDeleteLooks cool but if I am not wrong this can be done without jQuery, can't we?
ReplyDeleteAwesome!! I have a question though.
ReplyDeleteCan we add this somewhere else instead of below head? like if it already exists a drop down menu on our Blog and we want to add also this one but somewhere else how we do it?
Thanks!!
very informative post as usual bro. it really helps me a lot
ReplyDeleteregards
smartincomeguide.com
This comment has been removed by the author.
ReplyDeleteIt's so interesting dude.
ReplyDeleteNice menu..!!! :) http://gj37765.blogspot.com/
ReplyDeleteOnly one word and it is 'Awesome'. Gr8 work.
ReplyDeleteAs always, awesome Tabs :)
ReplyDeleteE-mail reply awaiting :-)
Fabulous menu. But like others have mentioned, how can I move it so it sits below my blog header rather than at the top of the page? I've been experimenting but no luck so far.
ReplyDelete@Fasil mohammed
ReplyDeleteTry changing position: relative to position: fixed.
.MBT-Nav-container {
.
.
position: fixed;
.
.
}
In sandbox it works but not just in any template. Lemme know how it goes.
ERROR:
ReplyDeleteError parsing XML, line 778, column 35: Element type "a" must be followed by either attribute specifications, ">" or "/>".
PLEASE HELP BRO.
SOLVED...GREAT WORK DONE....KEEP IT UP....
ReplyDeletewww.topfurtive.co.cc
SOLVED...GREAT WORK DONE...
ReplyDeletewww.topfurtive.co.cc
@bhavesh
ReplyDeleteWe surely can. The java script will keep the selected sub menu open on any page that is visited. For some reasons I could not make it work with blogger due to lack of time but I will re look into this. :>
@Andreas
Sure you can. You can simple paste the code inside a HTML/JAVAScript widget instead of pasting it below the body tag. :)
@haider
Replied :)
@Diets and Calories @M.M Alam
Just copy the code in step#7 and paste it inside HTML Javascript widget. :)
@Fasil
Bhavesh is right. Simple replace the position property with fixed. and add left:0; and top:0; values also
@Tanmay Kapse
With CSS almost any style could be set. Objects and elements are easily controlled with CSS properties. so the fixed float property is just as easy buddy. :)
Thank you so much Mohammad!!!! It works very ok and im so happy for this man!! :)
ReplyDelete@Tanmay Kapse
ReplyDelete@Bhavesh Pamecha , THanks it works. but When i scroll down the body of post covers it. And it has moved to lft side. How can i deal with it to get it fixed on the center without the covering by post body :)
@Tanmay Kapse
ReplyDelete@Bhavesh Pamecha , THanks it works. but When i scroll down the body of post covers it. And it has moved to lft side. How can i deal with it to get it fixed on the center without the covering by post body :)
@KRUNAL INTWALA
ReplyDeleteDear Musthafa, I didnot get those values. where to do that. can you explain please :)
THanks it works but When i scroll down the body of post covers it. And it has moved to lft side. How can i deal with it to get it fixed on the center without the covering by post body :)
@Fasil
ReplyDeleteNo worries buddy. You need to add right: 0; and a z-index apart from top and left which Mohammad suggested. Do the following.
.MBT-Nav-container {
.
.
position: fixed;
top: 0;
right: 0;
left: 0;
z-index: 999999;
.
.
}
z-index will keep the menu on top and will not go behind the post when scrolled down whereas the right and left will center the menu.
Hope this helps :)
Let us know if you need any further help :)
it will add on Top of the Blogger automatically ??
ReplyDeleteI have add these HTML code to my new blog with your cute box template. But it does not work. what's wrong going on with it? please do let me know.
ReplyDeletemy blog address: http://icabtutorial.blogspot.com/
Nice Post Ahemad Thank u ....And How to Keep Hide comment box like ur comment box ... Thank u
ReplyDeleteGreat work my brother, i use MBT church theme on my blog, if i want to replace the navbar with this one, how do i do that? thank you for this wonderful tips.
ReplyDeleteHi,
ReplyDeleteI have use it in my blog but then the menu bar background colour follows the template colour, can i get rid of it.
I am putting it in header instead on the top.
Thanks
Many thanks for your quick reply. It worked :)Brilliant menu.
ReplyDeleteThis comment has been removed by the author.
ReplyDeleteHi, Your tutorials are just awesome and really really helpful.Iam a newbie to blogger and my blog is on the construction pipeline and I would like to create it with a navigation bar with or w/o dropdowns and link the posts to label first and then link that Label to the menu item. Pls guide me through this.Another issue when I tried is that Iam not able to find the particular code you specify in the HTML editor, eg,body.Is there a shortcut to FIND like Ctrl+F or any other functions.Would greatly appreciate your help on this.
ReplyDeleteI am willing to use it to my new blog with your cute box template. Is it possible to use this colorful tabs with cute box. please do let me know.
ReplyDeleteMy blog address: http://icabtutorial.blogspot.com/
Hey thank u very much for this:-)
ReplyDeletemy blog http://onlyfullsoft.blogspot.in/
realy helpful tips
ReplyDeletesir how can i add click here to comment box like in your blog...
to my blog www.yomix.in
@Jithu
ReplyDeleteThat's not straight forward. It takes time as you need rework on the widget once again and I think Mohammad is working on it, don't know.
but where is header logo??
ReplyDeletebom dia!
ReplyDeleteGosto de seus ensinamentos,
e da forma como trata seu leitor/aprendiz!
Fiz no meu blog e deu certo!
Como vc descreve:
que a gente pode blogar , porém linkar para tua fonte,
fiz de acordo.
Espero ter postado certo!
Qualquer coisa, pode me avisar sobre o sim e o não poder compartilhar tao belo ensinamento!
Fique na paz!
This comment has been removed by the author.
ReplyDeleteHello,
ReplyDeleteI Need a HELP! right now. This menu bar is Awesome and want it to bring down below my Title. Can you help me in this matter.
This is my BLOg -----> http://techbayworld.blogspot.com/
thnks for your info,,,
ReplyDeleteits working perfectly.....no hard work needed..thanks much be blessed
ReplyDeleteI'd tried added the Menu in HTML and it works GREAT! But it look kinda small when I added the Menu using the Widget. Can u help?
ReplyDeletehttp://brosche-loo.blogspot.com/
Assalamualaikum, Mohammad. My name is Wan. I'm new blogger. I have problem with sub nav. When I view sub page, my blog background gone. How to fix it?
ReplyDeleteThis is my blog http://wankaze.blogspot.com/http://wankaze.blogspot.com/
-Wan
It worked perfectly all this time but suddenly the sub menu is not appearing at all. Just letting you know Mohammad.
ReplyDeleteI'm waiting perhaps for a fix.
Thanks!
Yes,mohamad is must update all javascript in the site and move other host!
ReplyDeleteno longer working sub menus are not displaying you can check out in your demo also . any help please.........
ReplyDeletethankx in advance
Also this is only working in the google chrome!i hope mohamad will to fixed!
ReplyDeleteNote
ReplyDeleteThe JavaScript files are hosted at Google servers which is not responding since 48 hours for reasons unknown. At present I will wait one more day if nothing seems to work then I will host them at our Hostgator servers. Please bear with us till then. Apologies for the inconvenience caused buddies. Sometimes Google sucks big time.
thanks for responce, i hope u will do it
ReplyDeleteI have add the first code which is to added after
ReplyDelete///<head
but i cannot find //body{ code
i keep searching no luck for me. can u help me over here
This coding is not run in my blog please help me..!
ReplyDeletemy blog is http://www.ccolumns.com
Please reply i am waiting...?
Thanks
UPDATE
ReplyDeleteI have transferred all files to our servers and it will fine now. All you need to do is to find the following link inside your templates:
http://mybloggertricks.googlecode.com/files
and replace it with this:
http://downloads.mybloggertricks.com
You will do this thrice because there are three links in step#4 that you need to update this way.
Apologies for the inconvenience. You may now enjoy MBT direct links :)
Thanks,mohamad for update!
ReplyDeleteMohamad,today i check and add in the my blog,but again have problem,i sure!
ReplyDeleteplz fixed this issue!
Best Regard!
Hi, the floating aspect of my tabs has simply disappeared without me changing anything. One minute they were there, the next they totally disappeared. So now when you rest the cursor on the tabs, no subtabs appear. I checked through the code, and nothing seems to have changed. Any ideas?
ReplyDeleteThanks CD
@Creditum Debitum
ReplyDeleteYes,u must click the "Demo" and click right,view page source and copy correct java-script!
------------
Bcoz mohamad is mistak this post but added correct java in the demo link!
Goodluck!
This comment has been removed by the author.
ReplyDeletepl look in to the matter it's not working. drop down menu are collapsed.
ReplyDeleteAssalam o Alaikum,
ReplyDeletehttp://blog.kentemplates.com/2012/11/colorful-tabs-jquery-menu-for-blogger.html
bhaiapki puri post yahan copy hoe hai kindly notice!!
Thanks alot for the update, i was really worried about it....
ReplyDeleteGod Bless you...
Thanks :)
Hello Mohammad. Suddenly is not working buddy. Check out your demo to see what i mean.
ReplyDeleteIgnore my previous message man it works very fine now! :D Have a GREAT holiday break and keep it up!
ReplyDeletei can't find ''body {''
ReplyDeletei added above code as ur instruction but sub-menu is not appearing pls help me as urgent.
ReplyDeleteThanks i used it..
ReplyDeletehttp://36-24-36-indian.blogspot.com/
For some reason, the drop down part isn´t working, it only changes colors when you hover but it doesn't show the sub-navs. Any idea as to why?
ReplyDeletehttp://blogdepruebamariano.blogspot.com.ar/
hey man .. have u got tha answer coz i'm facing the same problem with it
DeleteDear Musthafa,
ReplyDeletethis has stopped working on my blog. What might be the reason?
It is not droping down actually :p
www.olivehomeopathy.in
hey man .. have u got tha answer coz i'm facing the same problem with it
DeleteHi. I can't find body {. Can you help me? Thanks.
ReplyDeleteThe sub tab (2.1)(2.2)... doesnt work how do i activate that?
ReplyDeletethanks in advance..
Awesome! How would one change the code so that the tab is highlighted when the page with that tab link is selected?
ReplyDeleteThanks in advance!
i have applied it but my sub tabs are not visible, can you help me please.
ReplyDeleteHi. :)
ReplyDeleteI had this Script on my Blog (not which im posting from, but GooLoo.de) and it showed up. But the 2nd Level didn't show up. It was just the first Level with all Labels, but not the 2nd with the Links.
same problem :(
DeleteIF I DONT WANT TO ADD THE SUB MENUS THEN WHAT WILL I DO??
ReplyDeleteif i want to move it down?
ReplyDeleteThanks. looks great.
ReplyDeleteone problem though, I can't find a way to activate the sub titles. I followed directions still can't see the subs (they dont work even without changing TABs). please help
Nice one mbt. just installed it and it was awesome. http://kriztek.blogspot.com
ReplyDeleteplease help.....subtitles not working!
ReplyDeleteI tried to us this i my blog. Colorful tabs are successfully created. But drown down boxes could not be created.pleas guide
ReplyDeleteSame here. Drop down menus dont work.
DeleteProbably because the http://downloads.mybloggertricks.com/files/mt-colourful.js file is unavailable
The file is working just fine and so is the demo. Please make sure to place the jquery files at the right place. Make sure you are not using several js scripts on your page.
DeleteHi admin, i'm not able to come up with any result, please help.
ReplyDelete