MyPage is a personalized page based on your interests.The page is customized to help you to find content that matters you the most.

I'm not curious

Responsive Design with Drupal

Course Summary

Takes you through the process of making a Drupal website that automatically tailors and sizes content for a wide range of displays, from desktops to mobile devices.       

  • +

    Course Syllabus

            Using the exercise files
            Exploring the finished project
        1. Setting Up the Environment
            Installing Acquia Dev Desktop
            Importing a Drupal website
            Restoring database snapshots with the Backup and Migrate module
            Understanding the Devel module
        2. Adaptive vs. Responsive Design
            What is responsive design?
            Understanding adaptive design
        3. The Adaptive Approach
            Discovering fixed-width layouts
            Understanding breakpoints
            Using Adapt.js with Drupal
        4. Fluid Layouts
            Discovering fluid layouts
            Exploring fluid widths
            Working with fluid margins and padding
            Making text fluid
        5. Fluid Images and Media
            Discovering fluid images
            Exploring fluid image techniques
            Working with fluid media techniques
        6. Media Queries
            Introduction to media queries
            Writing our first media query
            Creating a style sheet for each breakpoint
            Understanding media query best practices
        7. Responsive Menus
            Introduction to responsive menus
            Creating a responsive menu
            Integrating responsive menus into Drupal
        8. Responsive Tables
            Introduction to responsive tables
            Creating responsive tables
            Integrating responsive tables into Drupal
        9. Responsive Forms
            Introduction to responsive forms
            Creating responsive forms
            Integrating responsive forms into Drupal
        10. Responsive Tools and Techniques
            Adding min-width and max-width support with Respond.js
            Exploring context-aware image sizing
            Next steps


Course Fee:
USD 25

Course Type:


Course Status:



3 - 4 hours / week

This course is listed under Open Source and Development & Implementations Community

Related Posts:



Attended this course?

Back to Top

Awards & Accolades for MyTechLogy
Winner of
Top 100 Asia
Finalist at SiTF Awards 2014 under the category Best Social & Community Product
Finalist at HR Vendor of the Year 2015 Awards under the category Best Learning Management System
Finalist at HR Vendor of the Year 2015 Awards under the category Best Talent Management Software
Hidden Image Url

Back to Top