The Basics

In order to display content elements on your site, follow this simple scheme:

{exp:channel:entries channel="my_custom_channel"}
	<h1>{title}</h1>
	{my_custom_field}
		{!-- the following code will loop available elements --}
		{element}
			{!-- you can parse element body here --}
		{/element}    
	{/my_custom_field}    
{/exp:channel:entries}

The “my_custom_field” tag pair is a Short Name you used when creating your custom field for the Content Elements fieldtype. An example of a short name can be {content} or {article}.

The “element” tag pair represents the actual element type being processed. The following element native types are currently available:

• {heading}
• {text_field}
• {textarea}
• {wysiwyg}
• {rich_text}
• {table}
• {gallery}
• {code}

Depending on other third party fieldtypes you have installed, you may have additional tags available such as Wygwam or Expresso editors – view all compatible fieldtypes here.

Elements are processed in a loop and every element can have its own HTML markup. For example, in order to display heading, textarea and code elements, use the following:

{exp:channel:entries channel="my_custom_channel"}
   <h1>{title}</h1>

   {my_custom_field}
       {heading}
           {value}
       {/heading}

       {textarea}
           <p class="text-area-style">{value}</p>
       {/textarea}

       {code}
           <div class="php-code-style">{value}</div>
       {/code}
   {/my_custom_field}
{/exp:channel:entries}

The above code will generate the following html:

<h1>Sample entry title</h1>

<h2>Sample sub-heading</h2>

<p class="text-area-style">Sample text area</p>

<div class="php-code-style">Sample code</div>

<h2>Sample sub-heading #2</h2>

<p class="text-area-style">Sample text area</p>