Prestige Theme - "Image with Text" to "Video with Text"

Topic summary

A Shopify store owner using the Prestige theme wants to adapt their existing “Image with Text” section to support Shopify-hosted videos instead of images. They’ve already created a new section but need help modifying the code to display videos uploaded directly to Shopify (not YouTube or Vimeo).

Current situation:

  • Successfully using the “Image with Text” section
  • Created a duplicate section for video functionality
  • Currently using an alternative workaround they want to replace

Technical details shared:

  • Posted the existing Liquid/CSS code from their “Image with Text” section
  • Code includes image positioning, responsive sizing, and mobile image support
  • Schema settings show options for image position (left/right), content width (small/medium/large), and reveal animations

The user is seeking guidance on which parts of the code need modification to swap image rendering for Shopify-hosted video playback while maintaining the same layout and text positioning functionality.

Summarized with AI on November 19. AI used: claude-sonnet-4-5-20250929.

Hello everyone,
as you can see from the title, we use the Prestige Theme.
We are very satisfied with the “Image with Text” section and would like to have a “Video with Text” section in the same format. So we created a new section, how do we have to adapt the following code so that we can display videos from Shopify? (No Youtube or Vimeo, the Video ist uploaded in Shopify)

We are currently using an alternative solution, which we would like to change.

Thank you in advance!

{%- if section.settings.image != blank or section.blocks.size > 0 -%}
{%- comment -%}

CSS

{%- endcomment -%}

#shopify-section-{{ section.id }} { --image-with-text-content-max-width: {% if section.settings.content_width == 'sm' %}430px{% elsif section.settings.content_width == 'md' %}780px{% else %}100%{% endif %}; }

{%- comment -%}

LIQUID

{%- endcomment -%}
{%- if section.settings.image != blank -%}

{%- if section.settings.image != blank -%} {%- assign sizes = '(max-width: 699px) 100vw, 50vw' -%}

{%- if section.settings.mobile_image != blank -%}

{%- endif -%}

{{- section.settings.image | image_url: width: section.settings.image.width | image_tag: loading: ‘lazy’, sizes: sizes, widths: ‘200,300,400,500,600,700,800,900,1000,1200,1400,1600,1800,2000,2200,2400,2600,2800,3000,3200’, reveal-on-scroll: section.settings.reveal_on_scroll -}}

{%- else -%}
{{- ‘lifestyle-1’ | placeholder_svg_tag: ‘placeholder’ -}}
{%- endif -%}

{%- for block in section.blocks -%} {%- case block.type -%} {%- when 'subheading' -%} {%- if block.settings.text != blank -%}

{{ block.settings.text }}

{%- endif -%}

{%- when ‘heading’ -%}
{%- if block.settings.text != blank -%}

{{ block.settings.text }}

{%- endif -%}

{%- when ‘richtext’ -%}
{%- if block.settings.content != blank -%}

{{- block.settings.content -}}
{%- endif -%}

{%- when ‘page’ -%}
{%- if block.settings.page.content != blank -%}

{{- block.settings.page.content -}}
{%- endif -%}

{%- when ‘liquid’ -%}
{%- if block.settings.liquid != blank -%}

{{- block.settings.liquid -}}
{%- endif -%}

{%- when ‘link’ -%}
<a {% if block.settings.url %}href=“{{ block.settings.url }}”{% endif %} class=“link” {{ block.shopify_attributes }}>{{ block.settings.text | escape }}

{%- when ‘button’ -%}
{%- if block.settings.text != blank -%}
{% render ‘button’, content: block.settings.text, href: block.settings.url, style: block.settings.style, background: block.settings.background, text_color: block.settings.text_color, block: block %}
{%- endif -%}
{%- endcase -%}
{%- endfor -%}

{%- endif -%} {%- endif -%}

