Are you looking for a way to create content on a node that uses the build-in Umbraco data types, yet let’s the content editor decide how many fields he actually needs? Do you want your content editors to be able to order the fields as they see fit? Are you tired of having to create ‘data’ sub nodes just so you have the data in Xml format for easy transformation? Or are you just looking for a version of the Repeatable Custom Content that works with Umbraco 4.5+?

 

Then it is time to open the curtain for another Umbraco data type grown here at the FARM called Embedded Content (version 1). In short it allows you to add content to a node with pretty much the same outcome as if you were using data sub nodes. For example see this implementation of specifications for a product:

- Product

  - Product specifications

    - Package measurements (value: 200cm x 15cm x 150cm)

    - Package weight (value: 5.3 kg)

    - Available colors (value: yellow, red, blue)

Pretty much the same can be achieved with the Embedded Content data type by creating a new instance of it, adding 2 properties ‘name’ and ‘value’ to it and adding it to the product node. You will then be able to add as many ‘name-value-pairs’ as you like to the control (as you are able to create as many sub nodes as you want) and sort them to your liking (again same as with the sub nodes). Yet it is all embedded in the product node and it gets all saved as Xml in the backend. You can use a range of basic Umbraco data types for the Embedded Content properties, at the moment these are

• Textstring
• Textbox multiple
• True/false
• Content picker
• Media picker
• Simple editor
• Date picker

After installing the package you will first have to create a new data type with a name of your choice, and then set it to use to 'Embedded Content'. After saving you will be able to add custom properties to the datatype, you can also edit, delete or re-order them. In the following example I have created a new Embedded Content data type with 5 properties:

Image 1: An Embedded Content data type instance with 5 properties.

 

Image 1: Add a new property to the control.

 

Here is a quick overview of the individual options:

Name	the name of the property, just for the editor
Alias	this is the name of the Xml node when data for this schema gets saved (see below for an example)
Type	the type of this property
Description	a short description for the purposes of the editor
Show in title?	if ticked then this property will be displayed in the content list which the content editor sees

 

Image 3: Re-order the properties

 

Now it is time to use the Embedded Content data type on a document type, create a new node and add some content to the control:

Image 4: Add a new entry to the list

 

Image 5: Reorder the content list

 

Here is the Xml data which gets saved to the database:

<productSpecification>
  <data>
    <item id="1">
      <name propertyid="1">Package measurements</name>
      <value propertyid="2">200cm x 15cm x 150cm</value>
      <mediaItem propertyid="3" />
      <contentItem propertyid="4" />
      <validFrom propertyid="5" />
    </item>
    <item id="2">
      <name propertyid="1">Packaged weight</name>
      <value propertyid="2">5.3</value>
      <mediaItem propertyid="3" />
      <contentItem propertyid="4" />
      <validFrom propertyid="5" />
    </item>
    <item id="3">
      <name propertyid="1">Available colors</name>
      <value propertyid="2">yellow, green, blue</value>
      <mediaItem propertyid="3">1062</mediaItem>
      <contentItem propertyid="4">1065</contentItem>
      <validFrom propertyid="5">2011-01-14 00:00</validFrom>
    </item>
  </data>
</productSpecification>

 

You can now easily transform this e.g. with XSL:

Image 6: A simple xsl:for-each statement to loop through the properties

 

The output on a sample page would then be something like this:

Image 7: sample output

 

In conclusion this is a really flexible and and highly customizable data type which allows you to quickly add a complex type (so to speak) to a content node, giving the content editor as much flexibility as possible concerning the number of items and ordering. As such I am sure it will come in handy for a broad range of tasks and I am really pleased that we can make this data type available for everyone working with Umbraco. Enjoy!

 

Last but not least a couple of things to note:

• Please stay clear of ‘;’ in the description when defining properties, it will mess up the property definition string (there is also a warning on the control)
• Although it is possible to change the properties of an Embedded Content type when it is already in use it should be handled with the utmost care. Changing the order of properties will be absolutely fine, changing the control type of the individual properties will pretty much work like it works with the fundamental Umbraco data types. Everything else is a bit risky to say the least…