Join Joseph Lowery for an in-depth discussion in this video Restructuring navigation, part of Building Mobile Sites with Dreamweaver and WordPress.
Boy, is this primary navigation a mess. Let's skip the snazzy intro, and get to…work cleaning it up.…By the time this is finished, I want a clean and simple look for my…primary navigation.…So again, I'm going to go into style.css, and copy all of the navigation styles…that affect the primary navigation.…And those are the ones that start at nav.mainMenu, so I'll put my cursor there,…scroll down until we get to the last one, and then Shift+Select, copy it, head…on over to style_phone.css, scroll down to the bottom, and paste in our new code.…
Okay, so now we're ready to start up at the top, where it's nav.mainMenu, here on line 35.…And again, there are certain things we're going to keep, so that we can delete…those entries, like font-family.…And one of the major things I want to do here is reverse the color scheme.…So instead of white against a blue background, it's going to be blue against…a white background.…So let's change the color white to 00F, which is blue.…
We'll keep the width at 95%.…We're going to shrink down the font-size pretty heavily, because I see this has…
- Setting up an existing WordPress site
- Targeting configurable site elements
- Setting up media queries
- Preparing for adaptive images
- Styling a blog for tablets
- Restructuring navigation for different-sized displays
- Developing a WordPress site for phones
Skill Level Intermediate
Dreamweaver and WordPress: Core Conceptswith Joseph Lowery5h 44m Intermediate
WordPress Themes: Photography Portfolioswith Morten Rand-Hendriksen53m 2s Intermediate
1. Preparing Your Site to Go Mobile
Understanding media queries3m 50s
2. Retrofitting for Multiple Screens
3. Implementing a Full Mobile Redesign Strategy
4. Styling a Blog for Tablets
5. Developing a WordPress Site for Phones
- Mark as unwatched
- Mark all as unwatched
Are you sure you want to mark all the videos in this course as unwatched?
Take notes with your new membership!
Type in the entry box, then click Enter to save your note.
1:30Press on any video thumbnail to jump immediately to the timecode shown.