I won’t always know how many clips to add to my video. Sometimes I’ve got 4 images but other times it may be 10. Is there any way to combine these without needing a separate template for each?
By adding the number of images you want to use to an array you can write a loop that appends a clip to your track for every image you want to show.
Javascript example
const axios = require('axios');
const API_URL = 'https://api.shotstack.io/v1/render/';
const API_KEY = 'your_api_key';
const images = [
'https://shotstack-assets.s3.amazonaws.com/images/slideshow1.jpeg',
'https://shotstack-assets.s3.amazonaws.com/images/slideshow2.jpeg',
'https://shotstack-assets.s3.amazonaws.com/images/slideshow3.jpeg',
'https://shotstack-assets.s3.amazonaws.com/images/slideshow4.jpeg',
'https://shotstack-assets.s3.amazonaws.com/images/slideshow5.jpeg',
'https://shotstack-assets.s3.amazonaws.com/images/slideshow6.jpeg',
'https://shotstack-assets.s3.amazonaws.com/images/slideshow7.jpeg',
];
const template = {
"timeline": {
"tracks": [{
"clips": []
}]
},
"output": {
"format": "mp4",
"resolution": "hd"
}
}
let start = 0;
for (let i = 0; i < images.length; i++) {
const clip = {
"asset": {
"type": "image",
"src": images[i]
},
"start": start,
"length": start + 5,
"transition": {
"in": "fade",
"out": "fade"
}
}
template.timeline.tracks[0].clips.push(clip)
start += 5;
}
const headers = {
'Content-Type': 'application/json',
'x-api-key': API_KEY,
}
axios.post(API_URL,template,{ headers })
.then(response => console.log(response.data));