Shopify Question posted in
The Shopify help center can be found here.

Section not showing Youtube URL – Shopify

I am very new to Liquid and I am trying to create an option where the user is able to enter a YouTube link and the video is not appearing when entering the link. Currently, I have another video embedded in the schema tag so that the video can appear.

Here is my current code:

<div>
    <div style="padding-top:56.17021276595745%" id="w-node-cdda72edcacb-27a794fe" class="w-embed-youtubevideo">
        <iframe src="https://www.youtube.com/embed/J-sUpDMKWbc?rel=0&amp;controls=1&amp;autoplay=0&amp;mute=0&amp;start=0" frameborder="0" style="position:absolute;left:0;top:0;width:100%;height:100%;pointer-events:auto" allow="autoplay; encrypted-media" allowfullscreen="">
        </iframe>
    </div>
</div>
{% schema %}
{
    "name": "Embed Youtube",
    "settings": [
        {
            "id": "video_url",
            "type": "video_url",
            "label": "Video URL",
            "accept": ["youtube", "vimeo"],
            "default": "https://www.youtube.com/watch?v=_9VUPq3SxOc",
            "info": "Insert Youtube URL",
            "placeholder": "text"
        }
    ]   
}
{% endschema %}

Here is my code placement of the section:

<div >
    {% section 'EmbedYoutube' %}
</div>
Tags:

2

Answers


  1. 0

    I think you got the answer for it after make some search into documentation, for future reference you can add the data dynamic like this below code.

     <div style="padding-top:56.17021276595745%" id="w-node-cdda72edcacb-27a794fe" class="w-embed-youtubevideo">
<iframe src="https://www.youtube.com/embed/{{section.settings.video_url.id}}?rel=0&amp;controls=1&amp;autoplay=0&amp;mute=0&amp;start=0" frameborder="0" style="position:absolute;left:0;top:0;width:100%;height:100%;pointer-events:auto" allow="autoplay; encrypted-media" allowfullscreen="">
          </iframe>
</div>
</div>
{% schema %}
  {
    "name": "Embed Youtube",
    "settings": [
    {
  "id": "video_url",
  "type": "video_url",
  "label": "Video URL",
  "accept": ["youtube", "vimeo"],
  "default": "https://www.youtube.com/watch?v=_9VUPq3SxOc",
  "info": "Insert Youtube URL",
  "placeholder": "text"
}
    ]
    
  }
{% endschema %}

    You can check more regarding the video_url here on Shopify documentation HERE

    Login or Signup to reply.
  2. 0

    Add this code into your section liquid file and you have to enter only after embed code (eg:- J-sUpDMKWbc ) in your inputbox in admin panel

    enter image description here

    <div>
   <iframe width="420" height="345" src="https://www.youtube.com/embed/{{section.settings.video_url}}">
</iframe>
</div>
{% schema %}
{
    "name": "Embed Youtube",
    "settings": [
        {
            "id": "video_url",
             "type": "text",
            "label": "Video URL",
            "info": "Insert Youtube Embed URL eg:- ZY6RfVY-Zl0"
        }
    ]   
}
{% endschema %}
    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search