{"schemaVersion":"2.0.0","defaultLanguage":"en","languages":["en"],"launchScreenId":"article_screen_help-block-media","screens":{"article_screen_help-block-media":{"id":"article_screen_help-block-media","name":"Media — all settings","tags":["article"],"screenType":"FlexibleLayout","position":{"x":0,"y":0},"content":{"canvas":{"background":{"kind":"solid","content":{"color":"#F7F8FA"}},"insets":{"top":0,"end":0,"bottom":0,"start":0},"webViewBackgroundColor":"#F7F8FA"},"animated":false,"offlineFirst":true,"flexibleLayout":{"scrollable":true,"insets":{"top":44,"end":28,"bottom":56,"start":28},"sections":[{"id":"intro","order":0,"kind":"Text","label":"Intro","layout":{"heightKind":"auto"},"textContent":{"title":{"translations":{"en":"Media — every setting"},"kind":"static","appearance":{"align":"start","fontSize":28,"fontWeight":800,"lineHeight":34,"color":"#101828"}},"subtitle":{"translations":{"en":"The screen's image or video block — its source, size, placement, rounding, and an optional fade overlay. This guide documents every setting of the Media block, grouped by area. Each setting matches a real control in the screen editor."},"kind":"static","appearance":{"align":"start","fontSize":17,"fontWeight":400,"lineHeight":26,"color":"#475467"}}}},{"id":"section-context","order":1,"kind":"Media","label":"Media in the editor","layout":{"heightKind":"fixed","heightValue":360,"padding":{"top":8,"end":0,"bottom":8,"start":0},"cornerRadius":{"uniform":12}},"mediaContent":{"kind":"Image","content":{"image":{"translations":{"en":{"original":"https://api.segmently.ai/assets/support-flow/local/configure-media-section/0.2.0/configure-media-section-2026-06-22T19-19-56-389Z-81b8a06e/context-section.png","name":"The screen editor with the Media section highlighted."}},"appearance":{}}},"appearance":{"scaleMode":"scaleAspectFit","cornerRadii":{"uniform":12}}}},{"id":"section-context-cap","order":2,"kind":"Text","label":"Context caption","layout":{"heightKind":"auto"},"textContent":{"subtitle":{"translations":{"en":"Open the Media section in the screen editor to configure its settings."},"kind":"static","appearance":{"align":"start","fontSize":13,"fontWeight":500,"lineHeight":19,"color":"#667085"}}}},{"id":"article-first-applies-to","order":3,"kind":"Text","label":"Applies to","layout":{"heightKind":"auto"},"textContent":{"title":{"translations":{"en":"Applies to: List Multi Pick, List Single Pick, Grid Multi Pick, Grid Single Pick, and Wheel Picker screens."},"kind":"static","appearance":{"align":"start","fontSize":17,"fontWeight":650,"lineHeight":25,"color":"#344054"}}}},{"id":"g-source-head","order":4,"kind":"Text","label":"Group: Image or video source","layout":{"heightKind":"auto","margin":{"top":40}},"textContent":{"title":{"translations":{"en":"Image or video source"},"kind":"static","appearance":{"align":"start","fontSize":19,"fontWeight":750,"lineHeight":26,"color":"#101828"}}}},{"id":"g-source-el","order":5,"kind":"Media","label":"Image or video source in the section","layout":{"heightKind":"fixed","heightValue":278,"padding":{"top":8,"end":0,"bottom":8,"start":0},"cornerRadius":{"uniform":12}},"mediaContent":{"kind":"Image","content":{"image":{"translations":{"en":{"original":"https://api.segmently.ai/assets/support-flow/local/configure-media-section/0.2.0/configure-media-section-2026-06-22T19-19-56-389Z-81b8a06e/open-section-source.png","name":"Where the Image or video source sits inside the open Media section."}},"appearance":{}}},"appearance":{"scaleMode":"scaleAspectFit","cornerRadii":{"uniform":12}}}},{"id":"g-source-el-cap","order":6,"kind":"Text","label":"Element caption","layout":{"heightKind":"auto"},"textContent":{"subtitle":{"translations":{"en":"Inside the Media section, this is the Image or video source."},"kind":"static","appearance":{"align":"start","fontSize":13,"fontWeight":500,"lineHeight":19,"color":"#667085"}}}},{"id":"set-media-content-featuredmedia","order":7,"kind":"Text","label":"Image or video source · Show an image or video","layout":{"heightKind":"auto","margin":{"top":28}},"textContent":{"title":{"translations":{"en":"Show an image or video"},"kind":"static","appearance":{"align":"start","fontSize":17,"fontWeight":650,"lineHeight":24,"color":"#172033"}},"subtitle":{"translations":{"en":"Turns the image or video block on or off for this screen; off means no visual is shown. Turn it on to add a supporting visual, since on a paid landing page a relevant image or video builds trust and lifts conversion. When enabled, it starts with sensible styling from your design theme that you can fine-tune in the fields below."},"kind":"static","appearance":{"align":"start","fontSize":15,"fontWeight":400,"lineHeight":23,"color":"#475467"}}}},{"id":"set-media-content-featuredmedia-img","order":8,"kind":"Media","label":"Show an image or video","layout":{"heightKind":"fixed","heightValue":136,"padding":{"top":8,"end":0,"bottom":8,"start":0},"cornerRadius":{"uniform":12}},"mediaContent":{"kind":"Image","content":{"image":{"translations":{"en":{"original":"https://api.segmently.ai/assets/support-flow/local/configure-media-section/0.2.0/configure-media-section-2026-06-22T19-19-56-389Z-81b8a06e/open-section-enable.png","name":"Where to find “Show an image or video” in the editor."}},"appearance":{}}},"appearance":{"scaleMode":"scaleAspectFit","cornerRadii":{"uniform":12}}}},{"id":"set-media-content-featuredmedia-kind","order":9,"kind":"Text","label":"Image or video source · Image or video","layout":{"heightKind":"auto","margin":{"top":28}},"textContent":{"title":{"translations":{"en":"Image or video"},"kind":"static","appearance":{"align":"start","fontSize":17,"fontWeight":650,"lineHeight":24,"color":"#172033"}},"subtitle":{"translations":{"en":"Pick whether this screen shows an image or a video. Use an image for a fast, lightweight visual that loads instantly; use a video for short product demos or motion that holds attention (it can loop). Switching type clears the current media, so choose before you upload. Keep videos short and light so the page stays fast, since slow loads cost conversions on paid traffic."},"kind":"static","appearance":{"align":"start","fontSize":15,"fontWeight":400,"lineHeight":23,"color":"#475467"}}}},{"id":"set-media-content-featuredmedia-kind-img","order":10,"kind":"Media","label":"Image or video","layout":{"heightKind":"fixed","heightValue":120,"padding":{"top":8,"end":0,"bottom":8,"start":0},"cornerRadius":{"uniform":12}},"mediaContent":{"kind":"Image","content":{"image":{"translations":{"en":{"original":"https://api.segmently.ai/assets/support-flow/local/configure-media-section/0.2.0/configure-media-section-2026-06-22T19-19-56-389Z-81b8a06e/open-section-kind.png","name":"Where to find “Image or video” in the editor."}},"appearance":{}}},"appearance":{"scaleMode":"scaleAspectFit","cornerRadii":{"uniform":12}}}},{"id":"set-media-content-featuredmedia-content-image","order":11,"kind":"Text","label":"Image or video source · The image for this screen","layout":{"heightKind":"auto","margin":{"top":28}},"textContent":{"title":{"translations":{"en":"The image for this screen"},"kind":"static","appearance":{"align":"start","fontSize":17,"fontWeight":650,"lineHeight":24,"color":"#172033"}},"subtitle":{"translations":{"en":"Add this screen's image by uploading a file from your computer or pasting a direct image URL, then confirm it in the preview. Use a high-quality JPG or PNG that's on-message for the screen — uploads are optimized automatically for fast loading on every device. To replace it later, upload or paste a new source here."},"kind":"static","appearance":{"align":"start","fontSize":15,"fontWeight":400,"lineHeight":23,"color":"#475467"}}}},{"id":"set-media-content-featuredmedia-content-image-img","order":12,"kind":"Media","label":"The image for this screen","layout":{"heightKind":"fixed","heightValue":148,"padding":{"top":8,"end":0,"bottom":8,"start":0},"cornerRadius":{"uniform":12}},"mediaContent":{"kind":"Image","content":{"image":{"translations":{"en":{"original":"https://api.segmently.ai/assets/support-flow/local/configure-media-section/0.2.0/configure-media-section-2026-06-22T19-19-56-389Z-81b8a06e/open-section-image.png","name":"Where to find “The image for this screen” in the editor."}},"appearance":{}}},"appearance":{"scaleMode":"scaleAspectFit","cornerRadii":{"uniform":12}}}},{"id":"set-media-content-featuredmedia-content-video","order":13,"kind":"Text","label":"Image or video source · The video for this screen","layout":{"heightKind":"auto","margin":{"top":28}},"textContent":{"title":{"translations":{"en":"The video for this screen"},"kind":"static","appearance":{"align":"start","fontSize":17,"fontWeight":650,"lineHeight":24,"color":"#172033"}},"subtitle":{"translations":{"en":"Add a video by uploading a file or pasting a direct video URL. Keep it short (a few seconds, ideally under ~30s) and lightweight so the page loads fast — long or heavy videos hurt conversion on paid traffic. Uploads are converted automatically to play reliably across devices, and you can pair this with the loop option below to replay it continuously."},"kind":"static","appearance":{"align":"start","fontSize":15,"fontWeight":400,"lineHeight":23,"color":"#475467"}}}},{"id":"set-media-content-featuredmedia-content-video-img","order":14,"kind":"Media","label":"The video for this screen","layout":{"heightKind":"fixed","heightValue":148,"padding":{"top":8,"end":0,"bottom":8,"start":0},"cornerRadius":{"uniform":12}},"mediaContent":{"kind":"Image","content":{"image":{"translations":{"en":{"original":"https://api.segmently.ai/assets/support-flow/local/configure-media-section/0.2.0/configure-media-section-2026-06-22T19-19-56-389Z-81b8a06e/video-video.png","name":"Where to find “The video for this screen” in the editor."}},"appearance":{}}},"appearance":{"scaleMode":"scaleAspectFit","cornerRadii":{"uniform":12}}}},{"id":"set-media-content-featuredmedia-appearance-repeat","order":15,"kind":"Text","label":"Image or video source · Replay the video on a loop","layout":{"heightKind":"auto","margin":{"top":28}},"textContent":{"title":{"translations":{"en":"Replay the video on a loop"},"kind":"static","appearance":{"align":"start","fontSize":17,"fontWeight":650,"lineHeight":24,"color":"#172033"}},"subtitle":{"translations":{"en":"When on, the video replays continuously; when off, it plays once and stops on the last frame. Only applies to video media. Turn looping on for short ambient background clips that hold attention; turn it off for a demo or explainer you want watched once, so it doesn't loop distractingly while the visitor reads."},"kind":"static","appearance":{"align":"start","fontSize":15,"fontWeight":400,"lineHeight":23,"color":"#475467"}}}},{"id":"set-media-content-featuredmedia-appearance-repeat-img","order":16,"kind":"Media","label":"Replay the video on a loop","layout":{"heightKind":"fixed","heightValue":105,"padding":{"top":8,"end":0,"bottom":8,"start":0},"cornerRadius":{"uniform":12}},"mediaContent":{"kind":"Image","content":{"image":{"translations":{"en":{"original":"https://api.segmently.ai/assets/support-flow/local/configure-media-section/0.2.0/configure-media-section-2026-06-22T19-19-56-389Z-81b8a06e/video-repeat.png","name":"Where to find “Replay the video on a loop” in the editor."}},"appearance":{}}},"appearance":{"scaleMode":"scaleAspectFit","cornerRadii":{"uniform":12}}}},{"id":"g-gradient-head","order":17,"kind":"Text","label":"Group: Fade overlay","layout":{"heightKind":"auto","margin":{"top":40}},"textContent":{"title":{"translations":{"en":"Fade overlay"},"kind":"static","appearance":{"align":"start","fontSize":19,"fontWeight":750,"lineHeight":26,"color":"#101828"}}}},{"id":"set-media-content-featuredmedia-appearance-gradient","order":18,"kind":"Text","label":"Fade overlay · Fade over the media","layout":{"heightKind":"auto","margin":{"top":28}},"textContent":{"title":{"translations":{"en":"Fade over the media"},"kind":"static","appearance":{"align":"start","fontSize":17,"fontWeight":650,"lineHeight":24,"color":"#172033"}},"subtitle":{"translations":{"en":"Lays a soft, see-through fade (usually dark) over the media so any text or button on top stays readable against a busy image. Turn it on whenever you place a title, subtitle, or button over the media; without it, light areas of the image can wash out your copy. When enabled, you get controls below to set the fade's height and color."},"kind":"static","appearance":{"align":"start","fontSize":15,"fontWeight":400,"lineHeight":23,"color":"#475467"}}}},{"id":"set-media-content-featuredmedia-appearance-gradient-img","order":19,"kind":"Media","label":"Fade over the media","layout":{"heightKind":"fixed","heightValue":136,"padding":{"top":8,"end":0,"bottom":8,"start":0},"cornerRadius":{"uniform":12}},"mediaContent":{"kind":"Image","content":{"image":{"translations":{"en":{"original":"https://api.segmently.ai/assets/support-flow/local/configure-media-section/0.2.0/configure-media-section-2026-06-22T19-19-56-389Z-81b8a06e/appearance-gradient-enable.png","name":"Where to find “Fade over the media” in the editor."}},"appearance":{}}},"appearance":{"scaleMode":"scaleAspectFit","cornerRadii":{"uniform":12}}}},{"id":"set-media-content-featuredmedia-appearance-gradient-heightpercentage","order":20,"kind":"Text","label":"Fade overlay · How far the fade extends","layout":{"heightKind":"auto","margin":{"top":28}},"textContent":{"title":{"translations":{"en":"How far the fade extends"},"kind":"static","appearance":{"align":"start","fontSize":17,"fontWeight":650,"lineHeight":24,"color":"#172033"}},"subtitle":{"translations":{"en":"Controls how far the fade reaches across the media (0 to 100%). Match it to where your text or button sits: if the copy is near the bottom, a 30 to 50% fade from that edge usually gives enough contrast without darkening the whole image. Increase it if text is still hard to read, decrease it to show more of the image clearly."},"kind":"static","appearance":{"align":"start","fontSize":15,"fontWeight":400,"lineHeight":23,"color":"#475467"}}}},{"id":"set-media-content-featuredmedia-appearance-gradient-heightpercentage-img","order":21,"kind":"Media","label":"How far the fade extends","layout":{"heightKind":"fixed","heightValue":148,"padding":{"top":8,"end":0,"bottom":8,"start":0},"cornerRadius":{"uniform":12}},"mediaContent":{"kind":"Image","content":{"image":{"translations":{"en":{"original":"https://api.segmently.ai/assets/support-flow/local/configure-media-section/0.2.0/configure-media-section-2026-06-22T19-19-56-389Z-81b8a06e/gradient-height.png","name":"Where to find “How far the fade extends” in the editor."}},"appearance":{}}},"appearance":{"scaleMode":"scaleAspectFit","cornerRadii":{"uniform":12}}}},{"id":"set-media-content-featuredmedia-appearance-gradient-colors-0","order":22,"kind":"Text","label":"Fade overlay · Color of the fade","layout":{"heightKind":"auto","margin":{"top":28}},"textContent":{"title":{"translations":{"en":"Color of the fade"},"kind":"static","appearance":{"align":"start","fontSize":17,"fontWeight":650,"lineHeight":24,"color":"#172033"}},"subtitle":{"translations":{"en":"Picks the color of the fade over the media. Use a dark color (usually black) behind light or white text, or a light color behind dark text; the fade goes from this color to fully transparent so the image still shows through. Match it to your background or brand color for a seamless look, and choose whichever direction gives your copy the strongest contrast."},"kind":"static","appearance":{"align":"start","fontSize":15,"fontWeight":400,"lineHeight":23,"color":"#475467"}}}},{"id":"set-media-content-featuredmedia-appearance-gradient-colors-0-img","order":23,"kind":"Media","label":"Color of the fade","layout":{"heightKind":"fixed","heightValue":108,"padding":{"top":8,"end":0,"bottom":8,"start":0},"cornerRadius":{"uniform":12}},"mediaContent":{"kind":"Image","content":{"image":{"translations":{"en":{"original":"https://api.segmently.ai/assets/support-flow/local/configure-media-section/0.2.0/configure-media-section-2026-06-22T19-19-56-389Z-81b8a06e/gradient-color.png","name":"Where to find “Color of the fade” in the editor."}},"appearance":{}}},"appearance":{"scaleMode":"scaleAspectFit","cornerRadii":{"uniform":12}}}},{"id":"g-appearance-head","order":24,"kind":"Text","label":"Group: Size, placement & rounding","layout":{"heightKind":"auto","margin":{"top":40}},"textContent":{"title":{"translations":{"en":"Size, placement & rounding"},"kind":"static","appearance":{"align":"start","fontSize":19,"fontWeight":750,"lineHeight":26,"color":"#101828"}}}},{"id":"g-appearance-el","order":25,"kind":"Media","label":"Size, placement & rounding in the section","layout":{"heightKind":"fixed","heightValue":278,"padding":{"top":8,"end":0,"bottom":8,"start":0},"cornerRadius":{"uniform":12}},"mediaContent":{"kind":"Image","content":{"image":{"translations":{"en":{"original":"https://api.segmently.ai/assets/support-flow/local/configure-media-section/0.2.0/configure-media-section-2026-06-22T19-19-56-389Z-81b8a06e/open-section-appearance.png","name":"Where the Size, placement & rounding sits inside the open Media section."}},"appearance":{}}},"appearance":{"scaleMode":"scaleAspectFit","cornerRadii":{"uniform":12}}}},{"id":"g-appearance-el-cap","order":26,"kind":"Text","label":"Element caption","layout":{"heightKind":"auto"},"textContent":{"subtitle":{"translations":{"en":"Inside the Media section, this is the Size, placement & rounding."},"kind":"static","appearance":{"align":"start","fontSize":13,"fontWeight":500,"lineHeight":19,"color":"#667085"}}}},{"id":"set-media-content-featuredmedia-appearance-topalignment","order":27,"kind":"Text","label":"Size, placement & rounding · Where the media starts on top","layout":{"heightKind":"auto","margin":{"top":28}},"textContent":{"title":{"translations":{"en":"Where the media starts on top"},"kind":"static","appearance":{"align":"start","fontSize":17,"fontWeight":650,"lineHeight":24,"color":"#172033"}},"subtitle":{"translations":{"en":"Sets where the media begins from the top of the screen. Screen Top runs it edge-to-edge to the very top (great for a full-bleed hero), Navigation Bar starts it just below the header, and Safe Area keeps it clear of phone notches and rounded corners. Pick Screen Top for an immersive banner, Safe Area when nothing should ever be clipped. This is locked if you set a media height percentage below, which positions it for you."},"kind":"static","appearance":{"align":"start","fontSize":15,"fontWeight":400,"lineHeight":23,"color":"#475467"}}}},{"id":"set-media-content-featuredmedia-appearance-topalignment-img","order":28,"kind":"Media","label":"Where the media starts on top","layout":{"heightKind":"fixed","heightValue":105,"padding":{"top":8,"end":0,"bottom":8,"start":0},"cornerRadius":{"uniform":12}},"mediaContent":{"kind":"Image","content":{"image":{"translations":{"en":{"original":"https://api.segmently.ai/assets/support-flow/local/configure-media-section/0.2.0/configure-media-section-2026-06-22T19-19-56-389Z-81b8a06e/appearance-top-alignment.png","name":"Where to find “Where the media starts on top” in the editor."}},"appearance":{}}},"appearance":{"scaleMode":"scaleAspectFit","cornerRadii":{"uniform":12}}}},{"id":"set-media-content-featuredmedia-appearance-scalemode","order":29,"kind":"Text","label":"Size, placement & rounding · How media fills its box","layout":{"heightKind":"auto","margin":{"top":28}},"textContent":{"title":{"translations":{"en":"How media fills its box"},"kind":"static","appearance":{"align":"start","fontSize":17,"fontWeight":650,"lineHeight":24,"color":"#172033"}},"subtitle":{"translations":{"en":"Controls how the media fills its box. Aspect Fit shows the whole thing without cropping (you may see empty bars), Aspect Fill covers the box completely but may crop edges, and Scale to Fill stretches it, which distorts photos, so avoid that. The positional options (Top, Bottom, Center, and so on) crop to fill while keeping that part in view. Aspect Fill is the usual pick for an edge-to-edge banner; use Aspect Fit when nothing should be cropped."},"kind":"static","appearance":{"align":"start","fontSize":15,"fontWeight":400,"lineHeight":23,"color":"#475467"}}}},{"id":"set-media-content-featuredmedia-appearance-scalemode-img","order":30,"kind":"Media","label":"How media fills its box","layout":{"heightKind":"fixed","heightValue":105,"padding":{"top":8,"end":0,"bottom":8,"start":0},"cornerRadius":{"uniform":12}},"mediaContent":{"kind":"Image","content":{"image":{"translations":{"en":{"original":"https://api.segmently.ai/assets/support-flow/local/configure-media-section/0.2.0/configure-media-section-2026-06-22T19-19-56-389Z-81b8a06e/appearance-scale-mode.png","name":"Where to find “How media fills its box” in the editor."}},"appearance":{}}},"appearance":{"scaleMode":"scaleAspectFit","cornerRadii":{"uniform":12}}}},{"id":"set-media-content-featuredmedia-appearance-dimensions-heightpercentage","order":31,"kind":"Text","label":"Size, placement & rounding · How tall the media is","layout":{"heightKind":"auto","margin":{"top":28}},"textContent":{"title":{"translations":{"en":"How tall the media is"},"kind":"static","appearance":{"align":"start","fontSize":17,"fontWeight":650,"lineHeight":24,"color":"#172033"}},"subtitle":{"translations":{"en":"Sets the media height as a share of the screen (0 to 100%), so it scales on every device; the default is 50%. Use a larger percentage for an immersive, image-led screen and a smaller one when you need room for the title, text, or button below; on a choice screen, keep it modest so the options stay visible without scrolling. Setting a value pins the media just below the header for a consistent layout."},"kind":"static","appearance":{"align":"start","fontSize":15,"fontWeight":400,"lineHeight":23,"color":"#475467"}}}},{"id":"set-media-content-featuredmedia-appearance-dimensions-heightpercentage-img","order":32,"kind":"Media","label":"How tall the media is","layout":{"heightKind":"fixed","heightValue":102,"padding":{"top":8,"end":0,"bottom":8,"start":0},"cornerRadius":{"uniform":12}},"mediaContent":{"kind":"Image","content":{"image":{"translations":{"en":{"original":"https://api.segmently.ai/assets/support-flow/local/configure-media-section/0.2.0/configure-media-section-2026-06-22T19-19-56-389Z-81b8a06e/appearance-height.png","name":"Where to find “How tall the media is” in the editor."}},"appearance":{}}},"appearance":{"scaleMode":"scaleAspectFit","cornerRadii":{"uniform":12}}}},{"id":"set-media-content-featuredmedia-appearance-cornerradii-uniform","order":33,"kind":"Text","label":"Size, placement & rounding · How rounded the media is","layout":{"heightKind":"auto","margin":{"top":28}},"textContent":{"title":{"translations":{"en":"How rounded the media is"},"kind":"static","appearance":{"align":"start","fontSize":17,"fontWeight":650,"lineHeight":24,"color":"#172033"}},"subtitle":{"translations":{"en":"Rounds the corners of the media block; 0 is sharp and higher values (up to 50) make them softer. A small radius around 8 to 16 gives a modern, polished look; match it to the rounding on your buttons and cards so the whole screen feels consistent. Leave it at 0 for full-bleed media that touches the screen edges."},"kind":"static","appearance":{"align":"start","fontSize":15,"fontWeight":400,"lineHeight":23,"color":"#475467"}}}},{"id":"set-media-content-featuredmedia-appearance-cornerradii-uniform-img","order":34,"kind":"Media","label":"How rounded the media is","layout":{"heightKind":"fixed","heightValue":102,"padding":{"top":8,"end":0,"bottom":8,"start":0},"cornerRadius":{"uniform":12}},"mediaContent":{"kind":"Image","content":{"image":{"translations":{"en":{"original":"https://api.segmently.ai/assets/support-flow/local/configure-media-section/0.2.0/configure-media-section-2026-06-22T19-19-56-389Z-81b8a06e/appearance-corner-radius.png","name":"Where to find “How rounded the media is” in the editor."}},"appearance":{}}},"appearance":{"scaleMode":"scaleAspectFit","cornerRadii":{"uniform":12}}}},{"id":"set-media-content-featuredmedia-layout-insets","order":35,"kind":"Text","label":"Size, placement & rounding · Space around the media","layout":{"heightKind":"auto","margin":{"top":28}},"textContent":{"title":{"translations":{"en":"Space around the media"},"kind":"static","appearance":{"align":"start","fontSize":17,"fontWeight":650,"lineHeight":24,"color":"#172033"}},"subtitle":{"translations":{"en":"Adds empty space on the four sides of the media (top, right, bottom, left) so it isn't flush against the screen edges or neighboring content. Leave it at the default for a full-width visual. Increase a side to inset the media and give it a framed look with breathing room, rather than edge-to-edge."},"kind":"static","appearance":{"align":"start","fontSize":15,"fontWeight":400,"lineHeight":23,"color":"#475467"}}}},{"id":"set-media-content-featuredmedia-layout-insets-img","order":36,"kind":"Media","label":"Space around the media","layout":{"heightKind":"fixed","heightValue":138,"padding":{"top":8,"end":0,"bottom":8,"start":0},"cornerRadius":{"uniform":12}},"mediaContent":{"kind":"Image","content":{"image":{"translations":{"en":{"original":"https://api.segmently.ai/assets/support-flow/local/configure-media-section/0.2.0/configure-media-section-2026-06-22T19-19-56-389Z-81b8a06e/appearance-padding.png","name":"Where to find “Space around the media” in the editor."}},"appearance":{}}},"appearance":{"scaleMode":"scaleAspectFit","cornerRadii":{"uniform":12}}}}]}}}},"metadata":{"kind":"article","alias":"help-block-media","articlePresentation":{"version":1,"profiles":{"standard":{"containerMaxWidth":640,"contentInsets":{"top":44,"end":28,"bottom":56,"start":28},"sectionPaddingScale":1,"textScale":1},"laptop":{"containerMaxWidth":620,"contentInsets":{"top":40,"end":28,"bottom":52,"start":28},"sectionPaddingScale":0.98,"textScale":0.98},"tablet":{"containerMaxWidth":560,"contentInsets":{"top":36,"end":24,"bottom":44,"start":24},"sectionPaddingScale":0.94,"textScale":0.95},"phone":{"containerMaxWidth":"100%","contentInsets":{"top":28,"end":16,"bottom":36,"start":16},"sectionPaddingScale":0.86,"textScale":0.9,"titleTextScale":0.86}}},"settingsMap":[{"fieldKey":"content.featuredMedia","title":"Show an image or video","sectionType":"media","group":"source","guideKey":"screenedit-media-enable","editorTestId":"media-enable-checkbox","revealState":"open-section","imageUrl":"https://api.segmently.ai/assets/support-flow/local/configure-media-section/0.2.0/configure-media-section-2026-06-22T19-19-56-389Z-81b8a06e/open-section-enable.png","articleSectionId":"set-media-content-featuredmedia","route":[{"to":"screen-editor","humanInstruction":"Open the screen in the editor.","postconditionTestId":"editor-modal-v2-container"},{"to":"section","humanInstruction":"Expand the Media section.","postconditionTestId":"section-media"},{"to":"control","humanInstruction":"Find “Show an image or video”.","postconditionTestId":"media-enable-checkbox"}]},{"fieldKey":"content.featuredMedia.kind","title":"Image or video","sectionType":"media","group":"source","guideKey":"screenedit-media-kind","editorTestId":"media-kind-select","revealState":"open-section","imageUrl":"https://api.segmently.ai/assets/support-flow/local/configure-media-section/0.2.0/configure-media-section-2026-06-22T19-19-56-389Z-81b8a06e/open-section-kind.png","articleSectionId":"set-media-content-featuredmedia-kind","route":[{"to":"screen-editor","humanInstruction":"Open the screen in the editor.","postconditionTestId":"editor-modal-v2-container"},{"to":"section","humanInstruction":"Expand the Media section.","postconditionTestId":"section-media"},{"to":"control","humanInstruction":"Find “Image or video”.","postconditionTestId":"media-kind-select"}]},{"fieldKey":"content.featuredMedia.content.image","title":"The image for this screen","sectionType":"media","group":"source","guideKey":"screenedit-media-image-upload","editorTestId":"field-media-image","revealState":"open-section","imageUrl":"https://api.segmently.ai/assets/support-flow/local/configure-media-section/0.2.0/configure-media-section-2026-06-22T19-19-56-389Z-81b8a06e/open-section-image.png","articleSectionId":"set-media-content-featuredmedia-content-image","route":[{"to":"screen-editor","humanInstruction":"Open the screen in the editor.","postconditionTestId":"editor-modal-v2-container"},{"to":"section","humanInstruction":"Expand the Media section.","postconditionTestId":"section-media"},{"to":"control","humanInstruction":"Find “The image for this screen”.","postconditionTestId":"field-media-image"}]},{"fieldKey":"content.featuredMedia.content.video","title":"The video for this screen","sectionType":"media","group":"source","guideKey":"screenedit-media-video-upload","editorTestId":"field-media-video","revealState":"video","imageUrl":"https://api.segmently.ai/assets/support-flow/local/configure-media-section/0.2.0/configure-media-section-2026-06-22T19-19-56-389Z-81b8a06e/video-video.png","articleSectionId":"set-media-content-featuredmedia-content-video","route":[{"to":"screen-editor","humanInstruction":"Open the screen in the editor.","postconditionTestId":"editor-modal-v2-container"},{"to":"section","humanInstruction":"Expand the Media section.","postconditionTestId":"section-media"},{"to":"panel","humanInstruction":"Set the media type to Video.","postconditionTestId":"field-media-video"},{"to":"control","humanInstruction":"Find “The video for this screen”.","postconditionTestId":"field-media-video"}]},{"fieldKey":"content.featuredMedia.appearance.repeat","title":"Replay the video on a loop","sectionType":"media","group":"source","guideKey":"screenedit-media-video-repeat","editorTestId":"input-style-media-repeat","revealState":"video","imageUrl":"https://api.segmently.ai/assets/support-flow/local/configure-media-section/0.2.0/configure-media-section-2026-06-22T19-19-56-389Z-81b8a06e/video-repeat.png","articleSectionId":"set-media-content-featuredmedia-appearance-repeat","route":[{"to":"screen-editor","humanInstruction":"Open the screen in the editor.","postconditionTestId":"editor-modal-v2-container"},{"to":"section","humanInstruction":"Expand the Media section.","postconditionTestId":"section-media"},{"to":"panel","humanInstruction":"Set the media type to Video.","postconditionTestId":"field-media-video"},{"to":"control","humanInstruction":"Find “Replay the video on a loop”.","postconditionTestId":"input-style-media-repeat"}]},{"fieldKey":"content.featuredMedia.appearance.gradient","title":"Fade over the media","sectionType":"media","group":"gradient","guideKey":"screenedit-media-gradient-enable","editorTestId":"media-gradient-enable","revealState":"appearance","imageUrl":"https://api.segmently.ai/assets/support-flow/local/configure-media-section/0.2.0/configure-media-section-2026-06-22T19-19-56-389Z-81b8a06e/appearance-gradient-enable.png","articleSectionId":"set-media-content-featuredmedia-appearance-gradient","route":[{"to":"screen-editor","humanInstruction":"Open the screen in the editor.","postconditionTestId":"editor-modal-v2-container"},{"to":"section","humanInstruction":"Expand the Media section.","postconditionTestId":"section-media"},{"to":"panel","humanInstruction":"Open the Media appearance settings (the Tune toggle).","postconditionTestId":"input-style-media-scale-mode"},{"to":"control","humanInstruction":"Find “Fade over the media”.","postconditionTestId":"media-gradient-enable"}]},{"fieldKey":"content.featuredMedia.appearance.gradient.heightPercentage","title":"How far the fade extends","sectionType":"media","group":"gradient","guideKey":"screenedit-media-gradient-height","editorTestId":"media-gradient-height-slider","revealState":"gradient","imageUrl":"https://api.segmently.ai/assets/support-flow/local/configure-media-section/0.2.0/configure-media-section-2026-06-22T19-19-56-389Z-81b8a06e/gradient-height.png","articleSectionId":"set-media-content-featuredmedia-appearance-gradient-heightpercentage","route":[{"to":"screen-editor","humanInstruction":"Open the screen in the editor.","postconditionTestId":"editor-modal-v2-container"},{"to":"section","humanInstruction":"Expand the Media section.","postconditionTestId":"section-media"},{"to":"panel","humanInstruction":"In the appearance settings, tick Enable Gradient.","postconditionTestId":"media-gradient-height-slider"},{"to":"control","humanInstruction":"Find “How far the fade extends”.","postconditionTestId":"media-gradient-height-slider"}]},{"fieldKey":"content.featuredMedia.appearance.gradient.colors.0","title":"Color of the fade","sectionType":"media","group":"gradient","guideKey":"screenedit-media-gradient-color","editorTestId":"input-content.featuredMedia.appearance.gradient.colors.0","revealState":"gradient","imageUrl":"https://api.segmently.ai/assets/support-flow/local/configure-media-section/0.2.0/configure-media-section-2026-06-22T19-19-56-389Z-81b8a06e/gradient-color.png","articleSectionId":"set-media-content-featuredmedia-appearance-gradient-colors-0","route":[{"to":"screen-editor","humanInstruction":"Open the screen in the editor.","postconditionTestId":"editor-modal-v2-container"},{"to":"section","humanInstruction":"Expand the Media section.","postconditionTestId":"section-media"},{"to":"panel","humanInstruction":"In the appearance settings, tick Enable Gradient.","postconditionTestId":"media-gradient-height-slider"},{"to":"control","humanInstruction":"Find “Color of the fade”.","postconditionTestId":"input-content.featuredMedia.appearance.gradient.colors.0"}]},{"fieldKey":"content.featuredMedia.appearance.topAlignment","title":"Where the media starts on top","sectionType":"media","group":"appearance","guideKey":"screenedit-media-top-alignment","editorTestId":"input-style-media-media-top","revealState":"appearance","imageUrl":"https://api.segmently.ai/assets/support-flow/local/configure-media-section/0.2.0/configure-media-section-2026-06-22T19-19-56-389Z-81b8a06e/appearance-top-alignment.png","articleSectionId":"set-media-content-featuredmedia-appearance-topalignment","route":[{"to":"screen-editor","humanInstruction":"Open the screen in the editor.","postconditionTestId":"editor-modal-v2-container"},{"to":"section","humanInstruction":"Expand the Media section.","postconditionTestId":"section-media"},{"to":"panel","humanInstruction":"Open the Media appearance settings (the Tune toggle).","postconditionTestId":"input-style-media-scale-mode"},{"to":"control","humanInstruction":"Find “Where the media starts on top”.","postconditionTestId":"input-style-media-media-top"}]},{"fieldKey":"content.featuredMedia.appearance.scaleMode","title":"How media fills its box","sectionType":"media","group":"appearance","guideKey":"screenedit-media-scale-mode","editorTestId":"input-style-media-scale-mode","revealState":"appearance","imageUrl":"https://api.segmently.ai/assets/support-flow/local/configure-media-section/0.2.0/configure-media-section-2026-06-22T19-19-56-389Z-81b8a06e/appearance-scale-mode.png","articleSectionId":"set-media-content-featuredmedia-appearance-scalemode","route":[{"to":"screen-editor","humanInstruction":"Open the screen in the editor.","postconditionTestId":"editor-modal-v2-container"},{"to":"section","humanInstruction":"Expand the Media section.","postconditionTestId":"section-media"},{"to":"panel","humanInstruction":"Open the Media appearance settings (the Tune toggle).","postconditionTestId":"input-style-media-scale-mode"},{"to":"control","humanInstruction":"Find “How media fills its box”.","postconditionTestId":"input-style-media-scale-mode"}]},{"fieldKey":"content.featuredMedia.appearance.dimensions.heightPercentage","title":"How tall the media is","sectionType":"media","group":"appearance","guideKey":"screenedit-media-height-percentage","editorTestId":"input-style-media-height-","revealState":"appearance","imageUrl":"https://api.segmently.ai/assets/support-flow/local/configure-media-section/0.2.0/configure-media-section-2026-06-22T19-19-56-389Z-81b8a06e/appearance-height.png","articleSectionId":"set-media-content-featuredmedia-appearance-dimensions-heightpercentage","route":[{"to":"screen-editor","humanInstruction":"Open the screen in the editor.","postconditionTestId":"editor-modal-v2-container"},{"to":"section","humanInstruction":"Expand the Media section.","postconditionTestId":"section-media"},{"to":"panel","humanInstruction":"Open the Media appearance settings (the Tune toggle).","postconditionTestId":"input-style-media-scale-mode"},{"to":"control","humanInstruction":"Find “How tall the media is”.","postconditionTestId":"input-style-media-height-"}]},{"fieldKey":"content.featuredMedia.appearance.cornerRadii.uniform","title":"How rounded the media is","sectionType":"media","group":"appearance","guideKey":"screenedit-media-corner-radius","editorTestId":"input-style-media-corner-radius","revealState":"appearance","imageUrl":"https://api.segmently.ai/assets/support-flow/local/configure-media-section/0.2.0/configure-media-section-2026-06-22T19-19-56-389Z-81b8a06e/appearance-corner-radius.png","articleSectionId":"set-media-content-featuredmedia-appearance-cornerradii-uniform","route":[{"to":"screen-editor","humanInstruction":"Open the screen in the editor.","postconditionTestId":"editor-modal-v2-container"},{"to":"section","humanInstruction":"Expand the Media section.","postconditionTestId":"section-media"},{"to":"panel","humanInstruction":"Open the Media appearance settings (the Tune toggle).","postconditionTestId":"input-style-media-scale-mode"},{"to":"control","humanInstruction":"Find “How rounded the media is”.","postconditionTestId":"input-style-media-corner-radius"}]},{"fieldKey":"content.featuredMedia.layout.insets","title":"Space around the media","sectionType":"media","group":"appearance","guideKey":"screenedit-media-padding","editorTestId":"media-padding-element","revealState":"appearance","imageUrl":"https://api.segmently.ai/assets/support-flow/local/configure-media-section/0.2.0/configure-media-section-2026-06-22T19-19-56-389Z-81b8a06e/appearance-padding.png","articleSectionId":"set-media-content-featuredmedia-layout-insets","route":[{"to":"screen-editor","humanInstruction":"Open the screen in the editor.","postconditionTestId":"editor-modal-v2-container"},{"to":"section","humanInstruction":"Expand the Media section.","postconditionTestId":"section-media"},{"to":"panel","humanInstruction":"Open the Media appearance settings (the Tune toggle).","postconditionTestId":"input-style-media-scale-mode"},{"to":"control","humanInstruction":"Find “Space around the media”.","postconditionTestId":"media-padding-element"}]}],"projectId":"arswew63RwQr6V4Ekb1Z","articleId":"help-block-media"},"webViewDefaultBackgroundColor":"#F7F8FA","projectAnalytics":{"consentManagement":{"enabled":true,"bannerText":"We use cookies to improve your experience and analyze site usage.","privacyPolicyUrl":"","defaultConsent":"denied"},"integrations":[{"platform":"segmently_internal","name":"Segmently Analytics","enabled":true,"config":{"mode":"http"},"createdAt":"2026-05-26T13:53:00.398Z","updatedAt":"2026-05-26T13:53:00.398Z","id":"int_mpmp3jsm_aij2kz"}]}}