Luckily the pages gadget is easy enough to set up. In addition to this you can also use the link list gadget to create a navigation. One of the best things is the ability to use lots of different fonts styled easily into the design of your site. Simply select the advanced selection in the template designer and choose the element class and style it as you wish. You can also create yourself a custom navigation with the html/javascript gadget. With that you can set anything to any element class that you desire. I used that gadget to do the similar navigation at the bottom of this blog. It is from http://purecssmenu.com/, and you will have the advantage of being able to create multiple layers of children pages. Some of the free menus from that site don't even need to have images installed because they just use colors. Be sure to register before you begin so that you will be able to easily download the complete files.
The navigation that I have on the top of this site uses the pages gadget with all of the background tabs set to transparent. Then by adding css code to the blog and images to my picasa albums and linking to them in the css you can add a lot to the styles available. with an editor like photoshop or GIMP you can create some really cool effects. Add the following css code in the template designer and it should work for you. You will have to change the image paths to ones that match your image content.
.tabs-inner .widget li a {
height:30px;
width:110px;
padding-top: 0em;
padding-right: 0em;
padding-bottom: 0em;
padding-left: 0em;
text-align:center;
background-image:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjZvr2Cfqn_1_Kr3b1aNXgBGPlXzk56ZIhcKlyuog9AiXLIFOpjyCKFqw1Mk10FWIFhUy6oVITmXv0wV5xYKgk9KAqml07FIUhq1qHVXdNSNoJCrmoHzZ_X2H9i0nb-kPszyAK-TyUt2fU/s110/btn3.jpg);
background-repeat: repeat-x;
}
.tabs-inner .widget li.selected a, .tabs-inner .widget li a:hover {
background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhWdxten5eLQhlHisvrA5xASQnIiOyLumZl3c9Jih7_g4bqn9P-3J1wKeM5wIgULzDBfCZN7pN_YWYwL3MRGs1wtcg-vz6BQd8fYeIXy7UqTgaghL9oPb421AStLoauySnpkNDnhbE-xcQ/s110/btn4.jpg)!important;
background-repeat: no-repeat;
background-position: center top;
}
.tabs-inner .widget li:first-child a{
padding-left: 0em;
}
