How To Add Sticky Add To Cart Bar on Product Page - Dawn Theme Shopify

Поділитися
Вставка
  • Опубліковано 14 жов 2024

КОМЕНТАРІ • 64

  • @alexandruvoina7240
    @alexandruvoina7240 Рік тому +1

    amazing tutorial! I love what you do!
    I have one question though.. i want after i press the add to cart button to redirect me to the drawer-check-out, not the checkout-page itself.
    How i can change this code to do that?

    • @WebSensePro
      @WebSensePro  Рік тому

      You can find code in Shopify community, pretty basic

  • @johannorena4013
    @johannorena4013 Рік тому +1

    Hello there, I want to say thanks as this is a very cool video and taught us a lot. Now I tried it and it worked, except that I find it that it is a very slow to respond like when you click add to cart button it takes some seconds to add the product and looks as if it froze then it finally adds it. Do you know how to fix it?
    Also when I checked the mobile version, the "add to cart" button is cut out of the screen and it is not visible and cannot be seen even when you scroll to the side. Do you know how to fix it?
    Lastly, how do you change the wording "add to cart " for "Buy Now" and to change the color of the button?

    • @WebSensePro
      @WebSensePro  Рік тому

      Can't provide all the custom code in youtube video comments, please contact via websensepro.com/contact-us

  • @tedfred1904
    @tedfred1904 Рік тому +1

    Cool video but it was not possible to have the same quantity selector with plus and minus to make it easier for the customer?

  • @jaebee00
    @jaebee00 Рік тому +1

    Thank you so much for this!! You've gained a new subscriber :)

  • @yuvalcohen8934
    @yuvalcohen8934 Рік тому +1

    Great tutorial. I put it on my ride theme and it works fine. The only issue is on mobile the add to cart button is cut and it says add to c. how do I fix that?

    • @WebSensePro
      @WebSensePro  Рік тому

      Thanks for the info, a small tweak with CSS would work

    • @yuvalcohen8934
      @yuvalcohen8934 Рік тому

      @@WebSensePro it seems like it is fine now. but on pc the bar is transparent only on the right part (it shows the text of my product when i scroll on it) know how to fix it?

  • @faraheadz
    @faraheadz Рік тому +1

    thanks for the tutorial. i love your videos keep it up!

    • @WebSensePro
      @WebSensePro  Рік тому

      Thanks, dont forget to turn on the notifications

  • @justspendit
    @justspendit Рік тому +1

    It is still not working on iPhone and on desktop, my images overrun the sticky bar. It doesnt shows well. Images are over banner. How can I fix it? Thanks

    • @WebSensePro
      @WebSensePro  Рік тому +1

      iPhone is a little complex, will try to fix

  • @Ayoub8701
    @Ayoub8701 Рік тому +1

    Thank you bro. How can we have it only in mobile and not desktop pls?

    • @WebSensePro
      @WebSensePro  Рік тому

      You can do this via CSS Media Query

    • @Ayoub8701
      @Ayoub8701 Рік тому

      @@WebSensePro I am not having the skills for that as you :)

  • @Hashir.Rafique
    @Hashir.Rafique Рік тому +2

    Hello brother, this is not working for shopify dawn theme 10.0

    • @WebSensePro
      @WebSensePro  Рік тому +1

      Updated version coming next week

  • @sujeej3201
    @sujeej3201 Рік тому +1

    Hey, Can this code be used on Sense theme too?

  • @puresolmedia2769
    @puresolmedia2769 Рік тому +1

    Hello, the position of the "add to cart" button in the sticky is misaligned. It is far right at the edge. I would like to move it more to the right. Only when I do so it also realigns the product variant dropdown. Which causes the product variant dropdown to be misalign above the add to cart button on the sticky bar. How can I adjust the position for the "add to cart" button on the sticky bar?

    • @puresolmedia2769
      @puresolmedia2769 Рік тому +1

      Also, how do we adjust the product image on the sticky bar to match the color variant of the product variant selected?

    • @WebSensePro
      @WebSensePro  Рік тому

      Thanks for commenting, little hard to help you with code solutions on youtube comments. If you want our premium services to customize please contact websensepro@gmail.com

  • @cyberspider78910
    @cyberspider78910 Рік тому +1

    Can we display slide-out drawer type card when clicked on add to cart?

  • @gurunathprasad2997
    @gurunathprasad2997 Рік тому +1

    This tutorial was great I just wanted to know one more thing: how to clip the title in this code because on mobile it is taking a lot of space while scrolling down.

    • @WebSensePro
      @WebSensePro  Рік тому

      Quick fix with CSS, checkout our CSS tutorials

  • @thejalba
    @thejalba Рік тому +1

    Hello - is there a fix for the mobile version yet? Works great on desktop just not mobile.

    • @WebSensePro
      @WebSensePro  Рік тому

      Can you share some detail about the issue it should work find as per latest Dawn theme

  • @FariaKhaliq-w3x
    @FariaKhaliq-w3x 3 місяці тому

    position fixed property is not working in my case it does not remain sticky it shows just on the end of page

    • @WebSensePro
      @WebSensePro  3 місяці тому

      Please contact via websensepro.com/contact-us for paid support

  • @brianbessire3770
    @brianbessire3770 Рік тому +1

    I can see the sticky cart when I go to edit it via the online store tab in shopify but then when I go to proview my store I cannot access it or use it.

    • @WebSensePro
      @WebSensePro  Рік тому

      Please reimplement the code from scratch there is a mistake in CSS code. Please like and subscribe if this video helped you

  • @manisha_9124
    @manisha_9124 Рік тому +1

    yes but in my theme... the checkbox option is not showing. :(

    • @WebSensePro
      @WebSensePro  Рік тому

      Which version you are applying this on?

  • @alaliajewelry8944
    @alaliajewelry8944 Рік тому +1

    product-thumbnail
    I do not have this section in Theme Down version 7.0.1

    • @WebSensePro
      @WebSensePro  Рік тому

      It's not a section it's snippet. Checkout the screenshot here i.imgur.com/K4pQpwM.jpg

  • @some_time_some_whare
    @some_time_some_whare Рік тому +1

    bro sorry i don't know i post here link that's why u delete my comment .....but my question is still how i set stikey ATC button in header under the product page .............please reply me

  • @mkaderchannel
    @mkaderchannel Рік тому +1

    Good instructions, but step 6 needs to be to add a separate button for checkout so the user can choose either one.

    • @WebSensePro
      @WebSensePro  Рік тому +1

      Good idea, Thanks for appreciation, if this video/channel you helped in any way please support by Subscribing and Hit the Like button.

  • @rv00008
    @rv00008 Рік тому +1

    I also don't see this one mobile? Can you help me to fix?

    • @rv00008
      @rv00008 Рік тому

      I can see the CSS element in the browser on laptop however cannot inspect on mobile. Can you maybe investigate and solve this?

    • @WebSensePro
      @WebSensePro  Рік тому

      Do you see errors in console?

    • @rv00008
      @rv00008 Рік тому

      @@WebSensePro Yes I see.... Each dictionary in the list "icons" should contain a non-empty UTF8 string field "type".

    • @WebSensePro
      @WebSensePro  Рік тому

      @@rv00008 thats not relevant, will have to check your store about the issue

    • @rv00008
      @rv00008 Рік тому

      @@WebSensePro ok how can I reach out to you?

  • @dorianseo
    @dorianseo Рік тому +2

    Never saw a so complicated customization just for a single snippet 🤣

    • @WebSensePro
      @WebSensePro  Рік тому

      There is a first time for everything 🥳🥳

  • @rikhazendonk84
    @rikhazendonk84 Рік тому +1

    it's not working on the mobile version brother..

    • @WebSensePro
      @WebSensePro  Рік тому

      Can you inspect element and see if its showing up CSS you added?

  • @hrithiktaneja3201
    @hrithiktaneja3201 Рік тому +1

    mobile version is not good

    • @WebSensePro
      @WebSensePro  Рік тому

      Could be issue with apps you installed

  • @Shopop_pk
    @Shopop_pk Рік тому

    How To Add POP Add To Cart Bar on Product Page.