For being able to identify HTML tags for editing, we use special CSS classes. This is handy if you want to add special editing behavior to a particular piece of CMS content. However, for making a generic editing utility available to a wide range of CMS content, e.g. to all string fields on a page, all the HTML tags containing string field values need to be identified.

To make this possible, the scrivito_tag helper adds a special DOM attribute, data-scrivito-field-type, to every tag. It contains the type of the CMS attribute for which the tag has been rendered. Thus, we can select all DOM elements that correspond to a particular CMS attribute type, in this case the string type:

Another DOM attribute, data-scrivito-field-name, lets you select DOM elements by a CMS attribute name:

By means of the data-scrivito-field-obj-class DOM attribute it is possible to select those DOM elements whose CMS attribute value comes from a CMS object of a particular object class:

Usually, this selector is combined with the data-scrivito-field-name selector. jQuery lets you build more complex queries taking account of the website layout:

You can identify DOM elements that represent widgets by means of the data-scrivito-widget-obj-class attribute:

The content of this DOM attribute is the object class name of the widget. You can use this jQuery selector to find widgets of a particular widget object class, e.g.: