Stylish pagelist menu in blogger blog

Stylish Pagelist Menu

You may see that my blog's pagelist menu has some different style. Blogger.com default pagelist menu has no any styling. It looks dull, unsmart. But we can make it colorful with some little css code. I believe that you have read my previous post named 'Page List Menu Decoration' . I told you some simple things that can be done by pagelist menu. Today I am telling you some special way to give this menu a lovely style. Do the following to make a stylish pagelish menu in your blogger/ blogspot.com blog.

First of all you must login to blogger.com. Then go directly to Layout > Edit HTML page. Here we need to add some css codesnippet in the html area. Don't worry nothing is going to bad.

• Find ]]></b:skin>
• Add the codes below just before the ]]></b:skin>

• .PageList {text-align:left !important;
  background: #25587E;
  }
  
  .PageList li a {
  -moz-border-radius:4px;
  -moz-border-radius:4px;
  color:white;
  display:block;
  font-size:1em;
  padding:5px 15px;
  }
  .PageList li a:hover {
  -moz-background-clip:border;
  -moz-background-inline-policy:continuous;
  -moz-background-origin:padding;
  background:#ffffff none repeat scroll 0 0;
  color:#333333;
  text-decoration:none;
  }
  

• Click on SAVE TEMPLATE orange button.
• You have done everything. Your page list menu now take the look of my blog.
• If you like this post, then I will tell you more tricks to give Pagelist Menu a unique style.