WordPress 4.0 Site Blueprints(Second Edition)
上QQ阅读APP看书,第一时间看更新

Setting up navigation menus and widgets

Most themes support navigation menus that you can edit using the WordPress admin screens. This is much easier than coding your menus. They will also support widgets, which are items you can add to widget areas (normally in the footer and sidebar) to display lists of posts, links to other sites, social media feeds and links, and much more.

Let's start by setting up the navigation menu.

Creating the main navigation menu

You can use the Menus screen to create one or more navigation menus; sometimes, you might want to add extra smaller menus to your footer, for example, to display links to the popular content. But here, we'll create the main navigation menu by performing these steps:

  1. Go to Appearance | Menus.
  2. Depending on how your theme is set up, you may see a dummy menu displayed with your pages. To create a menu from it, click on Create Menu.
  3. Click on the Primary Menu checkbox below the menu. This will add it to the site's main navigation area.
  4. Click on the Save Menu button.
  5. Now go back to your site's frontend to view your menu:
    Creating the main navigation menu

    Fig 1.20: The site with a navigation menu

  6. Go back to the Menus screen to make adjustments to your menu if you need to. You can drag additional posts, pages, and categories (if you've created categories for your posts) on to it.
  7. Every time you make changes, remember to click on the Save Menu button. WordPress doesn't save changes to the menu in the background.

Adding widgets

Now let's add some widgets. Each theme will have different widget areas, which is where you place your widgets. Normally, you'll find widget areas in the sidebar and footer, but this theme has extra ones, giving more flexibility. Perform these steps:

  1. Go to Appearance | Widgets.
  2. By default, WordPress places a set of widgets in the theme's first widget area. In this theme, the first widget area is in the header, and those widgets look a bit odd there. Remove all of them except the Search widget by clicking on the arrow to the right of its box and clicking on Delete.
  3. Now, drag some widgets into the other widget area, putting them where you think they are appropriate. Think about mirroring the content in your old site where possible. If you want to just insert some text or HTML, you can do this using the Text widget. You can add more than one widget to each widget area, but don't go too mad!

Here are my widgets displayed in the Widgets screen:

Adding widgets

Fig 1.21: The populated Widgets screen

Here they are on my site's home page:

Adding widgets

Fig 1.22: The home screen with widgets