Tag Archives: menus

Navigation Menus 4 – Dessert

By Sue Bride (Sueblimely) | Published: March 20, 2008

Today is the fourth course in my series on blog navigation menus – dessert. Some ‘sweet’ menus for you to copy – suitable for WordPress and Blogger. Here is the html code you will need for all the examples: HTML <div id="menu"> <ul> <li class="selected"><a href="http://www.your home page.com">Link2</a></li> <li><a href="http://www.your link.com">Link2</a></li> <li><a href="http://www.your link.com">Link3</a></li> <li><a href="http://www.your link.com">Link4</a></li> <li><a href="http://www.your link.com">Link4</a></li> </ul> <div class="clear"></div> </div> Menu Bar Home Chain Links Cuff Links Sausage Links CSS <style type="text/css"> <!– #menu, #menu li a {background-color: #8AAADF; color: #ffffff; font-size: 1.0em; font-weight: normal; height: 1.5em; line-height: 1.5em; text-decoration: none; } #menu, #menu li {padding: [...] Continue Reading…

Posted in Design and Coding, Tutorials | Also tagged , , , , | 39 Responses

Navigation Menus 3 – Main

By Sue Bride (Sueblimely) | Published: March 14, 2008

I thought I would get down to the meat of the main menu today by showing you some css styling. HTML Code for all of these menus: An unordered list: <div id="navigation"> <ul><li><a href="#"id="a#current">Home</a></li> <li><a href="#">About</a></li> <li><a href="#">Page 1</a></li> <li><a href="#">Contact</a></li> </ul> <div> Menu 1 With no CSS styling – the list will display vertically: (If you try this with your current template, existing styling may alter the look of this): Home About Page 1 Contact Menu 2 display the list horizontally – display: inline; take away the bullets – list-style-type: none; CSS #navigation ul li { display: inline; list-style-type: [...] Continue Reading…

Posted in Design and Coding, Tutorials, Wordpress | Also tagged , , | 10 Responses

Navigation Menus 2 – Entrees

By Sue Bride (Sueblimely) | Published: March 12, 2008

Is your navigation system plain sailing ? image: by Today is a Good Day on Flickr Now we have considered where we want readers to visit on our blogs we need to look at how easily they can find their way there. This is where a good navigation system makes a difference. The more time readers need to search for where they want to go the less likely they are to stay on your site. We want our regular readers to easily find all the content since their last visit and new visitors to find content that interests them. Is [...] Continue Reading…

Posted in Accessibility/Useability, Design and Coding, Tutorials | Also tagged , | 18 Responses

Navigation Menus 1 – Appetizers

By Sue Bride (Sueblimely) | Published: March 10, 2008

The quick answer to why we need good navigation on our blogs is “useability” but as that term could refer to how easy it is to use your mp3 player or washing machine I should expand on this. If we consider where we want our readers to go, after they have read the page they are currently on, the answer will usually be “Somewhere else on my site”. Unfortunately menu bars and sidebar menus can become littered not only with too many hard to find links but with too many external links in the wrong places. Your navigation needs a [...] Continue Reading…

Posted in Accessibility/Useability, Design and Coding | Also tagged , | 16 Responses

Ultimate Blog (Party) Menus

By Sue Bride (Sueblimely) | Published: March 9, 2008

The party has begun. The 5 Minutes for Mom Ultimate Blog Party 2008 that is. Women bloggers worldwide are getting into a festive mood. Please come and join the fun. Welcome to those who are visiting because of the party. Good to see you here. I suggest good comfortable blog hopping shoes. Prizes galore are on offer. Last year over 1000 bloggers took part. This year even if you do not write a post inviting others along you can till take part – by commenting on at least 20 participating blogs. How could I take part, keep to my blog [...] Continue Reading…

Posted in Carnivals, Design and Coding, Tutorials | Also tagged , , , , | 25 Responses

All you need to know about styling lists

By Sue Bride (Sueblimely) | Published: September 16, 2007

Lists are used extensively within blogs, particularly in the sidebar; for example in blog rolls, category and archive lists. Lists within posts are an excellent way to improve readability and to highlight areas. Your blog software automatically creates some of these lists for you and your template styles them so you may not have had to worry about their formatting. However If you want to change the type of list or its styling you may find this of use: Types of Lists Unordered List (Bulleted List) This is more commonly known as a bulleted list – a list of items, [...] Continue Reading…

Posted in Design and Coding, Tutorials | Also tagged , , , | 10 Responses

Horizontal Menus for Blogs

By Sue Bride (Sueblimely) | Published: July 8, 2007

I have returned from a very welcome, if damp, few days in the mountains near Melbourne. This will give me a good excuse to use some of the photos I took and introduce some more techniques for incorporating them into blogs. I was under strict instructions not to use the internet while away – which was not hard as there was no connection. I did spend a little time finishing off a tutorial on styling navigation menus though. The rest was spent generally relaxing in front of a roaring fire and playing board games and pool with the family. So [...] Continue Reading…

Posted in Design and Coding, Tutorials | Also tagged , | 6 Responses