Node #

A Node object represents a singular "chunk" of content within the context of a Vizy field. Each node has a type, attributes and different logic on how it should be rendered. Some nodes have block content, whilst others have no content.

Each Node shares the following attributes and methods.

Attributes #

AttributeDescription
typeReturns the type of node this is.
tagNameReturns name for the HTML tag the node should use.
attrsReturns an array of node attributes. This will vary for each node type.
contentReturns an array of nested Node objects.
marksReturns an array of nested Mark objects.
textReturns any body text for this node.

Methods #

MethodDescription
selfClosing()Whether this node has a self-closing tag.
isDeleted()Whether this node has been deleted. Only applicable to Vizy Blocks.
getTag()Returns the HTML tag name and attributes the node should use for the HTML tag.
getField()Returns the Vizy field model.
getType()Returns the type of node this is.
getMarks()Returns an array of nested Mark objects.
getAttrs()Returns any attributes stored against the node.
getContent()Returns an array of nested Node objects.
getText()Returns any body text for this node.
renderNode()Renders the node using in-built defaults.
renderHtml()Returns the result from renderNode() in raw HTML.
renderOpeningTag()Renders the opening tag for the node.
renderClosingTag()Renders the closing tag for the node.

Node Types #

Blockquote #

Properties #

PropertyValue
typeblockquote
tagNameblockquote

Bullet List #

Properties #

PropertyValue
typebulletList
tagNameul

Code Block #

Properties #

PropertyValue
typecodeBlock
`tagName = ['pre', 'code'];

Hard Break #

Properties #

PropertyValue
typehardBreak
tagNamebr

Heading #

Properties #

PropertyValue
typeheading

Attributes #

These can be accessed via attrs.

AttributeDescription
levelA numeric value for which level heading to use.

Horizontal Rule #

Properties #

PropertyValue
typehorizontal_rule
tagNamehr

Iframe #

Properties #

PropertyValue
typeiframe
tagNameiframe

Image #

Properties #

PropertyValue
typeimage
tagNameimg

Attributes #

These can be accessed via attrs.

AttributeDescription
srcThe URL to the path of the image.
altThe alternative text for the image.
titleThe title text for the image.
urlThe URL for the optional link surrounding the image.
targetThe target for the optional link surrounding the image.

List Item #

Properties #

PropertyValue
typelistItem
tagNameli

Ordered List #

Properties #

PropertyValue
typeorderedList
tagNameol

Paragraph #

Properties #

PropertyValue
typeparagraph
tagNamep

Vizy Block #

Due to Vizy Blocks being able to support custom fields, you can directly call a custom field's handle on a Vizy Block node object.

For example, you might have a custom field attached to a Vizy Block with the handle plainText. You could access this value via:

{{ node.plainText }}

{# Shortcut for: #}
{{ node.values.content.fields.plainText }}

It's not recommended to use node.values.content.fields to retrieve field content unless you know what you're doing. The direct access method runs field content through normalizeValue() in order to convert the raw, plain values stored in the database, to values the corresponding field requires. For instance, a Date field would convert a plain text date into a DateTime object.

Properties #

PropertyValue
typevizyBlock
handlemixed.

Attributes #

These can be accessed via attrs.

AttributeDescription
idThe ID for this block.
enabledReturns whether the block is enabled or not.
collapsedReturns whether the block is collapsed or not.
blockTypeEnabledReturns whether the block type is enabled or not.
valuesAn array of content values. Refer to below.

Values #

These can be accessed via attrs.values.

ValueDescription
typeThe ID for the block type.
typeEnabledWhether the block type is enabled or not.
content.fieldsAn array containing the field data.

Methods #

MethodDescription
getBlockType()Return the block type object.
getFieldLayout()Return the field layout object.
getEnabled()Returns whether the block is enabled or not.
getBlockTypeEnabled()Returns whether the block type is enabled or not.

Get started with Vizy

Available for Craft 3. Get it from the plugin store.