{% schema %}
{
“name”: “t:sections.image_with_text.name”,
“class”: “shopify-section–image-with-text”,
“tag”: “section”,
“max_blocks”: 6,
“disabled_on”: {
“groups”: [“header”, “custom.overlay”]
},
“settings”: [
{
“type”: “checkbox”,
“id”: “separate_section_with_border”,
“label”: “t:global.section.separate_section_with_border”,
“default”: true
},
{
“type”: “image_picker”,
“id”: “image”,
“label”: “t:global.image.image”,
“info”: “t:sections.image_with_text.image_size_recommendation”
},
{
“type”: “image_picker”,
“id”: “mobile_image”,
“label”: “t:global.image.mobile_image”,
“info”: “t:sections.image_with_text.mobile_image_size_recommendation”
},
{
“type”: “checkbox”,
“id”: “reveal_on_scroll”,
“label”: “t:global.animation.reveal_image_on_scroll”,
“default”: true
},
{
“type”: “select”,
“id”: “image_position”,
“label”: “t:sections.image_with_text.image_position”,
“options”: [
{
“value”: “start”,
“label”: “t:global.position.left”
},
{
“value”: “end”,
“label”: “t:global.position.right”
}
]
},
{
“type”: “select”,
“id”: “content_width”,
“label”: “t:global.sizes.content_width”,
“options”: [
{
“value”: “sm”,
“label”: “t:global.sizes.small”
},
{
“value”: “md”,
“label”: “t:global.sizes.medium”
},
{
“value”: “lg”,
“label”: “t:global.sizes.large”
}
],
“default”: “sm”
},
{
“type”: “checkbox”,
“id”: “remove_vertical_spacing”,
“label”: “t:global.spacing.remove_vertical_spacing”,
“default”: true
}
],
“blocks”: [
{
“type”: “subheading”,
“name”: “t:sections.image_with_text.blocks.subheading.name”,
“settings”: [
{
“type”: “inline_richtext”,
“id”: “text”,
“label”: “t:global.text.text”,
“default”: “Subheading”
}
]
},
{
“type”: “heading”,
“name”: “t:sections.image_with_text.blocks.heading.name”,
“settings”: [
{
“type”: “inline_richtext”,
“id”: “text”,
“label”: “t:global.text.text”,
“default”: “Heading”
},
{
“type”: “select”,
“id”: “heading_tag”,
“label”: “t:global.text.style”,
“options”: [
{
“value”: “h1”,
“label”: “H1”
},
{
“value”: “h2”,
“label”: “H2”
},
{
“value”: “h3”,
“label”: “H3”
},
{
“value”: “h4”,
“label”: “H4”
},
{
“value”: “h5”,
“label”: “H5”
},
{
“value”: “h6”,
“label”: “H6”
}
],
“default”: “h1”
}
]
},
{
“type”: “richtext”,
“name”: “t:sections.image_with_text.blocks.paragraph.name”,
“settings”: [
{
“type”: “richtext”,
“id”: “content”,
“label”: “t:global.text.content”,
“default”: “

Use this text to share information about your brand with your customers. Describe a product, share announcements, or welcome customers to your store.


}
]
},
{
“type”: “page”,
“name”: “t:sections.image_with_text.blocks.page.name”,
“settings”: [
{
“type”: “page”,
“id”: “page”,
“label”: “Page”
}
]
},
{
“type”: “liquid”,
“name”: “t:sections.image_with_text.blocks.liquid.name”,
“settings”: [
{
“type”: “liquid”,
“id”: “liquid”,
“label”: “t:global.code.liquid”,
“default”: “

Write custom Liquid code to include widget or dynamic code.


}
]
},
{
“type”: “link”,
“name”: “t:sections.image_with_text.blocks.link.name”,
“settings”: [
{
“type”: “text”,
“id”: “text”,
“label”: “t:global.text.text”,
“default”: “Text”
},
{
“type”: “url”,
“id”: “url”,
“label”: “t:global.text.link”
}
]
},
{
“type”: “button”,
“name”: “t:sections.image_with_text.blocks.button.name”,
“settings”: [
{
“type”: “select”,
“id”: “style”,
“label”: “t:global.text.style”,
“options”: [
{
“value”: “outline”,
“label”: “t:global.text.button_style_options.outline”
},
{
“value”: “solid”,
“label”: “t:global.text.button_style_options.solid”
}
],
“default”: “solid”
},
{
“type”: “text”,
“id”: “text”,
“label”: “t:global.text.text”,
“default”: “Button text”
},
{
“type”: “url”,
“id”: “url”,
“label”: “t:global.text.link”
},
{
“type”: “color”,
“id”: “background”,
“label”: “t:global.colors.background”
},
{
“type”: “color”,
“id”: “text_color”,
“label”: “t:global.text.text”
}
]
}
],
“presets”: [
{
“name”: “t:sections.image_with_text.presets.image_with_text.name”,
“blocks”: [
{
“type”: “subheading”,
“settings”: {
“text”: “Subheading”
}
},
{
“type”: “heading”,
“settings”: {
“text”: “Image with text”
}
},
{
“type”: “richtext”
}
]
}
]
}
{% endschema %}