Drupal User Registration and Login with Email instead of Username

Drupal's default registration process is more complicated than it should be. To simplify the process I like my users to sign up and log in with only their email address and password.

There are various ways to deal with that issue, with Login Toboggan being one of the most popular ones. However, I rarely need all the other stuff that comes with this module and I prefer small modules that focus on a single task. Besides, Login Toboggan only allows to login with an email address as an alternative to the username, it doesn't remove the need to create a username in the first place.

So what I found best for my needs is a combination of the Email Registration module and a tiny custom module.

Output a Field Collection's Item ID and build a Jump Navigation

It just took me a while to figure this out, as I needed the Field Collection's ID to build anchors for a (views built) jump navigation. Here's how I'm wrapping each Field Collection item with a section tag that has a CSS ID with each Field Collection item's unique identifier.

<section id="section-<?php print $elements['#entity']->item_id; ?>">
  <?php print render($content); ?>

For future reference here's also the (simple) View that builds the jump navigation from Field Collection titles. It takes the node ID as an contextual filter from the URL. So you just get a jump navigation for the Field Collection items from the host node that's currently being displayed. Note that this View expects a field named field_section_title to use for the menu item.

Remove indentation for Gumby Fancy Tiles

A great feature of the Gumby Framework is its ability to easilycreate responsive tiles. They call those Fancy Tiles. For example you can use the following mixin to create a equally distributed grid with 5 columns on a desktop, 3 on a tablet and 2 on a mobile screen.

ul.fancy { 
  @include fancytiles (5,3,2);

What kept bugging me with that is that each tile gets a padding on both its left and the right side. This makes the entire Fancy Tiles show up indented compared to the columns of Gumby's regular grid system.

Link a Drupal Image Field to the destination of a Link Field

By default, Drupal's image fields don't allow to dynamically link them to the path set inside another field. There are module to tackle this such as Image Link Formatter and Link Image Field.

I prefer keeping display settings in code. It's really easy to wrap any Image Field with the destination of a Link Field of your choice inside a node template using l() the function:

// If there's an image and a link we wrap the link around it
if($field_pub_bild && $field_pub_link) {
  $linked_image = l(render($content['field_pub_bild']), $field_pub_link[0]['url'], array('html'=> TRUE, 'attributes' => array('target' => '_blank')));

Just make sure you set html to TRUE, otherwise the image tag will get escaped. For further options look at the documentation of the l() function: https://api.drupal.org/api/drupal/includes!common.inc/function/l/7

Bolt CMS: Configure AllowedContent markup for CKEditor

If you're looking for an awesome, leightweight and performant CMS that supports custom content types, Twig-based templates and, best of all, stores its entire configuration nicely in YML files consider looking at Bolt CMS.

Chances are, you might not like it's WYSIWYG editor's (which is CKEditor) default behaviour of not stripping any markup you paste into it.

You don't have to start fiddling around with CKEditor's configuration itself. Just head over to Bolt's config.yml an look for the wysiwyg part.

The interesting part is allowedContent. This gives CKEditors Advanced Content Filter instructions about the allowed and disallowed markup.

Here's my configuration:

Entypo and FontAwesome Icon Libraries for iDraw App

Font Awesome and Entypi Icon Libraries for the iDraw App

Though Sketch really does a lot of things better (especially the path tool) I still really like the iDraw Mac App a lot.

iDraw makes it refreshingly simple (compared with to Photoshop's Shape Management for instance) to manage custom forms. Simply create a new form library, select an shape in your current document and hit the little plus icon.

I did this process with two of my favorite icon libraries, Font Awesome by Dave Gandy and Entypo by Daniel Bruce. All credits for the original icons belong to those fine people. I just share my iDraw libraries to easily use those great icons within that great app.

As both icon pack's licenses (Font Awesome: GPL, Entypo: CC BY-SA 3.0.) allow redistribution I guess there's nothing wrong with sharing my Libraries for iDraw.

Are you aware of any further (open source) icon pack that's worth packaging for iDraw? Leave a comment and let me know!

FlexSlider in Drupal using Entity Field Query (EFQ)

Today I learnt how to stop using views for every little listing of entities while staying away from hacking SQL queries manually.

I'm a bit ashamed I haven't had a look at the infamous EntityFieldQuery class this far.

Here's my example that builds and inserts a FlexSlider slideshow within my page.tpl.php only for the front page.

In my case FlexSlider is installed and registered as a Library using Libraries and the FlexSlider module (making it possible to load the necessary assets using drupal_add_library