Picture with text component
Demo:
basic/200 component schema
This is a simplified schema of a basic/200
component element:
{
"type": "component",
"component": "basic/200",
"settings": {
"headline": {},
"body": {},
"image": {},
"lower-third": {},
"logo": {}
}
}
Check the full specification of the Component schema in the API documentation.
Settings property for basic/200
This component accepts the following object items in the settings
property:
headline object
Check all available object properties here.
Object property
Default value
text
"Lorem ipsum dolor sit amet"
font-size
"3vh"
font-family
"Inter"
font-weight
"700"
body object
Check all available object properties here.
Object property
Default value
text
"Lorem ipsum dolor sit amet, <em>consectetur adipiscing elit</em>, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum."
font-size
"2vh"
font-family
"Inter"
font-weight
"700"
image object
Check all available object properties here.
Object property
Default value
src
"https://assets.json2video.com/assets/images/london-01.jpg"
center
Warning: htmlentities() expects parameter 1 to be string, array given in /var/www/json2video.com/html/docs/resources/detail.php on line 138
lower-third object
Check all available object properties here.
Object property
Default value
background
"#0000FF"
logo object
Check all available object properties here.
Object property
Default value
src
"https://json2video.com/images/json2video-logo.png"
Usage examples
Check the following examples of basic/200
:
Example 1
{
"width": 360,
"height": 640,
"quality": "high",
"draft": false,
"scenes": [
{
"elements": [
{
"type": "component",
"component": "basic/200",
"settings": {
"headline": {
"text": "Welcome to London!"
},
"body": {
"text": "Discover the best of London with Visit London, the official guide to England\u2019s exciting capital. If you\u2019re not able to visit just yet, plan ahead to make the most of your next visit."
}
},
"duration": 10
}
]
}
]
}