Responsive Sticky Footer with flexible height

Thanks a lot to Galen Gidman for sharing his solution to create Responsive, Flexible-Height Sticky Footers in CSS – works like a charm.

Update
Turned out this causes Firefox and Internet Explorer to ignore max-width: 100% on images. To solve this we need to add table-layout: fixed; to the body tag (CSS below updated).

Markup

<header class="page-row">
  <h1>Site Title</h1>
</header>

<main class="page-row page-row-expanded">
  <p>Page content goes here.</p>
</main>

<footer class="page-row">
  <p>Copyright, blah blah blah.</p>
</footer>

CSS

html,
body { 
  height: 100%; 
}
body {
  display: table;
  width: 100%;
  /* Fix for Firefox and IE to keep correct max-width behaviour on images: */
  table-layout: fixed;
}
.page-row {
  display: table-row;
  height: 1px;
} 
.page-row-expanded { 
  height: 100%; 
}
Tags: 

Drupal: Keep EXIF orientation and allow manual cropping of images

Wow, this is more troublesome than expected.

Goal: Let users upload images straight from a camera and manually select an area of the image that should be cropped.

Issue: nearly all modern cameras use EXIF information to tell an images orientation. Drupal image actions ignore this information and all images in landscape format resulting in flipped portrait images. Imagecache Actions module provides an action to rotate images based on EXIF data. But: this doesn't work if the image was resized to the maximum dimensions straight after the upload. And: it doesn't play nice with most image cropping modules.

I've been fighting this issue for some hours now and have something that seems to work for me. It's not extensively tested yet, though. Here's what I came up with:

Modules:

Tags: 

Hover Intent for CSS-only Dropdown Menus

Looking for a way to improve on my pure CSS dropdown menus I found an article by Chris Poteet where he shared his thoughts simulating an hover intent effect by using CSS transitions. The snippet had a big drawback, though: anything that is under the dropdown menu, even when it's not dropped down, cannot be focused anymore. The solution is to simply not trigger the dropdowns opacity property but it's visibilty. I forked Chris' snippet on Codepen with my little change: http://codepen.io/klickreflex/pen/aAbyz

Drupal Base Theme Mothership breaks Contextual Links

Simple CSS solution. Set the trigger to display: block;:

// Contextual links
.contextual-links-region:hover a.contextual-links-trigger {
  display: block;
 }

Instead of patching mothership as it's suggested in the source link, I'd recommend doing this in your own subtheme. As soon as mothership-7.x-3.0 gets a stable release it shouldn't be needed anymore as it has been committed to dev already.

Source: https://www.drupal.org/node/1677374

Drupal Custom View Modes & Templates per View Mode

Just a quick reminder how to programmatically create your own Drupal 7 View Modes. Replace superdrop_helpers with the name of your own module and listing with the desired name of your Drupal View Mode.

<?php 
/**
* Implements hook_entity_info_alter().
* Creates a new view mode called <listing>
*/
function superdrop_helpers_entity_info_alter(&$entity_info) {
  $entity_info['node']['view modes']['listing'] = array(
    'label' => t('Auflistung'),
    'custom settings' => TRUE,
  );
}

/**
* Implements hook_preprocess_node().
* Template file suggestion for the previously generated view mode
* e.g.: node--article--listing.tpl.php
*/
function superdrop_helpers_preprocess_node(&$vars) {
  if($vars['view_mode'] == 'listing') {
    $vars['theme_hook_suggestions'][] = 'node__' . $vars['type'] . '__listing';
  }
} 

Thanks to wunderkraut for their article on this topic, check it out if you need more explanation than just the snippet:
http://www.wunderkraut.com/blog/drupal-7-custom-node-view-modes/2010-12-20

Tags: 

Drupal Module Comparison: Publish Button vs Safe Draft

To publish and unpublish content in Drupal you ususually have to tick or untick the Published checkbox before hitting the Save button. Sparing your users a click is alway a good idea, so why not considering a module that simplifies the action of publishing and unpublishing content.

Please welcome Publish Button and Safe Draft.

Both modules will simply add button actions to your nodes to publish/unpublish content instead of ticking that clumsy checkbox.

Here's why I opted for Publish Button over Safe Draft:

  • Publish Button is actively maintained, Safe Drafts was last updated in 2011
  • Publish Button can be enabled per-content type whereas Safe Drafts is always enabled globally
  • Publish Button features per-content type permissions
  • Publish Button hides empty vertical tabs opposed to Safe Draft, which shows the Publishing options tab even when it's completely empty
Tags: 

Pages