The Entity Behaviors Drupal modules allows designs to attach behaviors to the HTML representing an Entity.

There are lots of cutting edge Javascript libraries being produced which provide usability improvements and/or eye candy. They generally need to be wired into a page through HTML classes or data attributes. This puts them out of the reach of content creators and designers as it is only themers who have access to the presentation layer of Drupal. The Entity Behaviors module bridges this gap by allowing these Javascipt libraries to be plugged into entities such as Paragraphs and configured by a designer in the Drupal UI. Designers with knowledge of have the library works can then customise how the elements will behave on the page.

The first contrib module we worked on was Entity Behaviors Skrollr which does what it says on the box. Skrollr data attributes can be attached to Paragraphs and designers can easily achieve effects such as:

  • colour transitions
  • parallax effects
  • rotation
  • and any number of transformations based on scroll position.

The "user" in the case must be skilled enough to understand the way Skrollr works. It is not a point and click tool for laypeople. However, with a basic understanding it is possible to quickly configure some nice effects directly in the browser. This functionality will be handy for designers who need to get cool stuff out fast and want to bypass the standard workflow associated with implementing code in the theme layer.

Entity Behaviors Skrollr - background transform

A simple background colour transform based on the scroll position.

Entity Behaviors Skrollr - text visibility transform

The Daffodils

W. Wordsworth

I WANDER'D lonely as a cloud

That floats on high o'er vales and hills,

When all at once I saw a crowd,

A host of golden daffodils,

Beside the lake, beneath the trees,

Fluttering and dancing in the breeze

Continuous as the stars that shine

And twinkle on the Milky Way,

They stretch'd in never-ending line

Along the margin of a bay:

Ten thousand saw I at a glance,

Tossing their heads in sprightly dance.

Flower

 

The waves beside them danced,

but they Outdid the sparkling waves in glee:-

A poet could not but be gay

In such a jocund company!

I gazed, and gazed, but little thought

What wealth the show to me had brought:

For oft, when on my couch I lie

In vacant or in pensive mood,

They flash upon that inward eye    

Which is the bliss of solitude;    

And then my heart with pleasure fills,    

And dances with the daffodils.

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

Entity Behaviors Height

Sometimes you need to control the height of an element. This is a simple way to hack in the height from the UI.

A short paragraph

A long paragraph

Image Attribution