Join Morten Rand-Hendriksen for an in-depth discussion in this video Resizing the site title and the description, part of WordPress: Building Responsive Themes.
- View Offline
When creating a responsive theme, or any theme for that matter, I like to start from the …top; that means starting with the header itself. …The challenge with a header is that it usually has to contain multiple different components: …the site title and tagline, usually a background image of some sort, and also the menu, like you see here. …Your job is to make sure each element stacks up nicely, both to match your design and also …to be the easy to understand and functional. …Out of the box, Anaximander will have the site title and tagline, and then the menu should …appear directly under it.…
In some cases, in some browsers, the menu will appear shifted to the right here, and …that's fine, because we're going to be working on realigning the header right now to make …it match the design. …If we look at the design, you see that the title and tagline is shifted to the left and …the menu is shifted all the way to the right, and that's what we want to achieve. …If we were working with a static site, this would be very simple. …
- 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