MULTI TAB WIDGET FOR BLOGGER


Follow the Steps Below,


  • Go To Blogger > Layout > Edit HTML


  • Search for                (Tip: Use Browser Search Box. Press Ctrl + F )


  • And Just above  paste the code below,



Save your template






Adding the code for Multi Tab widget to HTML/JavaScript widget






#eee : This is the background colour of the Tabs. The Default one is grey. If you want to change it to a different colour of your choice then use MBT Embeddable Colour Chart
#fff :  This is the colour of the border of your multi tab widget. The default one is white you can customize it to a colour of your choice using the same colour chart mentioned above.
#ffffff : This is the background colour of the main body of your widget. This is where you will add content to the widget. The default one is white. Use MBT Colour Chart if you wish to use a different colour.
#eee : This is the colour of the borders around those rectangular tabs. The default one is grey. Use MBT Colour Chart if you wish to use a different colour.
#000000 : This is the colour of the text/font that you will write to name your tabs. In other words, it’s the colour of your tab titles. The default one is black.
Replace these with your tab titles
Tab 1 , Tab 2  , Tab 3
Replace these with your widget codes.
Tab 1 content goes here , Tab 2 content goes here ,  Tab 3 content goes here
Here goes the codes of your content/widgets, which can be your recent comments widget, recent posts widget, any written text, a picture etc. For example, to add a recent comments widget to the first tab, name Tab 1 as Comments and replace Tab 1 content goes here with the HTML code of your recent comments widget.
Adding the Multi Tab Widget To your Blog
After you have customized the code, do the following,


  • Log into your blogger account


  • Go to Layout > Page Elements
Blogger Layout Page Elements


  •  Click on Add a Gadget
add-a-gadget
  • Then Choose HTML/JavaScript Widget from the widget list that blogger provides
htmljavascript widget blogger
Now paste your customized code into this widget by leaving the title empty. Hit Save and You are Done! Check your blog to see the new dress :)
That’s All!
Feel free to ask or suggest. Your questions and suggestions are the only favour I get in return.


All Rights Reserved The Origin for Screamers | Design by SCREAMERS
Computers
Top Blogs