How to Customize Woocommerce Cart Page: 21 Cart page Hacks

Поделиться
HTML-код
  • Опубликовано: 24 авг 2024

Комментарии • 132

  • @volkerschuster8079
    @volkerschuster8079 2 года назад +2

    Thank you for your incredible videos, I have no idea, why this channel has not got more subscribers. Very useful practical no nonsense Videos. FANTASTIC

  • @mohammad-omar-07
    @mohammad-omar-07 5 месяцев назад

    Hey, Your a genius. I'm watching your from Bangladesh.

  • @kellyrichardson249
    @kellyrichardson249 Год назад

    Thank you I wanted to add the woo-commerce "continue shopping button" and found it here in your tips! I appreciate it sooo much!

  • @muzammelhaq4027
    @muzammelhaq4027 2 года назад

    Amazing Video, We want more video Like this

  • @enesmulabdic5120
    @enesmulabdic5120 Год назад

    Thanks a million. 👍

  • @GiovannaAguilar
    @GiovannaAguilar 2 года назад +1

    This is a wonderful tutorial with real code! LOVE it and it's helping me with some edits I need to do to a site. thank you.

  • @jeromecourcoux6687
    @jeromecourcoux6687 2 года назад +1

    Great work, and very useful hacks, thanks.
    Quick question : when I try "Deactivate shipping information", the shipping methods disappear but one line remains with "Expedition" and a link to "calculate shipping fees". Do you have any suggestion on how to remove all the line? Many thanks

    • @wpsimplehacks
      @wpsimplehacks  2 года назад +1

      Probably your theme messes something up

  • @lukedharrison326
    @lukedharrison326 3 года назад

    Thank you so much for taking the time to share these!

  • @MisterX-77
    @MisterX-77 2 года назад

    Very nice thanx for sharing knowledge.

  • @GalaxyMe83
    @GalaxyMe83 8 месяцев назад

    Great. Thanks a lot. I want to remove TAX from the cart only so it will not show, however, I want to keep it on the checkout page, how can I do that?

    • @wpsimplehacks
      @wpsimplehacks  8 месяцев назад

      Probably with the help of some CSS

  • @jennyonyinye1955
    @jennyonyinye1955 2 года назад

    You videos have truly been helpful. Could you help with a hack that displays a message “no products on sale” on the sale products page when there are no products on sale? Thanks

    • @wpsimplehacks
      @wpsimplehacks  2 года назад

      See whether this helps you out wordpress.org/support/topic/show-message-when-no-products-are-on-sale/
      If not then unfortunately can't help with that.

  • @robertmuresan3542
    @robertmuresan3542 2 года назад

    You deserve way more subscribers. Great work!

  • @ahmedsusterac6729
    @ahmedsusterac6729 Месяц назад

    Thank you, your content is helpful, can you help me to change text of "Shipping" and "Flat rate" i want to rename it thats for Cart Totals field

    • @wpsimplehacks
      @wpsimplehacks  Месяц назад

      Maybe this helps you out www.businessbloomer.com/translate-single-string-woocommerce-wordpress/

  • @annietrinh1452
    @annietrinh1452 3 года назад

    Thank you for your work 👍

  • @frederickterblanch1631
    @frederickterblanch1631 2 года назад

    You the best , thank you so much for your videos this helped me to help with all the different things my cleint want when building website for them . Can you tell me only sell coupons with now pricing in woocommerce products only $0.00 per product. What I want is not to see the quantity and price and tables in order details and the wocommerce email the client receive after placing the order.

    • @wpsimplehacks
      @wpsimplehacks  2 года назад

      Thanks 🙂
      Coukd you exolain a bit more? At the moment I am confused what is it you're trying to do.

  • @farhamusthafa2319
    @farhamusthafa2319 2 года назад

    Great video
    How can I add extra cash on delivery charges when the customer choose the cash on delivery option as shipping method

    • @wpsimplehacks
      @wpsimplehacks  2 года назад +1

      See whether this snippet helps you out (you need to modify it a bit) stackoverflow.com/questions/66156541/add-fee-based-on-payment-methods-and-cart-items-total-in-woocommerce
      Or see whether this plugin solves your problem wordpress.org/plugins/checkout-fees-for-woocommerce/

    • @farhamusthafa2319
      @farhamusthafa2319 2 года назад

      @@wpsimplehacks thank you so much

  • @SohailVayani
    @SohailVayani 3 года назад +1

    Great work, appreciated.
    quick question the way you showed SKU number what about if I want to show colour attribute aswell? I have tried the same method as you did to get the SKU number but it didn't work, any help would be highly appreciated. Many Thanks

    • @wpsimplehacks
      @wpsimplehacks  3 года назад

      See whether this helps you out wpsimplehacks.com/how-to-customize-woocommerce-cart-page/#how-to-display-product-attributes-in-woocommerce-cart-page

  • @stellafagbuyi5071
    @stellafagbuyi5071 Год назад

    Hello, on the cart page
    The tabs, Products, Quantity, Sub total, I sell services so I want to change the Products to Services.
    Because I added the services as virtual products in Woocommerce and won't make sense on the cart page for clients to see Products tab instead of Services.
    So how do I change the Products tab to Services, so it will display Services they have added to cart under it.
    Thank you.

    • @wpsimplehacks
      @wpsimplehacks  Год назад +1

      Do you want to change the product cart table heading and display Services instead Product? If so, then try this snippet (and change text accordingly:
      add_filter('gettext', 'translate_strings');
      add_filter('ngettext', 'translate_strings');
      function translate_strings($translated) {
      $translated = str_ireplace('Product', 'Services', $translated);
      return $translated;
      }

  • @DiaconuMarius
    @DiaconuMarius 2 года назад

    Hello and thank you for your work. I am looking for a solutions to display a specific text in cart if the cart contain a specific product. It is possible? Thank you!

    • @wpsimplehacks
      @wpsimplehacks  2 года назад

      See this one here wpsimplehacks.com/how-to-customize-woocommerce-cart-page/#how-to-display-a-custom-message-in-woocommerce-cart-page-for-specific-products

    • @DiaconuMarius
      @DiaconuMarius 2 года назад

      @@wpsimplehacks Thanks for the quick response!

  • @m.santos1520
    @m.santos1520 6 месяцев назад

    The How to add “Continue Shopping” snippet returns my cart page to the shop page. How can I fix that?

    • @wpsimplehacks
      @wpsimplehacks  6 месяцев назад

      Most likely the page id on row 4 is not correct

  • @dsuinfotech
    @dsuinfotech Год назад

    Bro thanks for video.. I want snippet for Minimum weight in cart.. user can't checkout if cart weight is less than 1KG.. please help me ...thanks

    • @wpsimplehacks
      @wpsimplehacks  Год назад

      Did you try this? 😉
      letmegooglethat.com/?q=woocommerce+minimum+order+weight

  • @SystemPromowania
    @SystemPromowania 3 года назад

    I love yours WooCommerce Videos, cant wait for next hacking woocommerce lessons

  • @60_9
    @60_9 Месяц назад

    Is there a snippet for country-> states -> city dropdown
    I tried every possible way

  • @rc33844
    @rc33844 2 года назад

    When I try "Update Cart on quantity change" the text disappears but the refresh cart symbol remains. any suggestions on how to remove the refresh symbol as well?

    • @wpsimplehacks
      @wpsimplehacks  2 года назад

      Sorry, can’t help with that. It seems to be working well on my end.

  • @ultimatmbh000
    @ultimatmbh000 2 года назад

    i want to remove the coupon field entirely above the 'place order' button pls help

    • @wpsimplehacks
      @wpsimplehacks  2 года назад

      You can deactivate coupons entirely from the Woocommerce sertings

  • @nutbolt9595
    @nutbolt9595 3 года назад

    Hack# 15 Simmlier that I want to show related products here like whenever the user selects any product from the shop page, we have to show related product under the cart view page. is there any code for that...?

    • @wpsimplehacks
      @wpsimplehacks  3 года назад

      Use cross-sells docs.woocommerce.com/document/related-products-up-sells-and-cross-sells/

  • @kellyrichardson249
    @kellyrichardson249 Год назад

    i Another question, is there a woo commerce hack to change the word "Product" site wide to maybe images or photos? (for a stock photo site)

    • @wpsimplehacks
      @wpsimplehacks  Год назад +1

      Add this to the Code snippets or your child theme’s functions.php file (and change the text accordingly)
      add_filter('gettext', 'translate_strings');
      add_filter('ngettext', 'translate_strings');
      function translate_strings($translated) {
      $translated = str_ireplace('Product', 'YOUR TEXT HERE', $translated);
      return $translated;
      }

    • @kellyrichardson249
      @kellyrichardson249 Год назад

      It worked! Thank you soooo much!@@wpsimplehacks

  • @tanyongsheng4561
    @tanyongsheng4561 3 года назад

    Hi, sir. Great tutorial. May I ask is there any code to show simple popup (that display messages on successful add to cart for few seconds and disappear) whenever hit the "add to cart".
    Is this possible?

    • @wpsimplehacks
      @wpsimplehacks  3 года назад +2

      Not that I know of since this can not be solved with the help of a simple snippet. See, whether this plugin helps you out wordpress.org/plugins/added-to-cart-popup-woocommerce/

  • @mohamedkhalid763
    @mohamedkhalid763 3 года назад

    شكرا علي الفيديو الرائع :) و how to customize multi vendor ecommerce dashboard to be easy and simple

    • @wpsimplehacks
      @wpsimplehacks  3 года назад

      I am not familiar with the multi vendor plugins

  • @niralsura
    @niralsura 3 года назад

    Great Video. Very Useful. Can you add one more for Min & Max Product Qty with a Proper alert or error message? Thanks

    • @wpsimplehacks
      @wpsimplehacks  3 года назад +1

      Try this here below. Change $min = 2; and $max = 5; values
      /* Changing the minimum quantity to 2 for all the WooCommerce products */
      function woocommerce_quantity_input_min_callback( $min, $product ) {
      $min = 2;
      return $min;
      }
      add_filter( 'woocommerce_quantity_input_min', 'woocommerce_quantity_input_min_callback', 10, 2 );
      /* Changing the maximum quantity to 5 for all the WooCommerce products */
      function woocommerce_quantity_input_max_callback( $max, $product ) {
      $max = 5;
      return $max;
      }
      add_filter( 'woocommerce_quantity_input_max', 'woocommerce_quantity_input_max_callback', 10, 2 );
      ?>

    • @niralsura
      @niralsura 3 года назад

      @@wpsimplehacks i will try right away and update asap. Thanks a lot.

  • @karlaayala15
    @karlaayala15 2 года назад

    I have implemented all your other videos on my site and they work great but for a reason all this tips and snippets are not working on my cart page, any suggestions as what should I change?

    • @wpsimplehacks
      @wpsimplehacks  2 года назад +1

      Do you use any other plugin for your cart and checkout pages? For example, Elementor etc? Also, maybe your theme overrides the default Woocommerce hooks by adding it’s own customizations over there.

    • @karlaayala15
      @karlaayala15 2 года назад

      @@wpsimplehacks Thanks for your reply I will check on this

  • @carlospino8809
    @carlospino8809 2 года назад

    Dear, I added the code How to Update WooCommerce Cart on Quantity Change?, after that, buttons plus and minus, when I update a product, these buttons disappears, do you know why?? because if someone is buying and add more products and these buttons are not, it´s weird. please your help

    • @wpsimplehacks
      @wpsimplehacks  2 года назад

      Sorry, can’t help with that. It’s probably has some compatibility issues with your theme and/or with some plugin.

    • @carlospino8809
      @carlospino8809 2 года назад

      @@wpsimplehacks thanks friend

  • @Atractiondj
    @Atractiondj Год назад

    Not all snippets work with different themes. In some functions, it is necessary to change CSS classes for this to work. For example, the auto-update cart works on 2 out of 5 themes. I found a solution elsewhere where I can write my plus or minus button classes and it works.

    • @wpsimplehacks
      @wpsimplehacks  Год назад

      Could you share your solution here?

    • @Atractiondj
      @Atractiondj Год назад

      @@wpsimplehacks yep
      button[name="update_cart"]{display: none!important;}
      jQuery( function( $ ) {

      $( 'body' ).on( 'change', '.qty', function() {
      setTimeout(function() {
      $( '[name="update_cart"]' ).trigger( 'click' );
      }, 800 );
      } );

      $( 'body' ).on( 'click', '.plus, .minus', function() {
      setTimeout(function() {
      $( '[name="update_cart"]' ).trigger( 'click' );
      }, 800 );
      } );
      } );

    • @AntonioNeto-if7fl
      @AntonioNeto-if7fl Год назад

      how did you solve this one?

  • @danielm4358
    @danielm4358 Год назад

    Free shipping amount threshold notification - How do I get this code to work pre tax? e.g I want the minimum value for free shipping to be 200 excluding tax, but when it calculates the remainder it calculates based on the items value plus tax. Cheers.

  • @AbdulBasit-tc8zl
    @AbdulBasit-tc8zl Год назад

    Make a video on cart count show in a HTML anchor button

  • @shu2322
    @shu2322 3 года назад

    Thank you for amazing hacks and tips but when I moved a coupon field the field stopped working unfortunately.

    • @wpsimplehacks
      @wpsimplehacks  3 года назад

      Probably your theme or sone other plugin overrides default Woocommerce hooks or something

    • @shu2322
      @shu2322 3 года назад

      @@wpsimplehacks I'll be glad if you share any ideas how to fix that.

  • @bestfriendfhn
    @bestfriendfhn Год назад

    Hello,
    When we add a product to cart. It redirect us to single product page. I dont want to redirect to single product page. I want to refresh the current page when product added to cart. How can we do this?

    • @wpsimplehacks
      @wpsimplehacks  Год назад

      What snippet is the one you:re using?

    • @bestfriendfhn
      @bestfriendfhn Год назад

      Couldnt find this hacks from the video. I really liked your every video. Do you have any idea how to refresh the current page when product add to cart. Right now Its redirect us to single product page if product added to cart

    • @bestfriendfhn
      @bestfriendfhn Год назад

      I mean, when we click on "add to cart" button from product listing. It will not redirect to single product page

  • @TamilThagaval
    @TamilThagaval Год назад

    you are amazing

  • @piotrszczesniak685
    @piotrszczesniak685 2 года назад

    Great and very practical videos. I thought that it would be so great if woocommerce messages and notifications appear without need to reload the page. Can you do that and create a video? :)

    • @wpsimplehacks
      @wpsimplehacks  2 года назад +1

      Sorry, I have no plans regarding this video

    • @piotrszczesniak685
      @piotrszczesniak685 2 года назад

      Anyways. You're videos are still great 🚀

  • @JoyHints
    @JoyHints 3 года назад

    Cool hacks. Please add timelines when possible. Thanks

    • @wpsimplehacks
      @wpsimplehacks  3 года назад +1

      What do you mean by "timelines"? Do you mean video Timestamps? They should already be there. If not then here they are:
      TIMESTAMPS
      00:56 Install Code snippets plugin
      01:36 Set minimum order amount
      03:02 Show custom content on empty cart page
      04:13 Free shipping amount threshold notification
      05:08 Add custom message to cart page
      05:42 How to find Woocommerce default hooks locations
      06:59 Show warning if product is available onbackorder
      08:28 Update cart on quantity change
      09:27 Add „Empty cart“ button
      10:14 Move coupon field location
      11:54 Display cart total weight
      13:44 Show estimated delivery date notification
      15:32 Deactivate shipping information
      16:06 Add additional fee / surcharge
      17:47 Output shortcode or custom content below cart
      18:56 Display product SKU on cart page
      19:26 Display shipping class on cart page
      20:01 Display categories on cart page
      20:42 Display stock availability
      21:35 Sort cart products alphabetically
      22:36 Remove product links

    • @JoyHints
      @JoyHints 3 года назад

      Oh yes. I meant timestamps. Just noticed it’s way down the description. 👍

  • @maddy1mymk
    @maddy1mymk Год назад

    Wow! All this hacks are amazing. I hate having to add plugging to my site, I like to avoid issues as much as I can. You just gain a new subscriber. Excellent work and clear as cristal. Would all this work with the hello theme and elementor? I would like to make sure of that before I implement any changes. Thanks sir

    • @wpsimplehacks
      @wpsimplehacks  Год назад +1

      Thanks for the sub.
      If you're creating custom layouts (single product page, archive page etc) with Elementor then Elementor uses it's own hooos and overrides default Woocommerce hooks, you would need to find out what are the Elementor hooks they use.

    • @maddy1mymk
      @maddy1mymk Год назад

      @@wpsimplehacks Thanks for the reply. I will find out.

  • @wmafendi
    @wmafendi 3 года назад

    Gosh..so many hacks.. i become woo hacker already. thanks

  • @leenek
    @leenek 2 года назад

    Thank you! Great hacks! I'm trying to change all the text in cart and checkout pages to get them all to be in Estonian language. Is there a one convenient way to do that are should code snippets be used for each text?

    • @wpsimplehacks
      @wpsimplehacks  2 года назад +1

      Hei Leene,
      Kui sinu lehe keel on eesti keel, siis Woocommerce enda eestikeelne tõlge peaks ka ostukorvi lehe eestikeelseks tegema. Selleks pane Seaded >> Üldine alt saidi keeleks Eesti. Kui aga kasutad kujundust, mis Woo ostukorvi omaenda poolt üle kirjutab, siis saad Loco translate pluginaga selle kujunduse vajalikud osad eesti keelde tõlkida.

    • @leenek
      @leenek 2 года назад

      @@wpsimplehacks Suur tänu! Piinlikult lihtne :) Sain lihtsalt keele muutusega korda!

    • @wpsimplehacks
      @wpsimplehacks  2 года назад +1

      Tubli! Istu! Viis :)

  • @GigaBuzzStore
    @GigaBuzzStore 3 года назад

    Great snippets and source of knowledge again. Could you advise the Css for the jammed buttons?.. I need a custom css as none of those on your website solves my issue with the send us enquiry button I've added to my product page. Thanks Janek

    • @wpsimplehacks
      @wpsimplehacks  3 года назад +1

      Sen me you site link so I could check. Otherwise it is hard to do :)

    • @GigaBuzzStore
      @GigaBuzzStore 3 года назад +1

      @@wpsimplehacks Absolutely here stylesnbags.com/ take a look at the enquiry form button on the product pages. Thanks for replying

    • @wpsimplehacks
      @wpsimplehacks  3 года назад +1

      What is it you would like to be differently. At the moment I see this nimb.ws/WunbEg

    • @GigaBuzzStore
      @GigaBuzzStore 3 года назад +1

      @@wpsimplehacks I'd like the Send us your trade enquiry button, to be the same size as the Buy with Gpay button above.

    • @wpsimplehacks
      @wpsimplehacks  3 года назад +1

      See, whether this helps you out
      button#trigger_cf {
      width: 100%;
      }

  • @JoyHints
    @JoyHints 3 года назад

    You the man 😎

  • @achannelfornoreason6550
    @achannelfornoreason6550 2 года назад

    Great video man. Really appriciate it, I will be helpful if you help me how can I do the following:
    in the cart page:
    o First row: Subtotal: total price without discount---- main price
    o Second row: shipping-- shipping charge
    o Third row: Korting (discount)- saved
    o Fourth row: Total: total price with discount and with shipping--total cost.
    Is it possible? Thank you again.

    • @wpsimplehacks
      @wpsimplehacks  2 года назад

      Unfortunately this would require some heavy customization and therefore I cant’t help you with it. Sorry.

    • @achannelfornoreason6550
      @achannelfornoreason6550 2 года назад

      @@wpsimplehacks Thank you for your response.

  • @silentphil77
    @silentphil77 3 года назад

    Great video and ive implimented a few of these already on some sites so thank you for that!. Just one thing I have noticed is the "update cart" button appears in mobile view , what can we add to the snippet for this? I cant seem to hide it any way at all in mobile haha... thanks again

    • @wpsimplehacks
      @wpsimplehacks  3 года назад

      I just tested "Update cart on qty change" and there is no button on my site. Which hack is it you’re taking about where the "update cart" is visible on mobile?

    • @wpsimplehacks
      @wpsimplehacks  3 года назад

      OK, I figured out that you’re probably talking about the "move coupon field hack".
      Replace part on the snippet with this part and let me know whether it worked.
      /* Hide Update cart button */
      div.coupon:not(.under-proceed) {
      display: none !important;
      }
      @media only screen and (max-width: 1024px) {
      .woocommerce-cart-form__contents .actions .button {
      display: none;
      }
      }

    • @silentphil77
      @silentphil77 3 года назад

      @@wpsimplehacks yeah thats the code mate "Update cart on qty change" , tbh ive used this snippet with elementor and jetwoobuilder , for whatever reason its fine except mobile , sorry mate id say its me not you! , thank you very much for your response , your work is amazing

    • @wpsimplehacks
      @wpsimplehacks  3 года назад

      Try to add this to the additional CSS and see whether it works.
      @media only screen and (max-width: 1024px) {
      .woocommerce-cart-form__contents .actions .button {
      display: none;
      }
      }

    • @silentphil77
      @silentphil77 3 года назад

      @@wpsimplehacks awesome mate thank you , i was talking about the update qty hack , i just used the code you supplied but put it to the qty hack and it worked.

  • @muted.2185
    @muted.2185 2 года назад

    your website is not loading. showing a critical error.

    • @wpsimplehacks
      @wpsimplehacks  2 года назад +1

      I just tried and everything seems to be working well. Please try after couple of minutes

    • @muted.2185
      @muted.2185 2 года назад

      Its working. Thank you

  • @lihuaizhi
    @lihuaizhi 3 года назад

    我第一个.

  • @wpsimplehacks
    @wpsimplehacks  3 года назад +1

    Which hack did you like the most? Let me know in the comments.
    RELATED VIDEOS:
    17+ Useful Woocommerce Category Page Hacks for Every Shop ruclips.net/video/Q14xDtH-AcE/видео.html
    14 Useful Woocommerce Single Product Page Hacks ruclips.net/video/Ni8VezPG-cg/видео.html
    12 Useful Woocommerce Tricks & Hacks to Use on Your Store ruclips.net/video/k8tWLU8cNkI/видео.html

  • @thenewyorkean
    @thenewyorkean 2 года назад

    found your content on youtube and it's amazing!
    let me know if you'll ever need a hand on sth, marketing/content wise. I'd love to help you back.
    tried to contact you on twittter but no DMs :)

    • @wpsimplehacks
      @wpsimplehacks  2 года назад

      You can emal me at info@wpsimplehacks.com