Template properties are unique properties of all components used in the template created in template editor. You can see the list of all template properties in the Preview > Live Preview popup.
Template properties are the combination of component ids and component properties, for example:
my-image.src- image component with id
my-image.width- image component with id
my-text.text- text component with id
What is a component?
What are template properties?
Template properties are unique properties of all components. You can assign values to template properties to define how the component will look like, for example:
my-rect.color=rgba(255,255,255, 1)- makes a component white,
my-rect.opacity=0.2- makes a component nearly visible,
my-rect.opacity=0.0- makes a component invisible,
my-rect.rotation=45- rotates a component by 45 degrees,
my-text.text=Hello World- changes text of the Text component,
my-image.src=https://example.com/my-image.png- changes an image source of the Image component,
Common component properties
These properties can be used with every component.
y- y position in pixels
x- x position in pixels
rotation- rotation in degrees 0 - 360
opacity- opacity, eg:
The Render component is a unique type of component
which can be used to override template settings when you connect 3rd party integrations.
_render value as Component ID to adjust general render options,
_render.fileName=MyFile to change the name of the rendered file.
_render.downloadFileName- custom file name for rendered file that is used for saving and downloading files, file extension is added automatically, allowed characters:
_render.fileName- custom file name for rendered file, it is used in the link to the rendered file, eg.: https://cdn.renderform.io/xyz/results/MY_FILE_NAME.jpg, file extension is added automatically, allowed characters:
color- rectangle fill color (eg:
borderColor- rectangle stroke color (eg:
radius- rectangle radius of all corners
color- circle fill color (eg:
borderColor- circle stroke color (eg:
borderWidth- circle stroke width (eg:
text- text value
color- text color (eg:
QR Code Component
value- QR code text, URL or anything else to encode
color- QR code color, eg:
src- image URL or base64,
borderColor- border color, eg:
borderWidth- border width in pixels (eg:
Tip: Re-use uploaded images
You can reuse already uploaded images by using
media: prefix in
src property. For example:
File names are always taken from original file names from your computer. List of all your uploaded images can be found in My uploads.
Currently, there is no option to change image names.
value- active rating value
No additional properties