Customizing collection product cards in Shopify

Поділитися
Вставка
  • Опубліковано 4 лют 2025

КОМЕНТАРІ • 5

  • @nickdrishinski
    @nickdrishinski  23 дні тому

    🔥 My Shopify Theme Development Course is LIVE! 🔥
    Ready to master Shopify theme development? Check out my comprehensive course here: nickdrishinski.com/

  • @WebDeveloper-jg3tu
    @WebDeveloper-jg3tu 3 місяці тому

    Thanks for everything!

  • @WebDeveloper-jg3tu
    @WebDeveloper-jg3tu 3 місяці тому

    We are so excited about the next one.....

  • @hugoraposo
    @hugoraposo 2 місяці тому

    Nick, thank you for this amazing video tutorial! It was incredibly exciting and insightful, and I really appreciate you sharing your expertise. I've been struggling to implement an add_shopping_cart function that adds a product to the shopping cart without opening the product page. I tried to use the code above but the icon doesn't seem to recognize mouse clicks properly.
    I also tried the solution you provided in your other add_shopping_cart video, but it seems to have a small bug. After implementing it, I noticed a cart icon floating around the collection at the bottom of the product page, which wasn't supposed to happen. Any chance you have a fix or workaround for this issue? Your guidance has been invaluable so far, and I’d love to hear your thoughts. Thanks again!

    • @nickdrishinski
      @nickdrishinski  2 місяці тому

      Thank you so much for the kind words!
      I have had issues many times with similar issues regarding the positioning and click events of buttons the product cards here. Typically setting a 'z-index: 999' style on the icon will help when the clicks are not being recognized.
      I'm also putting out a video in the next couple of days where I have a button here that opens a quick view modal to add to cart. You may have luck with some of those styles working better too. I have the code already (you would only want to copy the styles and HTML part of the card-product.liquid file): github.com/ndrishinski/blogs/commit/e88123544d2c3eb5effb0d906adb74f0c43e4f1b#diff-f9fa50b02edba7e863550fca1ec8b944f2259506be43ae9730f130da7b066871