How To Add Attractive Menubar With Icons For Blogger
2. Put checked marked in Expand Widget Templates
3. Find this tag by using Ctrl+F ]]></b:skin>
4. Paste below code Before ]]></b:skin> tag
#bloggertrix-bar{ margin:10px;} #bloggertrix-bar .link a{ float:left; padding:8px; background-color:#eeeeee; display:block; margin-right:9px; text-decoration:none; -webkit-border-radius:5px;-moz-border-radius:5px;border-radius:5px; font-family:Tahoma, Geneva, sans-serif; font-size:15px; color:#666; font-weight:bold; text-shadow:1px 1px 1px #fff; } #bloggertrix-bar .link a:hover{ background-color:#d2cece; text-shadow:1px 1px 1px #fff; } /*menubar by bloggertrix.com */
5. Now Find this code by using Ctrl+F <div id='content-wrapper'>
6. Paste below code Before <div id='content-wrapper'> code
<div id="bloggertrix-bar"> <div class="link"> <a href="Link"><img align="absbottom" alt="" border="0" height="16" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgs4FAsqZV9WBd4aat84YiTWwd9GmMx2MfSXZV30HUSIwH4WKEU2HqM93kUeYqDU_Xw6mvNuGtVCuV7KMwYJrEVcEVdrO8B3fXOVT-Uy-BbBUDJRSYcyIRhC-5dGR2Fo9RPHraWuIKVl9U/s1600/www.bloggertrix.com_home.png" vspace="0" width="16" /> Home</a></div> <div class="link"> <a href="Link"><img align="absbottom" alt="" border="0" height="16" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhgrHPlWXaBPmgaBzqPqd56fkjIWo1n-zfXh2Y-AZ6Mhyhp8yqAWYtJnKW1fQW8QfNAsCIJddso-b7Y2AjogXYL_vllDOBhOhKwKTsdxxEE6N8GWCuNv8QNB3nH9rOKx-L6GQ3MIgb7eic/s1600/www.bloggertrix.com_contact.png" vspace="0" width="16" /> Contact</a></div> <div class="link"> <a href="Link"><img align="absbottom" alt="" border="0" height="16" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjespS7N_604P1Qg8kK7l5ZrcDWmZSLjwwXQI7rVjAwuSIp0pQRb04TksyIlSV26uaIinX6JMgEYZQEFQK5N5wkmlF0bKvl6oo4lks7n2wbMuJnp9KifM8xUx8xAZuucaFC4JU1djkXgnQ/s1600/www.bloggertrix.com_+Help.png" vspace="0" width="16" /> Forum</a></div> <div class="link"> <a href="Link"><img align="absbottom" alt="" border="0" height="16" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgb4OFtAtlzsP6iarqb7KLOEtkm2sG9ic3DkCEhTR_agQIDbfGw9UzIctLcfdmXmLl4yN2p87Qy9CZC8BoTv6IhkHLP9I1AfBBtEsJ409i_2K2lr7hwsyGsjXP3qNBZUxjLcj5a4JHBZl8/s1600/www.bloggertrix.com_design.png" vspace="0" width="16" /> Advertise</a></div> <div class="link"> <a href="Link"><img align="absbottom" alt="" border="0" height="16" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgGhG-PF8OZrhDcYL2-wbn6jEJIb5OctBXj2DYCskezJiTHgAFg3JEUiQjrfV8upHBiqHsx9CBmGOPV1nXpw6lH2OwAl4eAZqjxBGwtpgMEqdeV6iBSMfmV8U-6374PjzcxbPyX-giJbxM/s1600/www.bloggertrix.com_001.png" vspace="0" width="16" /> Rss</a></div> <div class="link"> <a href="http://www.bloggertrix.com"><img align="absbottom" alt="" border="0" height="16" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiZxdQUMGh4bUnzlFk68qR6yYkGzh6eOjcJJt4a0JLGPlRxcj4Uxp6U1-dUgHLGfDsRsMC1xDyYG6GTkkkJ0p0S2rzbOTUdNAGXz7loBNQHLvK9eEsyFoi3Vua3BkiN9j1qjFqGU_vPKLg/s1600/www.bloggertrix.com-add.png" vspace="0" width="16" /> Add This</a></div> </div>
*Replace Link With your URL
*Replace Names with as your like.
7. Now save your template
you are done.
MADE BY BLOGGER TRIX
0 commentaires:
Enregistrer un commentaire