Autoplay Video on Homepage

Store Design
, , ,
1

Hello!

I would like a video on my homepage to autoplay when a customer lands on my website instead of having the play button to be clicked.

Can someone please help to provide me with the code that can do this and instructions on how I can add this code to my website please?

My theme is DAWN.

Many thanks,

Mira

2

@MAPDESIGNS create new section and add this code


{% schema %}
{
  "name": "Video Section",
  "settings": [
    {
      "type": "color",
      "id": "background_color",
      "label": "Background Color"
    },
    {
      "type": "range",
      "id": "padding_top",
      "label": "Padding Top",
      "min": 0,
      "max": 100,
      "default": 20,
      "unit": "px"
    },
    {
      "type": "range",
      "id": "padding_bottom",
      "label": "Padding Bottom",
      "min": 0,
      "max": 100,
      "default": 20,
      "unit": "px"
    },
    {
      "type": "text",
      "id": "heading_text",
      "label": "Heading Text"
    },
    {
      "type": "color",
      "id": "heading_text_color",
      "label": "Heading Text Color"
    },
    {
      "type": "select",
      "id": "heading_font_weight",
      "label": "Heading Font Weight",
      "options": [
        { "value": "normal", "label": "Normal" },
        { "value": "bold", "label": "Bold" },
        { "value": "bolder", "label": "Bolder" },
        { "value": "lighter", "label": "Lighter" }
      ],
      "default": "normal"
    },
    {
      "type": "select",
      "id": "text_alignment",
      "label": "Text Alignment",
      "options": [
        { "value": "left", "label": "Left" },
        { "value": "center", "label": "Center" },
        { "value": "right", "label": "Right" }
      ],
      "default": "center"
    },
    {
      "type": "url",
      "id": "video_link",
      "label": "Video File Link"
    }
  ],
  "presets": [
    {
      "name": "Video Section",
      "category": "Custom Section"
    }
  ]
}
{% endschema %}
3

Hello Mrashid!

Thanks a lot for your help.

I completed the following steps but received a message that the code did not work.

Add Section > Custom Liquid > Liquid Code > Pasted your code in the text box.

Error message received: Liquid Syntax Error (Line 19): Unknown tag ‘schema’

Did I do everything correctly?

Thanks,

MAP

MAPDESIGNS_0-1731500202178.png
MAPDESIGNS_0-1731500202178.png535×988 43.7 KB

4

@MAPDESIGNS create section. open theme editor code

5

@MAPDESIGNS

If you’re not familiar with any specific parts of the changes, just let me know! I’ll guide you through the process or handle those aspects for you.

6

Yes please that will be great!

How can I get in touch?

7

message on whats app @MAPDESIGNS