Join Morten Rand-Hendriksen for an in-depth discussion in this video Dealing with footer widgets, part of WordPress: Building Responsive Themes.
- View Offline
The footer of a web site is often left as unused real state. …I find the footer to be quite useful for adding further information about the site and links …to relevant content. …To make it easy to configure the footer area, I usually add a set of optional widgets in the footer. …You can see them down here at the bottom. …I added four different widgets here--Archives, Categories, Recent Comments, and Recent Posts--…but now that I've added the footer widgets, I need to make them responsive. …If we look at this theme and resize the window, you'll see that as we resize it, the footer …widgets automatically resize with it.…
The problem of course is that at some point the footer widgets become almost unreadable …because they're squished so tight together. …What we need to do is apply media queries to handle the footer widgets once the screen gets too narrow. …And what I want to do here is simply box each widget in its on 100% width box and then stack …them one after the other. …If we look at the footer widgets for the Developer Tools, you'll see why they do what they do.…
- What is responsive design?
- Installing the Anaximander example theme
- Deciding what screen sizes to target
- Designing menus
- Adding responsive images and video
- Using CSS media queries to apply different styles
- Handling sidebars on mobile displays
- Dealing with footer widgets
- Installing jQuery Masonry