‘Widgets’ are the WordPress for little specialized packets of code that grab a certain type of content – testimonials, maybe, or a tag cloud, or a list of recent posts – from your site’s database, massage that content in some way, and then present it on-screen inside a supplemental content area built into your site’s template (often in a right column beside the main content column, or below that content.)
Most of our themes contain several widgetized areas, so you’ll have a nice range of choices when deciding how to incorporate extra bonus content on your pages and posts. Working with widgets is really simple.
In your admin screen’s lefthand navigation menu, go to ‘Appearance’ / ‘Widgets’. This takes you to the Widget management screen. There are two boxes in the left column:
- Available Widgets – listing all the widgets available for you to work with.
- Inactive Widgets – a storage area for widgets you’ve decided to remove from active service but want to retain their settings in case you want to reinstall them quickly later.
In this screen’s right column is a list of all the widgetized areas available in your current Theme (WordPress’s term for a visual template). In our family of themes, many widgetized areas are consistent across themes. Usually:
- Primary and Secondary appear in a right column (or sometimes left) next to the main page content. Multiple widgets loaded in either of these areas stack top-down, in the order you arrange them.
- Subsidiary is a widget area in your site’s footer (below all content). Multiple widgets loaded in this area run across the screen in 3 or 4 columns, depending on your specific theme.
- Before Content and After Content, as they say, display widget content in the same column as your page’s main content, either directly before or directly after it.
You can explore the placement of your theme’s other widget areas for yourself, but right now let’s experiment quickly with a commonly-used widget.
- Click on the little gray down arrow near the right edge of your Primary widget area (at or near the top of this screen’s right column). This opens the Primary area and makes it easier to drag and drop a widget in our next step.
- Most sites should offer their visitors a Search box. You’re going to add one using WordPress’s Search widget. Find the Search widget in your Available Widgets box — you may want to drag your browser window as wide as you can so that 3 columns of widgets fit across and you don’t have to scroll down as far — then drag and drop the Search widget into your Primary widget area.
- Open up another browser window or tab and visit the front end of your site. See that there is now a search box at the top of your right column? Go back to your admin screen and drag the Search widget to a different widget area in the right column, then go back to your site’s front end and hit refresh. See how the search box has moved? Cool how easy that was, isn’t it?
- Different widgets have different configuration options. Click the little gray down arrow near the right edge of the Search widget you just installed in your Primary area to reveal this widget’s options panel. The Search widget comes with preset defaults, but it lets you set a custom title, label, inside the searchbox text, and submit button text. Change any of these that you like, then click this widget’s blue ‘Save’ button.
- BONUS EXTRA CREDIT! MightyLittleWebsites.com sites, including yours, all make use of a powerful plugin called Widget Logic, which gives you fine control over the conditions under which any particular widget appears on your site. Want a testimonial box that appears only on your site’s home page? A tag cloud that appears only on single post pages? Widget Logic allows you to make it happen. Every widget on your site has a ‘widget logic’ configuration box that allows you to enter control codes that turn your widget on or off. Though not for the faint of heart – you’ll need to read and understand some examples of php code in order to use widget logic successfully – the degree of control this gives you is quite wonderful. Widget Logic’s documentation with examples is here when you’re ready to give it a try.