Layers

Use the {layer-name} assigned in the template editor to customize its properties. If you don't specify a property, Placid will use the default as defined in the template.

General Properties

There are some base properties that can be used on every layer type:

"{layer-name}": {
  "hide":false,
  "rotation":"...",
  "position_x":"...",
  "position_y":"...",
  "width":"...",
  "height":"...",
  "link_target":"...",
}
Property Description
hide Set true to hide this layer in the template; defaults to false
rotation Set the layer rotation from 0 to 359
position_x Relative positioning:
+10px add 10px to x-axis
-10px remove 10px from x-axis

Absolute positioning:
10px set x-axis position to 10px
position_y Relative positioning:
+10px add 10px to y-axis
-10px remove 10px from y-axis

Absolute positioning:
10px set y-axis position to 10px
width Relative sizing:
+10px add 10px to width
-10px remove 10px from width

Absolute sizing:
10px set width to 10px
50% set width to 50% of default layer width
height Relative sizing:
+10px add 10px to height
-10px remove 10px from height

Absolute sizing:
10px set height to 10px
50% set height to 50% of default layer height
link_target Add a clickable link to a custom target url when rendering a non-rastered PDF (f.ex. https://placid.app)

Text

"{layer-name}": {
  "text": "This is the text",
  "text_color": "...", // f.ex #FFFFFF
  "font": "..."

  "alt_text_color": "...", // f.ex #FFFFFF
  "alt_font": "..."
}
Property Description
text Text content. Line breaks can be forced using \n
Video only: You can supply an array of text values to create a layer with multiple values
text_color Text-color as hex-code #FFFFFF
font Set the font-family of the text layer! See all available font-families here or how to use your custom fonts
alt_text_color Alternate Text-color as hex-code #FFFFFF
alt_font Set the alternative font-family of the text layer! See all available font-families here or how to use your custom fonts

Picture

"{layer-name}": {
  "image": "https://...",
  "image_viewport": "1280x1024",
  "video": "https://...",
}
Property Description
image Image URL or URL of the website to screenshot
Video only: You can supply an array of image URLs to create a layer with multiple values
image_viewport Viewport size for screenshots widthxheight; defaults to 1280x1024
video Video URL (.mp4)

Shape

"{layer-name}": {
  "background_color": "...",
  "border_color": "...", 
  "border_radius": "...",
  "border_width": "..."
  "svg": "..."
}
Property Description
background_color Background color as hex-code #FFFFFF
border_color Border color as hex-code #FFFFFF
border_radius Border radius in px 2px or 2. (only available for rectangles)
border_width Border width in px 2px or 2
svg SVG URL

Browserframe

"{layer-name}": {
  "image": "https://...",
  "image_viewport": "1280x1024",
  "url": "https://placid.app",
}
Property Description
image Image URL or URL of the website to screenshot
image_viewport Viewport size of screenshots widthxheight; defaults to 1280x1024
url URL to insert into the browserframe's adress bar

Barcode

"{layer-name}": {
  "value": "...", 
  "color": "...",
}
Property Description
value The barcode value
color Color as hex-code #FFFFFF

Subtitle

"{layer-name}": {
  "srt": "...", 
}
Property Description
srt (optional) URL to SRT file
if not supplied, video clip will be auto transcribed