How to add Product Media to Themes

แชร์
ฝัง
  • เผยแพร่เมื่อ 28 ก.ค. 2024
  • In this video, Liam will show you how to implement the recently launched product media feature for themes. He'll walk you through how to:
    0:00 Upload media via the admin
    2:58 Find existing image for loop
    5:15 Use the product.media object
    8:46 Create conditions to load images
    10:07 Add videos to the product page
    14:14 Add 3D models
    Follow along with this tutorial on adding product media to Shopify themes in this blog post: bit.ly/2FSXOZP
    See the full code example in the GitHub gist: bit.ly/3mHjk4K
    Download sample 3D image files from our help docs: bit.ly/3iTIElB
    Learn more about JavaScript and style considerations in our developer documentation: bit.ly/3hSFugL
    --------------------------------
    Subscribe to our channel for more videos about developing and designing ecommerce stores, apps, and themes with Shopify » / shopifydevs
    For more information about developing on Shopify check out developers.shopify.com/
  • วิทยาศาสตร์และเทคโนโลยี

ความคิดเห็น • 16

  • @CodingWithJan
    @CodingWithJan 3 ปีที่แล้ว +11

    The content on this channel is phenomenal lately :-)

  • @CleanCanvas
    @CleanCanvas 3 ปีที่แล้ว +2

    Another great video Liam. Thanks for sharing the knowledge.

  • @johndjameson
    @johndjameson 2 ปีที่แล้ว

    Just what I needed. Thanks!

  • @velvetwhite496
    @velvetwhite496 3 ปีที่แล้ว

    Any videos on how to place the header menu on blockshop theme into a drop down on the left?

  • @katvibeschaiwali
    @katvibeschaiwali 3 ปีที่แล้ว

    Hi Liam, this is great. it worked partially. so, it is showing the video but it is also showing the thumbnails of all the photos i have for the product along with the actual size of the photos. and due to thumbnails the format is all off... not sure how to fix it. as well i now dont have the option of getting the variant photo display on first photo as that is where this video is showing now. Not sure if you could and want to help me with this? my theme is boundless and i have split images on top of product page (as i am using tall settings). what i want is that video to show on the right hand side of the spilt images (2nd image) as first one shows the product variant and i would like to keep that.

  • @fahadalvi4137
    @fahadalvi4137 3 ปีที่แล้ว +1

    hi Liam, i like your tutorial, i am stuck in an issue , i am unable to find that code part which have to replace , can you help me ?

  • @markwitmer5498
    @markwitmer5498 2 ปีที่แล้ว

    My current theme already has this accounted for in its product template and yet I'm unable to upload an mp4 through the product page admin to be displayed in the gallery....

  • @where9810
    @where9810 3 ปีที่แล้ว

    I should check this video after launching my cosmetic products for creative web page. Default web gave me by shopify is too bored. I should check this out right away soon

  • @damakeupjunkie7515
    @damakeupjunkie7515 3 ปีที่แล้ว

    Hello Liam, I tried this and it didn’t work on my store. How do you edit the code for the theme ‘Minimal’ please? Because this just doesn’t work for me.

  • @user-oj4mv3oe2o
    @user-oj4mv3oe2o 3 ปีที่แล้ว

    you are great

  • @salihozy7387
    @salihozy7387 3 ปีที่แล้ว

    Hi guys I’m using the debutify 2.0.2 version and I’m having trouble uploading my glb file, someone please help me I don’t know how to code

  • @Dan21789
    @Dan21789 3 ปีที่แล้ว

    Great, video! Thanks!
    Off topic question, how did you get your .liquid files to have the shopify icon?
    Is it a specific icon set in vscode?

    • @liamgriffin6897
      @liamgriffin6897 3 ปีที่แล้ว

      Hey Dan! I believe this is a feature of the Liquid VS Code extension: marketplace.visualstudio.com/items?itemName=sissel.shopify-liquid

  • @miguelmachado6862
    @miguelmachado6862 3 ปีที่แล้ว

    No more videos? Can you do videos more technical, using some Shopify theme scripts like sections, product, a11y, etc

  • @JakubJacobSobotka
    @JakubJacobSobotka 3 ปีที่แล้ว

    Doesn't work. I get Liquid error (sections/product-template.liquid line 41): Could not find asset snippets/media.liquid Liquid error (sections/product-template.liquid line 41): Could not find asset snippets/media.liquid Liquid error (sections/product-template.liquid line 41): Could not find asset snippets/media.liquid

    • @liamgriffin6897
      @liamgriffin6897 3 ปีที่แล้ว

      Hi Jakub, if you're adding the code for the different media types directly into the product-template.liquid file (like in this video), you shouldn't need to render a snippet file. To solve your issue you can either create a snippet file called media.liquid which contains the markup for product media or keep the code on the product template section, and remove the tag that's trying to include the media.liquid snippet. If you haven't checked it out yet, this blog post provides a bit more context: www.shopify.ie/partners/blog/product-media
      Hope this helps!