How to create Blogger Categories Into a Drop Down Menu

How to create Blogger Categories Into a Drop Down Menu
Image result for drop down category
The Google Blogger labels gadget is a constant or needed sidebar gadget which displays a list of your categories in a list or flat format, arranged  alphabetically .
 Though the Label gadget does not include an option for configuring the display of categories in a drop-down menu, you can accomplish this effect by editing the HTML Code of your blog design.
Now let's get started.
1. Login to your Blogger Account by going to
www.blogger.com  or www.blogspot.com  Navigate to layout .
2. If the "Labels" gadget is not  in your Blog layout in the dashboard menu, click the "Add a Gadget" link in the location where you want the categories menu to appear  either "right side bar or left side bar"and then click the "+" icon beside "Labels."
3.Now click on  "Template" from the left sidebar.
4. look up to "Template," from the left side bar ,and click on it for a new window to open containing "Customize and Edit HTML"  Never bother to click customise  just click  on "Edit HTML" to edit your blog tempate.
5. press ctrl+ F in your keyboard and paste this code   <b:widget id='Label1' locked='false' title='Labels' type='Label'/> in the search form and press the enter key.
8. Now replace it with this block of codes
 <b:widget id='Label1' locked='false' title='Labels' type='Label'> <b:includable id='main'> <b:if cond='data:title'> <h2><data:title/></h2> </b:if> <div class='widget-content'> <select onchange='location=this.options[this.selectedIndex].value;'> <option>Select a label</option> <b:loop values='data:labels' var='label'> <option expr:value='data:label.url'><data:label.name/> (<data:label.count/>) </option> </b:loop> </select> <b:include name='quickedit'/> </div> </b:includable> </b:widget>
7. Click "Save Template."
Note: Don't play with any HTML code there except you're good in programming.

No comments

Powered by Blogger.