Join Chaz Chumley for an in-depth discussion in this video Understanding the Devel module, part of Responsive Design with Drupal.
- View Offline
If you've been developing or designing in Drupal 7 for any length of time, then you…may have come across a module called Devel.…If not, you may have asked yourself if there was any way to see exactly what variables…Drupal 7 outputs and how to best work with those values.…To make theming easier for us, let's take a look at where to find the Devel Module and…some of the best ways to use this module for our own needs.…The Devel Module is located at drupal.org/project/devel, and is another staple for any Drupal developer…needing a way for debugging their own Drupal sites.…
As part of the import of our fixed, adaptive, and responsive Drupal sites, I've taken care…of the installation and enabling of this modules for you. So that we can take a look at the…configuration of our site, you are going to need to first log in to the Drupal Instance we set up.…Go ahead and tab back over to our site or go ahead and bring it up in the browser at…drupal.fixed:8082/user and then go ahead and log in with the admin credentials.…
The course starts with setting up the Drupal environment in Acquia and defines some basic principles of responsive design before moving on to creating a new Drupal theme with fluid layouts, fluid media, and responsive tables and forms. Chaz also covers writing media queries, which allow you to create different style sheets for each device type.
The course wraps up with a look at Respond.js and content-aware image sizing in Drupal—responsive design tools that can optimize your project for maximum performance.
- What is responsive design?
- Understanding fixed-width vs. fluid layouts
- Working with fluid margins and padding
- Writing a media query
- Creating responsive menus and forms
- Adding min- and max-width support with Respond.js