How can I add a small video with side text to my online store?

Shopify Discussion
1

Hi,

I want to have at the bottom of shop something similar to this. Small video on the side and text on the other. Anyone know how to have this?

ae33531e13e4cb8272b49b3b9edc75e4.png
ae33531e13e4cb8272b49b3b9edc75e4.png1877×795 126 KB

Thanks

2

Hello @Bahrikaan ,

May I know which theme you are using right now? May be theme provide the section by default Or You can have this by creating a new section and some custom code.

3

Hi Rishi,

Im using the theme Impulse theme. There is an section with a video an a box with text but thats no exactly what i am looking for.

Bahrikaan

4

Okay @Bahrikaan , If you can not use the theme option then you can create your own custom section using custom code. Also, can you explain to me in brief what you are exactly looking for?

5

Hi Rishi,

I found a section where their is image and text block. With element inspecting i found what i need to replace and put their the code of that video (its just an placeholder for now.) But when i go to edit my code i dont know where that code is in exactly to change it.

354ca2ebbd58774170f7eb118b00df8d.png
354ca2ebbd58774170f7eb118b00df8d.png1891×588 126 KB

adbab3e44a5ed992b6279fa3e4c7f248.png
adbab3e44a5ed992b6279fa3e4c7f248.png1894×659 269 KB

This is in my shop page.

Thanks

6

Hello @Bahrikaan ,

Duplicate the advanced-content.liquid section and change the section name.

Replace the below code with the image code:

{% when 'video' %}
  
  {% if block.settings.video != blank %}
    

      {{ block.settings.video | video_tag: controls: true, image_size: "600x300" }}
    

  {% endif %}

Also, Replace the schema for image in the same file:

{
  "type": "video",
  "name": "Video",
  "settings": [
    {
      "type": "video",
      "id": "video",
      "label": "Video"
    },
    {
      "type": "select",
      "id": "width",
      "label": "Width",
      "default": "100%",
      "options": [
        {
          "value": "25%",
          "label": "25%"
        },
        {
          "value": "33%",
          "label": "33%"
        },
        {
          "value": "50%",
          "label": "50%"
        },
        {
          "value": "66%",
          "label": "66%"
        },
        {
          "value": "75%",
          "label": "75%"
        },
        {
          "value": "100%",
          "label": "100%"
        }
      ]
    }
7

Thanks Rishi

8

You are most welcome @Bahrikaan