elegant themes

How to add a tabbed interface to your WordPress blog

| January 24, 2008 | 2 Comments

Headsetoptions has a great review of the types of tabbed interfaces available, and a tutorial on how to add one to your WordPress blog.

A tabbed interface is one of those boxes that you often see in the sidebar of a lot of premium themes where you click on tabs at the top, and it shows you different types of information in the same space. The main benefit of tabbed interfaces is that it helps save real estate on your blog, which can be pretty limited. Here’s an example from Solostream’s Premium WordPress Magazine Theme:

Tabbed interface on Solostream Premium WordPress Magazine Theme

Solostream also has a tabbed interface for the feature article section in some of his other premium themes.

Basically, there are three tabbed interfaces available: DOMtab, Tabber, and Tabs. The main difference between the tabbed interfaces are ease of use, and whether you can use them for commercial purposes.

Update Jan. 26, 2007: Another tabbing method that wasn’t mentioned on Headsetoptions is Yahoo! UI Library: TabView.

Check out the full post for the whole shebang: Anatomy of a Magazine Style Premium WordPress Theme – Part 2: DOMTab, Tabber, more

Tags: ,

Category: Tips


Comments (2)

Trackback URL | Comments RSS Feed

  1. Brandon says:

    Woah, that looks pretty slick. I’ve always been a big fan of tabs, they keep things organized in such a nice way.

  2. Thanks for the share, even it’s old post, but still useful up til now..

Leave a Reply




If you want a picture to show with your comment, go get a Gravatar.

More in Tips (46 of 95 articles)