Scot Ranney • July 10, 2024
Create a custom field for a YouTube video url. This works for long and short video URLs that have v=
or s=
in them (use share links for shorts.) Sometimes the vid short links without s=
will work as well.
Create a custom product field (in this case the code is youtube as you can see in the code below) that you put a YouTube video URL in.
Tip: Put a link to the product as the first comment after adding the video.
<mvt:comment>
#
YOUTUBE VIDEOS: We do some smt voodoo to control the embed via a URL posted in a product custom field
https://www.youtube.com/watch?v=7idtVo8vgDk
https://www.youtube.com/shorts/hnRUwY2azgc
https://youtube.com/shorts/hnRUwY2azgc?si=RwCP4aRiiEaIRHTJ
#
</mvt:comment>
<mvt:if expr="l.settings:product:customfield_values:customfields:youtube">
<mvt:if expr="'v=' CIN l.settings:product:customfield_values:customfields:youtube">
<mvt:assign name="l.settings:vid" value="gettoken(l.settings:product:customfield_values:customfields:youtube,'=',2)" />
<mvt:assign name="l.settings:vid" value="l.settings:vid $ '&rel=0'" />
<mvt:else>
<mvt:assign name="l.settings:vid" value="gettoken(l.settings:product:customfield_values:customfields:youtube,'?',1)" />
<mvt:assign name="l.settings:vid" value="glosub(l.settings:vid,'https://youtube.com/shorts/','')" />
<mvt:assign name="l.settings:vid" value="glosub(l.settings:vid,'https://www.youtube.com/shorts/','')" />
<mvt:assign name="l.settings:vid" value="l.settings:vid $ '?rel=0'" />
</mvt:if>
<iframe style="width: 100%; aspect-ratio: 16/9;"
src="https://www.youtube.com/embed/&mvt:vid;"
title="Treasures of the Southwest &mvte:product:name; video"
frameborder="0"
allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share"
referrerpolicy="strict-origin-when-cross-origin"
allowfullscreen></iframe>
</mvt:if>