How to add Navigation Menu - Style 7

To see the live preview of this button, click here! 

To get this menu button, follow the instruction given below.

1. Edit the codes

To edit the codes, I recommend you to use http://htmledit.squarefree.com/ to edit while viewing the Live Preview immediately. The main codes that you need to change are - YOURLINKURL (Change this to your link url) & titlehere (Change this to your own menu title)

<style type="text/css"> .nav9{ -webkit-transform: rotate(0deg) scale(1); -moz-transform: rotate(0deg) scale(1); -o-transform: rotate(0deg) scale(1); -webkit-transition:All 1s ease; -moz-transition:All 1s ease; -o-transition:All 1s ease; width:70px; padding:8px; margin:2px; font:10px arial; letter-spacing:1px; text-align:center; Text-decoration:none; background:#f7f7f7; color:#444444; text-transform:uppercase; display:inline-block; border:4px solid #fff; box-shadow:0px 0px 0px 1px #eee; } .nav9:hover{transform: rotate(360deg) ; -webkit-transform: rotate(360deg) ; -moz-transform: rotate(360deg) ; -o-transform: rotate(360deg) ; -ms-transform: rotate(360deg) ;-webkit-transform: rotate(360deg) scale(0.2); -moz-transform: rotate(360deg) scale(0.2); -o-transform: rotate(360deg) scale(0.2) }</style> <a class="nav9" href="LINK HERE">title here</a> <a class="nav9" href="LINK HERE">title here</a> <a class="nav9" href="LINK HERE">title here</a> <a class="nav9" href="LINK HERE">title here</a> <a class="nav9" href="LINK HERE">title here</a> <a class="nav9" href="LINK HERE">title here</a>

2. Apply the codes

For Blogger Template Designer user, you may put this navigation on your gadget section. Go to Home > Layout > Add a gadget > Choose HTML/Javascript > and paste the codes.  For blogskins/ Classic Template user, you may put the codes anywhere you wanted the navigation to be. Thank you :)