Responsive Theming for Drupal

Responsive Theming for Drupal

by Mike Crittenden
Released February 2014
Publisher(s): O'Reilly Media, Inc.
ISBN: 9781449373313

Read it now on the O’Reilly learning platform with a 10-day free trial.

O’Reilly members get unlimited access to books, live events, courses curated by job role, and more from O’Reilly and nearly 200 top publishers.

Buy on Amazon Buy on ebooks.com
Start your free trial

Book description

If you want your Drupal website to work well on smartphones, tablets, and desktops, this practical guide shows you how to incorporate Responsive Web Design (RWD) with specific Drupal 7 themes. Ideal for experienced Drupal developers, this book takes you through RWD basics and shows you how to build sites based on Aurora, Zen, and Omega—three popular base themes created by Drupal contributors.

Table of contents

  1. Preface
    1. What You’ll Find Here
    2. Intended Audience
    3. Conventions Used in This Book
    4. Using Code Examples
    5. Safari® Books Online
    6. How to Contact Us
    7. Acknowledgments
  2. 1. Responsive Design: A Quick and Dirty Intro
    1. So, What the Heck Is Responsive Design?
    2. A Simple Example
    3. Stop the Scaling!
    4. Why Does This Rock?
    5. Back to Riley
    6. Mobile First Versus Desktop First
      1. Mobile Web Users Are A Huge Sector and Growing Fast
      2. The Importance of the First Target
      3. How Mobile First Changes Our Example
    7. Back to Riley (Again)
  3. 2. Responsive, Meet Drupal
    1. A Bit of A Primer on Drupal Theming
    2. Adding the Media Queries
    3. Adding the Viewport Meta Tag
    4. Moving on to Base Themes
    5. Using a Base Theme
  4. 3. A Short Primer on Sass and Compass
    1. Installation of Sass/Compass
    2. Learning Your Way Around Sass/Compass
    3. Feeling the Power
      1. Let Sass Calculate Your Colors For You
      2. Generate CSS Image Sprites with Compass
      3. Write Your Own Mixins
      4. Know Your Plug-ins
    4. Debugging Notes
    5. Moving Right Along
  5. 4. Responsive Theming With Aurora
    1. Pros and Cons
    2. Getting Started
      1. Step 1: Install Sass/Compass
      2. Step 2: Install Aurora
      3. Step 3: Create Your Custom Subtheme
      4. Step 4: Configure and Run Compass
      5. Step 5: Perform a Sanity Check
    3. Digging Into Aurora
      1. Aurora’s Goodie Bag
      2. A Primer on Aurora’s Sass Structure
      3. Getting to Work
      4. Making It Responsive
      5. Committin’ and Quittin’ Time
  6. 5. Responsive Theming Using Zen
    1. Pros and Cons
    2. Getting Started
      1. Step 1: Install Zen Using Drush
      2. Step 2: Create Your Subtheme
      3. Step 3: Set Your Subtheme as the Default Theme
      4. Step 4: Install Sass/Compass
      5. Step 5: Install Zen Grids
      6. Fire Up Compass
    3. Getting to Work
    4. Working With Zen Grids
  7. 6. Responsive Theming Using Omega
    1. A Note About Versions
    2. Pros and Cons
    3. Getting Started
      1. Step 1: Install Sass/Compass
      2. Step 2: Create Your Subtheme Using Drush
      3. Drush Integration
    4. Taking an Omega Tour
      1. Responsive Layouts Using Singularity Grids
      2. Making Use of Custom Layouts
  8. 7. Some Common Gotchas and Tips
    1. Different Resolution-Specific Navigations
      1. Select Dropdown as Mobile Navigation
      2. Mobile-Specific Navigation Hidden by Default
    2. Dealing with Responsive Images
      1. Installation
    3. Adding a Touch Icon for Mobile/Tablet Touchscreens
    4. Supporting Older Internet Explorer Browsers
    5. Styling/Testing Common Drupal Elements
  9. 8. Alternative Options and Next Steps
    1. Study Some More Base Themes
    2. Learn How to Compare Base Themes
    3. Become an Expert on Your Base Theme of Choice
    4. Study Up on Some Non-Drupal-Exclusive Responsive Techniques
    5. Know the Alternatives
      1. Create a Separate Theme
      2. Serve the Desktop Experience
      3. Provide a Mobile App
    6. Be A Student of the Community
  10. Colophon
  11. Copyright

Product information

  • Title: Responsive Theming for Drupal
  • Author(s): Mike Crittenden
  • Release date: February 2014
  • Publisher(s): O'Reilly Media, Inc.
  • ISBN: 9781449373313