Within the Blogspot, or Blogger, you can add descriptive Labels to
your posts. These labels help categorize and archive your posts based on
the text you use to describe them. If you use a large variety of
labels, they can quickly clutter your sidebar. Clean up your blog by
creating a drop-down menu for your labels.
Step 1: Log in to your Blogger account. You will be redirected to the Blogger Dashboard.
Step 2: Click the down-arrow to the left of the "View blog" button. Select the "Template" option from the drop-down menu.
Step 3: Click the "Edit HTML" button on the left side of the screen and then agree to the warning by clicking "Proceed."
Step 4: Press "Ctrl-F" or "Command-F" to open a search box. Enter "Label1" into the box and press the "Enter" key. This line of code should appear as a result:
<b:widget id='Label1' locked='false' title='Labels' type='Label'/>
Step 5: Copy and Replace the code above with the following code:
<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 style='width:100%' onchange='location=this.options[this.selectedIndex].value;'> <option>Select 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>
Step 6: Click the "Save Template" button to finalize your changes. Return to your Dashboard and click "View blog" to view your new drop-down label menu in your widget.
Note:
Remember to back your template/HTML codes before doing anything , this will help you incase anything went wrong with your coding.
>>Hope it will help you!.. >>
Step 1: Log in to your Blogger account. You will be redirected to the Blogger Dashboard.
Step 2: Click the down-arrow to the left of the "View blog" button. Select the "Template" option from the drop-down menu.
Step 3: Click the "Edit HTML" button on the left side of the screen and then agree to the warning by clicking "Proceed."
Step 4: Press "Ctrl-F" or "Command-F" to open a search box. Enter "Label1" into the box and press the "Enter" key. This line of code should appear as a result:
<b:widget id='Label1' locked='false' title='Labels' type='Label'/>
Step 5: Copy and Replace the code above with the following code:
<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 style='width:100%' onchange='location=this.options[this.selectedIndex].value;'> <option>Select 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>
Step 6: Click the "Save Template" button to finalize your changes. Return to your Dashboard and click "View blog" to view your new drop-down label menu in your widget.
Note:
Remember to back your template/HTML codes before doing anything , this will help you incase anything went wrong with your coding.
>>Hope it will help you!.. >>
0 comments:
Post a Comment