Drupal Asset Module as “Components”

A Drupal 7 site-builder (and more) way to create reusable components that can be dynamically added & configured by content admins/editors.

A version of this was presented at the LA Drupal Meetup 3/14/17. This Meetup occurs every 2nd Tuesday; come by — everybody’s welcome!

The Problem

Ever hear this from your account manager?

The client wants a new type of page, just like this-one but with one different section.

… but you already have too many content types?

too many content types?

Or you could add yet another group of fields to an existing content type, but we know that just makes our lives harder, and decreases the AX.

A Solution

The Asset Module (and friends):

While Asset was intended for “media”, we’ll be using it a different way. Asset comes with a whole CKEditor integration thing I won’t get into.

This solution provides something similar to combination of Field Collections, blocks, Panels, Context, etc. so that content admins/editors can dynamically add and reorganize custom entities within a node — looking something like this:

The Inspiration

I didn’t come up with this idea. A fellow developer at Miles was inspired by a number of things, including:

We’ve been using it now for over a year.

What’s it do?

Asset creates a new entity, “Media Asset”:

  • UI Adminable
  • Fieldable via Field UI
  • View Modes
  • Views intregration
  • Works with Features

And no custom code required*!

Preparation

Install Asset, and also:

Enable the required and recommended modules, and consider some of Asset’s built-in sample and support modules:

  • Samples: Audio, Document, free HTML, Image, Video, Gallery
  • Support: Entitycache integration, Devel generate integration, UUID, Search/Contribution Widget, Feeds Import

Configure the Fields

Assuming required and recommended modules:

  • Add an Entity Reference field to your content type
  • Target: Media Asset
  • Mode: Simple (with optional filter by bundle)
  • Target bundles (other CT’s): choose as required
  • Allow users to add new assets
  • Allow users to add existing assets
  • Number of values: unlimited (or as desired)

So it looks something like this:

Manage Fields UI

You can even configure Assets within Assets.

Configure the Display

Position the Asset/component fields as desired and set format to “Rendered entity”.

Which will look something like this:

Manage Display UI

Of course layout your display as needed — the above is pretty flexible as you have the ability to position “Components” (Assets) above or below your “main” (Body).

Administer the Assets

At /admin/structure/assets you can:

  • Add asset type
  • Import asset type

And for each Asset type:

  • edit
  • manage fields
  • manage display
  • clone
  • export

The Asset Permissions set is pretty good:

  • Overall: Administer asset types, Administer assets, Access asset view page
  • Per Asset: individual Create, Edit and Delete

Asset Types

Some ideas:

You’re only limited by your imagination and need…
  • Heros
  • Promos
  • Slideshows/Gallery/Videos
  • Social Media widgets or feeds
  • Layouts/Columns
  • Custom adminable HTML/CSS/JS*
  • Related content

*This can be dangerous.

Customization

Just some random thoughts:

Other Benefits

  • Featurized Assets become easily reusable across sites
  • Put all your components on one page so you can use it as a “demo” for your client, or client approval

Disadvantages

  • Too much control in the hands of users can really mess up a site/page!
  • Since Assets are added to individual nodes, creating, say 50, landing pages involves adding the Assets to each node individually
  • Likewise, a configuration change or removal of an assets means touching each affected node
  • Currently there’s no support for Solr, Revisions, Workflow, and Entity Translation (although there’s a patch for a pre-v1.0 release)

Thanks for reading and I hope this was helpful; leave a comment, a like, or a share, thanks!

Show your support

Clapping shows how much you appreciated Todd Zebert’s story.