Tab units can be extremely useful. They make it easy to provide the user with a lot of information without using a large amount of screen space. And they help give your site a more thought out and professional look when used properly.

[tabgroup]

[tab title=”Slider” id=”t1″]

[tab title=”Map” id=”t2″] Pellentesque ac felis mi, quis euismod quam. Donec interdum fringilla dui sit amet imperdiet. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nam quis lorem justo. Nullam sed hendrerit eros. Sed eget sapien ac nisi porttitor gravida eu sit amet elit. Proin quis arcu quis arcu bibendum ultricies. Praesent facilisis sagittis nunc, eu aliquet orci tempus at. Curabitur lorem nulla, vestibulum vel sollicitudin id, suscipit mollis sapien. Curabitur rhoncus, leo sit amet blandit ornare, ante metus pharetra nunc, quis mollis diam magna non felis. Morbi sit amet volutpat neque. [/tab]

[tab title=”Styled Content” id=”t3″] Pellentesque ac felis mi, quis euismod quam. Donec interdum fringilla dui sit amet imperdiet. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nam quis lorem justo. Nullam sed hendrerit eros. Sed eget sapien ac nisi porttitor gravida eu sit amet elit. Proin quis arcu quis arcu bibendum ultricies. Praesent facilisis sagittis nunc, eu aliquet orci tempus at. Curabitur lorem nulla, vestibulum vel sollicitudin id, suscipit mollis sapien. Curabitur rhoncus, leo sit amet blandit ornare, ante metus pharetra nunc, quis mollis diam magna non felis. Morbi sit amet volutpat neque. [/tab]

[/tabgroup]

[clearline]

The tab unit above is included with the Skeleton WordPress Theme which I use on this site. In addition to being highly useful and easy to customize if you desire, the Skeleton Theme is also fully responsive. A responsive theme down sizes itself gracefully when viewed on a smart phone or small portable computer. The tab unit above is included in the theme. You can add the tab unit to any post of page simple by using shortcodes. Here’s the complete shortcode list that is included with Skeleton.

The three differently styled tab units below are the brain child of Matt Walker at http://www.my-html-codes.com/. This is an extremely nice looking system and fairly easy to set up as a jQuery plugin.

[Edit: Having a little trouble with the CSS styling of the third version. I did not include his total body and wrapper css code as it conflicts with WordPress. Will update this when resolved.] Look for more information here after I work with these and spend some time checking them out.

• Overview
• Hotels
• Attractions
• For The Kids
• Restaurants
• Shopping

Additional Content:

Pellentesque ac felis mi, quis euismod quam. Donec interdum fringilla dui sit amet imperdiet. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nam quis lorem justo. Nullam sed hendrerit eros. Sed eget sapien ac nisi porttitor gravida eu sit amet elit. Proin quis arcu quis arcu bibendum ultricies. Praesent facilisis sagittis nunc, eu aliquet orci tempus at. Curabitur lorem nulla, vestibulum vel sollicitudin id, suscipit mollis sapien. Curabitur rhoncus, leo sit amet blandit ornare, ante metus pharetra nunc, quis mollis diam magna non felis. Morbi sit amet volutpat neque.

Tab 3 content

5000

Princessa says:

For me one of the joys of travelling is tasting the local food. Unfortunately this is not always as straight forward as it might seem. If it is your first time in a place where you do not know anyone and even worse, if you speak a different language then finding a good well priced restaurant can be more difficult than finding a three leaf clover. And you surely know how frustrating it is paying good money for bad food.

- How to Choose a Restaurant

Tab5 content

[clearline] [clearline] [clearline]

• Tab 1
• Tab 2
• Tab3
• Tab 4
• Tab 5

Tab 1 content

Tab 2 content

5000

Tab 4 content

Tab 5content

[clearline]

[clearline]

[clearline]