Menus, Sidebars
and Widgets

Oh My!

Overview

You'll see a bit of...

Main Menus

Several Ways To Create Menus In WordPress

The Menu Admin Panel

From the admin panel, you can create a menu, and if wp_nav_menu is in place, your menu will show with only the selected items.

Be sure you hit the "Save Menu" button, or it, you know, won't save.

NOTE: If no menu is created, but wp_nav_menu is still used, WordPress will display ALL of your pages

Show a Real-D example

The code behind this

Even if you have limited coding experience, this is incredibly easy.

Open your header.php file


    	<div id="header">
        	<?php wp_nav_menu(); ?>
        </div>
        
        // That's it...that's all you have to put for WordPress to display your menu
        // The other way is this
        
        <div id="header">
        	<?php wp_nav_menu( array('menu' => 'Main Menu' )); ?>
        </div>
        
    

The second example defaults to a created menu but if 'Main Menu' is the name of a created menu, it will take precedence.

Some things to note...

In the previous examples, it's important to understand the sequence of the menus

NOTE: To read up on wp_nav_menu yourself, click HERE

One of the best parts...

1. Each menu that is generated has a class of 'menu'

2. Each menu-item that is generated has a class of 'menu-item'

3. This allows you to write CSS once, for all menus that will be created.

NOTE: To read up on wp_nav_menu yourself, click HERE

And What Would You
Like As Your
Side?

Side of Sidebars

The wonderful world of sidebars...a few examples below

Psh...Typical WordPress

As I just said, WordPress comes standard with a sidebar, mostly because it started out as a blogging platform and the sidebar is a staple of blogs.

Every Theme uses the sidebar differently:

Sidebars and Footbars are easy to use and are complimented by widgets. Speaking of widgets...

Widgetize this...

Now that we've covered the very basics of Sidebars, let's look at what goes in those sidebars.

From the admin panel, access 'Apperance -> Widgets'

This theme rocks...

If you're not too code savvy, you'll want to make sure the theme you choose has the pictured containers, troughs, barrels, whatever containing device you want to call them.

That's where your widgets go

Standard Widgets:

These widgets are put in the Sidebar and Footbar containers by a drag-and-drop process.

Then there are usually other options.

WordPress Codex on widgets - Click HERE

Another Example:
In Real-D

Congratulations...

You now should have a pretty good grasp on how to get to your Sidebars



After this page will be more code-heavy slides about adding your own sidebars

MOAR CODE!!!

My Stuffskies

Twitter

LinkedIn

Portfolio

Presentation powered by deck.js

The End

/