Post Links For Static Pages

With this tweak you can add more links into your page list and you can also link to outside sites. Normally with the Page gadget you can only have up to 10 Static Pages. But using this method will be little more work but you can have unlimited amount of links in the Page List.


First off I want to point out what makes Page gadget links look the way they do. This is done through the CSS styles located in your template, it has nothing to do with the gadget its self.


You can go the easy route and add a Link List gadget just below the header. This would give you the same design and look as a Page gadget but allow you to make use of post or outside links.


The other option is to make your own Page gadget with a HTML/javascript gadget. This is a little more difficult, but if you ever decide to customize the tabs and links even farther then you would already be ahead of the game. I will be making tutorials on how to customize your tabs and links making them truly unique in the near future. 


1. On your Page Elements screen add a HTML/javascript gadget.
2. Input this code below


<ul>
<li><a href="www.MyURL.com">Page 1</a></li>
<li><a href="www.MyURL.com">Page 2</a></li>
<li><a href="www.MyURL.com">Page 3</a></li>
<li><a href="www.MyURL.com">Page 4</a></li>
<li><a href="www.MyURL.com">Page 5</a></li>
</ul>


This code above is just basic HTML coding no more.


Replace the Orange with the URL you want that Page Link to go to.


Replace the Red with the the Name you want that Page Link to display.


If you want more or less you can add or remove one of these lines below.


<li><a href="www.MyURL.com">Page #</a></li>


This HTML/javascript gadget must be placed in the Crosscol section of you blog. That is the section just below the header.


You have no need to read any farther unless you want to know about the HTML used in this tweak.
This tweak is really just three HTML codes put together. Below I will go over each one.


Keep in mind all HTML codes have a Start Tag and a Closing Tag.


This HTML code is to designate a Unordered List (UL)


Start Tag: 
<ul>


Closing Tag:
</ul>


This HTML code is to designate a List Item (LI)


Start Tag:
<li>


Closing Tag.
</li>


The last part is a bit different and requires more then a Start tag and End tag.
<a href="www.MYURL.com">Link text</a>


This is just a basic Hyperlink code. Every time you click the link button in the Post Editor you are creating one of these. The Anchor (A) is to designate followed by the Hypertext Reference (HREF). 


When we put all 3 codes together we get this below.
<ul><li><a href="www.MyURL.com">Link Text</a></li><ul>