Experimental project

This is a sandbox project, which contains experimental code for developer use only.

This module allows various block placements on a page for different sized viewports (e.g screens). The moving operation of a block is handled by Javascript which allows a single version of the markup served by Drupal but provide different changes in the front end. This, together with the Breakpoints module enables various changes in a responsive website.

Example: An article page may display its Related Links block under the main content on a mobile-sized screen but it really should be in a sidebar on larger screens.
The mobile/content first approach renders the block under the main content and if Javascript finds that the page is actually viewed on a desktop sized screen, it will move the block into its configured position on the page. This supports the progressive enhancement approach.

All the conditions and reactions are defined by Context which can then be exported as features.

Dependencies

  • Breakpoints
  • Context
  • The javascript bit depends on Enquire, an external library for media matches. Needless to say, to support older browsers where window.matchMedia is not available, a polyfill is required. One great example is media-match. Loading this polyfill is not handled by the module right now.
Supporting organizations: 

Project information