Element

This object represents an element in catalogue elements list. Read more about using Element catalogs.

Every element page has this property accessible from element property. Every page with elements type template has property elements containing array of element objects bound to the page. Elements list can be obtained also by using {% elementscontext %} tag from all pages. See more from elements listing template example and element page template example.

Common properties for all elements

element_definition_id

Id of element definition model. See also model_name.

new_record?

Returns true if element is not yet saved to server. Useful if content areas will additionally be bound to element. If element is new this binding should not be done as the element to bind it to does not exist.

{% unless element.new_record? %}
  {% content name="element_gallery" bind="Element" %}
{% endunless %}

page

Returns the page object of elements page where current element is located.

page_id

Returns related page object ID.

title

Returns title of element. Property can be made user editable in template.
In element object template the title has to be present and editable, as otherwise object can not be saved.

{% editable element.title %}

model_name

Returns name of element model.

{% if element.model_name == "People" %}

url

Returns URL for given element (e.g. "/people/jon").

path

Returns path (slug) of the element (e.g. "jon").

path_with_page

Returns full path of the element without leading slash (e.g. "people/jon").

position

Order of the element in context of the parent page.

created_at

Element creation time.

updated_at

Last update time.

User defined properties

All user defined properties of element definition are accessible directly as element properties.

If user has defined a property with code description, editable tag for this in elements template would be:

{% editable element.description %}

Editable tag generates the editable field depending of the property type. If property type is image, the image drop area is generated. Currently the image drop area supports only one size of the image. By default drop area saves original image. User can set target_width parameter to specify the expected size of the saved image. For example if image property should be rendered into 800px wide container:

{% editable element.image target_width="800" %}

In that case the image drop area saves the image which width is closest to the target width instead of original.

Iterating over properties

It is possible to iterate over all properties of current element by using {{ element.model_fields }} collection. Each property description in this collection also contains property name, data type, key name, available options and of course, its value.

{% for field in element.model_fields %}
  {{ field.title }}: {{ field }}<br/>
{% endfor %}

Each item in model_fields collection has following properties:

key – field key that can also be used accessing element value directly
title – field title set in model settings
data_type – field data type
options – field options. Only available for fields with select data type
value – element value for given field

As a convenience, using {{ field }} directly also outputs the field's value.

to_json

Serializes the element into a JSON string-

Developers