Table of contents
Intro
You can create attributes during creation of custom shortcodes. Attributes are shortcode settings. Using the attributes you can, for example, create two identical shortcodes of different colours or sizes. Created attributes will be available in shortcodes creator, at insertion of a custom shortcode to post editor.
This is how shortcode without attributes/settings looks like:
[divider]
and this is a shortcode with attributes/settings:
[divider color="red"]
How to create attribute
While creating/editing custom shortcode, find Attributes section and press Add attribute button. You can add any number of attributes. Settings for creation of attributes are described below.
Field name and description
Full name of the field and its description. This text will be shown in shortcode creator at insertion of a shortcode into page editor.
Attribute name
Attribute’s short name. This name will be used at insertion of a shortcode into editor. This field can be filled with Latin letters in lower case [a..z], figures [0..9], and underscore “_” only. Example: use color as a name, and the shortcode will look like:
[shortcode color=""]
Default value
This value will be used as attribute value, unless any other value is specified at insertion of shortcode into editor.
Field type
This setting indicates the field type which will be used in shortcode creator at insertion of shortcode to page editor. All available field types are described below, in “Field types” section of the article.
Text
Simple text field. Possible default value: any text.
Number
Field for selection of number. Allows to select number using slider or text field. Allows to set minimum and maximum values and slider increments.
Color
Field for selection of colour. Allows to select color from drop-down color ring.
Dropdown
Dropdown list. When adding this attribute, dropdown options should be set as follows:
value1|Option 1
value2|Option 2
value1 text will be inserted into post editor as attribute value as shown in code below. Option 1 text will be shown in shortcode creator at insertion of shortcode.
[shortcode dropdown="value1"]
Use one of the values specified in Dropdown options field as a default values, for example value1.
Switch
Field with selection of value between Yes and No. Possible default values: yes, no.
Icon
Field for icon picker. Possible default values: name of vector icon in “icon: ICON_NAME” format or link to the image (for example: http://example.com/image.jpg).
Media library
Field for selection of image from media library. When selecting the image, link to it will be inserted. Possible default values: link to the image (for example: http://example.com/image.jpg).
Image source
Advanced field for selection of several images from the media library. Allows to create image galleries, sliders, etc. IDs of selected images divided by decimal points will be added as attribute values. Possible default values: list of image IDs divided by decimal points.