Start learning with our library of video tutorials taught by experts. Get started
Viewed by members. in countries. members currently watching.
The many ways visitors access web sites, via mobile devices, tablets, and desktops, now requires sites to incorporate responsive design elements that adapt to different screen sizes and browsers. In this course, Morten Rand-Hendriksen demonstrates design strategies, best practices, and actual code examples for creating a responsive web site. The course covers layout, navigation, responsive video embedding, and content sliders. The final chapter shows how to create an index page with jQuery Masonry, a jQuery plugin that helps you create dynamic grid layouts.
With WordPress, you basically have three main routes you can choose to follow: use a responsive theme, use a theme switcher that serves up different themes depending on the device used, or use a plug-in that serves up a custom experience for mobile users. In this course will be looking at using a responsive theme, and through the course, I'll teach you how to build not responsive theme. If you ask me, using a responsive theme is the best solution to deal with the mobile issue. If you don't want to use a responsive theme, the second-best option is to use a mobile theme switcher plug-in and have a custom mobile theme that you can use instead.
What you see here on the desktop screen is a site I built for a company called Better Outcomes Consulting in Vancouver. On the Desktop it looks like a phone, but if you look at it on a cell phone, you only see the middle part, so it looks like an application instead. What you're seeing here is the result of using a theme switcher plug-in. So when you on a desktop you get one theme, and when you're on a cell phone you get a different theme. The last option you have is to use a mobile plug-in. The most popular mobile plug-in is one called WPtouch.
It gives you a customized mobile experience when you use mobile devices. The problem with this approach is that this mobile experience looks nothing like your main web site. You can customize it a bit to make it look more like your custom web site, but the mobile experience will always be a custom mobile experience. Deciding if you want a responsive theme, if you want a custom theme for mobile devices, or if you want to use a mobile plug-in is the first step on your path to creating a mobile-ready WordPress web site.
In this course, we will focus on creating responsive themes. If you're looking for a plug-and-play solution, check out the WordPress mobile solution's course right here in the lynda.com online training library.
There are currently no FAQs about WordPress: Building Responsive Themes.
Access exercise files from a button right under the course name.
Search within course videos and transcripts, and jump right to the results.
Remove icons showing you already watched videos if you want to start over.
Make the video wide, narrow, full-screen, or pop the player out of the page into its own window.
Click on text in the transcript to jump to that spot in the video. As the video plays, the relevant spot in the transcript will be highlighted.