How can I fix text and button issues in the video section on Dawn Theme?

Hi

i created new section using this code:


{% if section.settings.link_text == '' and section.settings.link and section.settings.button_image == nil %}

{% endif %}

{% if section.settings.button_image %}

{% else %}
{% unless section.settings.title == '' %}# {{ section.settings.title | escape }}{% endunless %}
{% unless section.settings.description == '' %}

{{ section.settings.description }}

{% endunless %}
{% unless section.settings.link_text == '' %}{{ section.settings.link_text | escape }}{% endunless %}
{% endif %}

{% if section.settings.link_text == '' and section.settings.link and section.settings.button_image == nil %}

{% endif %}
{% if section.settings.height == 'use_screen_full' %}

{% include 'svg-down' %}

{% endif %}

 

{% schema %}
{
"name": "Video MP4",
"settings": [
{
"type": "text",
"id": "videofile",
"label": "Video URL",
"default": "https://cdn.shopify.com/s/files/1/2018/8867/files/ice.mp4"
},
{
"type": "header",
"content": "Text"
},
{
"type": "text",
"id": "title",
"label": "Headline",
"default": "Video with text overlay"
},
{
"type": "textarea",
"id": "description",
"label": "Description",
"default": "This area is used to describe your store."
},
{
"type": "select",
"id": "text_align",
"label": "Alignment",
"default": "text-center",
"options": [
{ "value": "text-left", "label": "Align Left"},
{ "value": "text-center", "label": "Align Center"},
{ "value": "text-right", "label": "Align Right"}
]
},
{
"type": "range",
"id": "overlay_opacity",
"min": 0,
"max": 100,
"step": 5,
"label": "Image overlay opacity",
"info": "Increase contrast for legible text.",
"default": 15
},
{
"type": "select",
"id": "color",
"label": "Text color",
"default": "homepage--white",
"options": [
{ "value": "homepage--white", "label": "White"},
{ "value": "homepage--light", "label": "Light"},
{ "value": "homepage--splash", "label": "Accent"},
{ "value": "homepage--dark", "label": "Dark"}
]
},
{
"type": "header",
"content": "Button"
},
{
"type": "text",
"id": "link_text",
"label": "Text",
"default": "View products"
},
{
"type": "url",
"id": "link",
"label": "Link"
},
{
"type": "select",
"id": "button_style",
"label": "Button style",
"default": "btn btn--large btn--clear btn--square uppercase",
"options": [
{ "value": "btn btn--large btn--splash uppercase", "label": "Round"},
{ "value": "btn btn--large btn--splash btn--square uppercase", "label": "Square"},
{ "value": "btn btn--large btn--clear uppercase", "label": "Transparent round"},
{ "value": "btn btn--large btn--clear btn--square uppercase", "label": "Transparent square"},
{ "value": "btn btn--large btn--outline btn--square uppercase", "label": "Outlined square"}
]
},
{
"type": "header",
"content": "Overlay image (optional)"
},
{
"type": "image_picker",
"id": "button_image",
"label": "Replaces all text",
"info": "1000 x 1000px .png max"
}
],
"presets": [
{
"name": "Video with text overlay",
"category": "Video"
}
]
}
{% endschema %}

{% stylesheet %}
{% endstylesheet %}

but the text in under the video and not inside him

and the button is not looking like a buy button

i want to change from this

to this:

  • how can i change the video height only on mobile?

im using Dawn Theme version 6.0.2

url: dogstimeshop.myshopify.com

i wish someone could help me with this issue

Thanks!

@Dogstime ,

Add the button & text . after that let me know.

what do you mean?

@Dogstime ,

In screenshot there is a text & button too.

But I did not find in the store, So I am asking to add the text and button in theme customize area…

here is it.

still on the site