Moving image with border & text

POST https://api.shotstack.io/{{ENV}}/render

An image with a sliding motion effect behind a border. The border is a PNG with a transparent area. Text is layered over the video.

Example Image JPG

Request Body

{"timeline"=>{"soundtrack"=>{"src"=>"https://shotstack-assets.s3.ap-southeast-2.amazonaws.com/music/disco.mp3", "effect"=>"fadeOut"}, "background"=>"#000000", "fonts"=>[{"src"=>"https://shotstack-assets.s3-ap-southeast-2.amazonaws.com/fonts/LilitaOne-Regular.ttf"}], "tracks"=>[{"clips"=>[{"asset"=>{"type"=>"html", "html"=>"<p>Shotstack enables businesses to massively scale their video production capabilities using code.</p>", "css"=>"p { font-family: \"Lilita One\"; color: #ffd300; font-size: 64px; text-align: center; }", "width"=>600, "height"=>600, "background"=>"transparent"}, "start"=>0, "length"=>6}]}, {"clips"=>[{"asset"=>{"type"=>"html", "html"=>"<p>Shotstack enables businesses to massively scale their video production capabilities using code.</p>", "css"=>"p { font-family: \"Lilita One\"; color: #e90ec0; font-size: 64px; text-align: center; }", "width"=>600, "height"=>600, "background"=>"transparent"}, "start"=>0, "length"=>6, "offset"=>{"x"=>0.004, "y"=>-0.004}}]}, {"clips"=>[{"asset"=>{"type"=>"image", "src"=>"https://shotstack-assets.s3.ap-southeast-2.amazonaws.com/borders/80s-acid-pink-square.png"}, "start"=>0, "length"=>6}]}, {"clips"=>[{"asset"=>{"type"=>"image", "src"=>"https://shotstack-assets.s3-ap-southeast-2.amazonaws.com/images/earth.jpg"}, "start"=>0, "length"=>6, "effect"=>"slideLeft"}]}]}, "output"=>{"format"=>"mp4", "size"=>{"width"=>720, "height"=>720}}}

HEADERS