| Drupal

drupal-formatter-embedMany websites want to allow users to submit videos, audio files, documents and the like.

However, if those files are stored on other sites, it can be difficult to display that content consistently. For example, if you allow people to submit YouTube videos, there are multiple different types of embed code.

One of our members wanted to allow users to submit Google docs that would automatically be shown inside iframes.

The solution to all these problems is the "Custom Formatters" module. Here's how to use Custom Formatters:

The Set-up

We have a content type called Documents. There's a Text field called: Google Doc ID:

media_1398884457297.png

We also have a Google doc. The ID of the Google doc is in the URL:

media_1398884567424.png

Creating a Custom Formatter

media_1398883044081.png
  • Gee the formatter a name and description.
  • Under Format, Choose HTML + Tokens. The other option is PHP.
  • Choose the Field type you want to use. In this example, choose Text.
media_1398883163030.png
media_1398883429749.png
  • Click Tokens.
  • Choose the field that you created earlier:
media_1398883341357.png
  • Replace the specific Google ID in your formatter with the token:
media_1398883393487.png
  • Click Save.

Applying a Custom Formatter

Let's apply the custom formatter to our field:
  • Go to Structure > Content types > Manage Display.
  • Apply your new format to the Google Docs ID field:
media_1398883548283.png
  • Click Save.

Using the Custom Formatter

  • Go to add a new Document to your site.
  • Enter the Google Doc ID as shown:
media_1398883596747.png
  • When you publish the content, the Google Doc ID will be automatically be converted into an iframe embed:
media_1398883618541.png

This technique should work for many other sites such as YouTube, Vimeo or Flickr. You can control the embed and just ask users to enter the unique ID.


About the author

Steve is the founder of OSTraining. Originally from the UK, he now lives in Sarasota in the USA. Steve's work straddles the line between teaching and web development.