The best RUclips channel related to wordpress. Janek shows how to do simple but effective things, most of which advise installing additional plugins that significantly burden the website. Thank you for what you do.
Hi, Thank you so much for such informative videos. I have been looking for these updates for my new website. Also, is there a way to contact you via email?
Bro lots of love for you 🥺🥺🥺🥺🥺 you've shared such amazing hacks. It's helping me to improve my skills, saving money on plugins and charging more from clients for such features
Excellent video. Really helped me add a feature on my site! Thanks for sharing! (I like your presentation style as well....very good for intermediate users of woocommerce)
These are golden, and customers wants these tweaks all the time. You can add scroll-padding css property to add some padding to scroll-to-tab function. Also maybe adding date picker and dynamically inserting the date instead of text-field in to the product edit page, might be interesting.
@@wpsimplehacks the scroll to tab could use some top space where it lands. Especially in the case of a sticky header for example. Where the tab name and first few lines would be covered by the sticky header.
@@ionutsabo Replace this line $('html,body').animate({scrollTop:$(tabpanel).offset().top}, 750); with this $('html,body').animate({scrollTop:$(tabpanel).offset().top -150},'slow'); play with -150 value
Thank you for this video. I think you missed adding a code snippet on your website. The code snippet you show at 05:24 (Show estimated delivery time) is not on your website. Can you add it please? Your videos are amazing my friend. Thank you.
Nope, it’s there. See here wpsimplehacks.com/woocommerce-single-product-page-hacks/#hack-10-how-to-add-estimated-delivery-date-and-time-on-your-woocommerce-single-product-page
@@wpsimplehacks I am so sorry. You are right. It was further down. I was expecting to find the snippet right after Hack #1 as you show it in the video. Thank you
Hi, I hope you are well. In the 17:00 "NEW" badge for the products, I found an error. When the product has no reviews it looks perfect and nice, but when the product has reviews it is very close to the stars of the reviews. I tried to fix it with this line of code " margin-botton: 1em; " but it doesn't work and I can't move it up. Can you help me to solve this problem? By the way I bought the Blocksy Pro with your affiliate link, I hope that supports your time and knowledge and I also want to thank you for all the time and knowledge you offer to others.
@@wpsimplehacks Hello Thank you for replying! First I want to thank you for all the time you dedicate to your channel and you definitely deserve more subscribers than you have, I hope in the future to see you grow in your channel💖. The Theme I use is Blocksy-Pro just like the one you use in your tutorials. I follow all your steps carefully and take what interests me and apply it to my website. Here I send you a screenshot so you can see the 2 errors I have, they are very close to each other and cause confusion to the user. Can you pass me the line of code to correct this defect. prnt.sc/17hc96t Add To Cart and Return to shop are to close prnt.sc/17hcqxm The badge anthe stars are to close to
You sir, are amazing and extremely helpful. Just one issue I've run in to, with the "How to add Back to category button on Woocommerce single product page?" - the button works perfectly, but on hover it comes up with "back to category ########". Is there anyway to stop this?
Hi! Thank you for posting all of these great hacks! I was wondering if you can help me with the Woo commerce add on feature. I would like it so that my customers can add more than one add on to the product. AS it is now, they can only choose one. Do I need a bundle or table to do this? Or is there a snippet for that? Thank you, Kelly
hi thank you for helpfull video. i have a question. can we change the grouped product table location? For example at the top of the product tab section.
Thank you. This helps understanding concept how the page is made. Can I also put upsell product to not in the tab about with Blocksy Hook like 'single:except:before'?
You would need to mess with the CSS a bit. Also, if your theme or any other plugin doesn’t already load Font Awesome then you would need to make it load. CSS is probably something like this: .custom-text:before { font-family: 'Font Awesome 5 Free'; content: "\f0d1"; padding-right: 7px; font-size: 13px; color: #404040; }
@@wpsimplehacks thanks so much for the response, I'm currently using the Divi Theme but I can't seem to get it right as it changes all the text to icons 😬 I've tried using the :before and :after but I don't think I'm using it correctly, can you please guide me on this one. Many thanks 🙂
Hello, great video of showcasing these usefull tips! I have a question, i used themebuilder from Elementor for designing a single product page. I am looking to know how can i apply this code snippets to this template or any particular template instead of just the pre default Woocommerce product page template.
Hi! I'm using Blocksy and created a few content blocks, Is there a way to make the custom tabs to be product bound, instead of being applied as a global single product? Thank you!
@@wpsimplehacks Say If I'm having product 1 it would have only tabs A,B. Product 2 would have only tabs C,D. That way I could use blocks that are specifically related to the products only, with their own design and info.
@@wpsimplehacks What about if product_category=car display tabs A and B if product_category=boat display tab C and D. Can you modify your code with this amendmends?
Hey Thank you ! When I try to add a custom product tab and "You save" badge to my single product site the snippets wont appear in the product. I don't know why but I would be greatfull if you could help me by this problem.
Hi!! Great Video!!! Always learn a lot from your video!!! I just have a small questions. About the Hack #1: How to create and display custom product field? It's work good when I add code. I Add some information to the placeholder. I can't delete information and layout in front-end by empty placeholder. Is there a solution can solve this?? I don't need to show this information all the time in front-end. Thank you!!!
@@wpsimplehacks Thank you. It's seems I can't post any URL here. Will be deleted in 3 seconds. Sorry for my bad English. In your Video. The "Estimated shipping time : 2-3 weeks" part. Can we make the shipping information text field empty after we don't need those information?? I can only change the text "Estimated shipping time : 2-3 weeks". It's won't save if I delete all those text.
Amazing channel, on point, and really rare to find such hacks online, thanks a lot. My question is how can I add a custom field that enables a customer to customize the text on the product image. I am selling neon signs and want my visitors to add their own text in the field and it will be displayed live on the product featured image. I did a couple of trials and was able to achieve that through PHP functions, but couldn't find a way to let them choose different fonts and colors for that specific custom field created.
This is the best hack video I've seen on RUclips, thank you. Went to your website for more useful insights. I am currently setting up a new e-commerce site and this video is invaluable. I like the Shipping Timer but I have a question. Could you tell me a line of code to add to the Shipper Timer so I can select different delivery times for different categories, products etc. Some of our products and categories are more bespoke and will take longer than others. Your code adds the same Timer throughout the products. I would like to have different ones. Could you also show me how to style these differently. Sorry for asking so much but you seem like a maestro at Woocommerce
1) See this tutorial about Woocommerce conditionals www.businessbloomer.com/woocommerce-conditional-logic-ultimate-php-guide/ 2) I modified my blog post with the specific categories and specific product examples. See here wpsimplehacks.com/woocommerce-single-product-page-hacks/#hack-10-how-to-add-estimated-delivery-date-and-time-on-your-woocommerce-single-product-page
I have no experience with Buddyboss theme. You would probably need to use some plugin that allows you to do that. Take a look at the Kadence Woo extras for example wpsimplehacks.com/wooextras I have made an overview video about it ruclips.net/video/eUvzIA6jdEA/видео.html
Great videos, thank you :D I have a question, can you explain how can I style the default woocommerce "added to cart notification" that displays on top of the page when you click "add to cart"? Thank you in advance and keep up the great work
It depends on your theme. Usually it is realted to the "woocommerce-message" class. So, if you change it like here below then it will change all your Woocommerce message colors. .woocommerce-message { background: #ebebeb; border: 2px solid #ddd; }
Hey, I have a question about the enquiry form. Instead of a specific form showing on a specific category, is it possible for a specific form to show on a specific variable. It would be great to do something like that. Thank you.
Thanks a lot for this content, would be valuable if at some point you can teach how to add buttons or icons to share share on social networks on the single product page. Greetings.
Hello, thank you for all the amazing videos, however I am trying to use the delivery timer snippets, but when i try to Save changes and activate, i get the following error Syntax error, unexpected '
Thank you for letting me know. I fixed the code and this one works well on my end: wpsimplehacks.com/woocommerce-single-product-page-hacks/#hack-10-how-to-add-estimated-delivery-date-and-time-on-your-woocommerce-single-product-page
Well, I am commenting again on this video as I get a lot of knowledge from your channel and it's helping me with a lot of things. Next thing what I want to request you is Can you please tell me, where I can learn all these logics and make new codes for me? I know there's a lot I can do with the help of code instead of plugins and all. It would be really nice of you If you could suggest some blogs, any videos or any paid resources. Also I am not able to change things according to my work in your code as I don't know all the logic behind it. I am able to do at some point but I want more 🥺🥺🥺 Thanks in Advance
Awesome video. Great improvements :) With Hack #9, how do I also implement this on variable product pages, please? It currently does the change if all variations are "on backorder" but not when just one of the variations is in stock.
Sorry, can’t help with that. It would need some custom coding but at the moment I have too much stuff on my plate to have a time for this. I hope you understand :)
Thanks for creating this video. Hack #4 I want to use a related product carousel in the tab, and also want to this related product on the cart view page and checkout page.
@@wpsimplehacks thank you for responding. Yes i am sure I pasted the correct code. Yes line 8 is empty. There was someone else on the comment section that got the same error. Not sure why.
Use conditional logic www.businessbloomer.com/woocommerce-conditional-logic-ultimate-php-guide/ If you’re using a plugin called WpCodebox then this one allows you to set conditions. See here ruclips.net/video/kBT3nQGiTN4/видео.html
This Tutorial is amazing. Thank You for the Input codes. 1 HUGE problem I seem to be having is: a) The background is crashing with the general font colours, so some of the items pricing are not visisble b) Under Upsells and Crossells, how can I edit my Tittles Colour? It's Disappearing in the White Background c) How can I Align: Quantity, Add to cart and WishList on the same row ensuring the Qty and Add to Cart pops more d) On the Categories page, that page that shows more than single product, how can I make my website to show: Brand, Name of Product, Price?
Superb!!! thanks, I´d appreciate very much if you can make a tuto explaining how can redesign or customize the image gallery product, i.e the vertical scrolling like zara single product page :) thanks again
do you know how to make the product page a pop up for a food ordering website so user doesnt have to navigate back to the menu and just use the same page?
Hello, thank you for your great content. Can you help me understand how to edit the "single product page" via WPBakery / HTML on my site? I obviously can't find it anywhere, but I'd just like to use the existing one (that I don't know where to find) and add some tweaks, like spacing etc... Thanks in advance!!
Hi, Could you please tell how to add more than one product search.. So we could search product contains more than 1 word instead of the category.. For example product "Samsung Galaxy Note 20 Android 9 Curved Phone". Is it possible to filter for product contain word "Galaxy" and also contain "curved". Tahnk you
i want to add a section after add to cart button on single product page. how we can do that by using shortcode like i have elementor pro and i make sections and i want to them by shortcode. and Whatever I want to do section after add to cart it will be different for all products. because i want to show data like cash on delivery avialable on this product or not and more columns like this.If it is so that I can get such fields only when I add a single product then i need to just select themand they looked according to which i option select
@@wpsimplehacks thank you so much for your reply sir. Product Subtitle means - prnt.sc/124vbec please show the photo i gave you red mark i hope you will understand sir.
@Rajib Create a custom fielt for your products and output it in a place you would like them to see. See this video here ruclips.net/video/Ni8VezPG-cg/видео.html In this video there is a part about how to create a custom field and show it on the single product page.
Hi, I wondered if you can help me. How can I create a homepage banner offering free shipping on sales over a specified amount, and this amount (& currency) automatically changes based on the customer’s IP address? I have Woocommerce multi currency set up already. Many thanks!
I have a question. Can you help? i don't know what i did, the On "Sale" icon on the product became just a big dot............the text inside the Dot and the background color is the same so i can not see the "Sale" text on it is there anyway you just change the text color to distinct it from the background color? hope you can help out
@@wpsimplehacks Thanks for the prompt reply. Its my first time building a website so I haven't played with the CSS before. I am just wondering if I will mess up the whole website if I play around with the CSS? thanks a lot.
hi, thanks for your heads up. I finally managed find out the source code and know where the Sale text color was at and I changed it. it worked. thanks.
Why would you need this if you can add up-sells to your single product page? ☺️ Nevertheless, Google is your frind and it has some snippets foe you that work.
Is there any snippet to disable dark mode (if the user has switched to dark mode in their OS) I wanna show my website in normal mode only but when switched to dark mode on my phone/chrome it is showing the site in dark mode... how to disable it????
Could you please help me with the file location and name where i should add the code for "Show estimate delivery time"? for non developer this will be a great favor.
You need to chnage this part which i showed you. Just replace the priority 22 to 7. If it is not working then probably your theme overrides the Woocommerce hooks and you should ask from the theme developer about it
Very Educative tutorial sir, but i don't know if it's because I'm 1 year late to this tutorial but for the "save badge" that shows how much a customer will save during a sale, it only works on single products and not variable products,. Why? I'd be happy if you can help me with that . Also I'm using the flatsome theme thanks
There is also a snippet for the variable products (below the first one). wpsimplehacks.com/woocommerce-single-product-page-hacks/#hack-6-how-to-display-you-save-for-sale-price Didn’t it work on your end? I just tested and it works on my site.
As I show on the video, the snippet goes to either to your child theme’s functions.php file or better yet, use Code Snipepts pluign to insert the code. It is shown in the video how to do that.
I get this code when i try to use this .......The snippet has been deactivated due to an error on line 8: Cannot redeclare function woo_add_custom_fields.
Hi, I am an artist and I braved the elements and designed my own website with WordPress with woocommerce. I only sell original art on the site so when a piece is sold it is no longer available. The template I chose was suggested from a RUclips tutorial I followed. I have asked for help from the person who did the tutorial and he has never responded. When I sell a piece I would like to go to the single product edit page and in the product status field be able to check a box that will show the item as SOLD but I don't know if that is possible. If you could direct me to how to do this I would appreciate it.
If your theme supports displaying an 'out of stock' badge on products, simply rename it to 'Sold.'" If your theme doesn’t have this option, then maybe this heps you out wordpress.org/plugins/sold-out-badge-for-woocommerce/
@@wpsimplehacks thank you so much for responding, the theme does support displaying an "out of stock" badge on products but changing the name to Sold isn't so simple for a newbie. I am so new to this I'm unable to find where to change it at.
@@robmcculloughfinearts You can use Loco translate plugin which allows you to translate or change strings from your theme or plugins. See here wordpress.org/plugins/loco-translate/ Also, for single product page you can use this: wpsimplehacks.com/customize-woocommerce-stock-status/#how-to-change-out-of-stock-text-on-woocommerce-single-product-pages
Hello i am looking for your help. I am creating Book Website and have created variable product with 4 attributes Ex. New, Used, Soft Cover and Hard Cover. now I want to here give attribute value (amount) validation if variation New-Soft coer selected and attribute variabe amount is $100than another button option come as Buy if selected variation New-Hard and attribute variable amount is Above $300 than 2 button option come as 1 Buy and 2nd Rent and in rent button selection another radio box come With 4 Radio box choices..like 1 Month, 3 Months, 6 Months, 12 Months. how i can achieve this i spent almost 15+ hours but no plugin and options found on internet... i know you are genius can you create snippet for me and share with me. thanks
Sorry, can't help you with that because it cannot be solved with couple of lines of code. You would need to hire a developer who can take a closer look at it.
I found the information useful but the delivery was off. For instance, you don't really show what code to copy. There is no way of telling what to copy. You don't really give any clue as to what to do. Just because it's easy for you, someone who has no coding exp would be lost. Good thing for the rewind button.
No offense mate, but did you even watch the video from the start? If yes, then let me ask you three questions: 1) What part of the using Code Snippets at 2:32 mark was not clear? Because this is the plugin you need in order to use my snippets. And here goes your accusation about me "not giving a clue what to do". 2) What part of the "take a look at the description of this video where is the link to the snippets" at 3:17 mark was not clear? Because all the code used in the video is in the post I created for you. Just take a look at it, grab the code and paste it. So your accusation "there is no way telling what to copy" doesn’t hold up. 3) What part of taking the code shown in the link in the description (at 3:17 mark) and pasting it to the Code snippets code box shown at the 2:32 mark was not clear? Because as I said above, you just need to open up my post shown in the description of the video and grab the code. If you didn’t watch the video from the start, then you should do that, otherwise you will be leaving me comments like this one here. Take care, J.
this made me realise how fucking shit woocommerce is and wordpress in general, feels so damn fucking hacky just to change basic things, their templating system sucks ass.
If you’re using Elementor or a theme that overrides custom Woo hooks then you should find out what hooks these are using. Otherwise use something like that. // Add an enquiry form on Woocommerce single product page add_action( 'woocommerce_single_product_summary', 'single_product_message', 20 ); function single_product_message() { echo 'Send us an enquiry '; echo do_shortcode('[fluentform id="1"]'); // Your contact form shortcode goes here. }
Do you know any other good Wocommerce hacks? Let me know in the comments
thanks for the great tutorials, any solution for making the image gallery with a slider in case of lots of images ???
Great tutorial. Where can I download those codes? Thanks
@@dongxie4756 It says in the description
The best RUclips channel related to wordpress. Janek shows how to do simple but effective things, most of which advise installing additional plugins that significantly burden the website. Thank you for what you do.
@AnotherStep
Thank you for your kind words 😊
I have just discovered this fabulous channel! "Here's what we're going to do. I'll show you how it works!" And he does! Thanks!
Thanks :)
Man You're a life saver, was looking for these kinda stuff for a long time with no result. Want more videos on Woocommerce
Here’s the whole playlist full of Woocommerce related videos for you ruclips.net/p/PLS1Y4-9j3vy5ocz49VzsWViemqfPn10lb
EXCELLENT! Good explanations without wasting a lot of viewer time.
Thanks 😊
Thanks!
Hi, Thank you so much for such informative videos. I have been looking for these updates for my new website. Also, is there a way to contact you via email?
Contact me through my website wpsimplehacks.com
Great Content!
This channel deserves a lot more attention, very useful info in a very simple way
Thank you for your kind words ☺️
I am just setting up a shop for my art, this tutorial has been incredibly valuable to me, thank you so much for sharing your knowledge and your code.
Glad it helped 😊
Bro lots of love for you 🥺🥺🥺🥺🥺 you've shared such amazing hacks. It's helping me to improve my skills, saving money on plugins and charging more from clients for such features
Glad to hear that
Great Video, I found in your channel some teaks was impossible to find in other places , big respect
Thank you for your kind words :)
You're too good man - super helpful!
Thank you for your kind words 😊
Thanks a lot for this video
Glad it helped
Thanks a lot for this content
You are amazing the BEST!!!!!!
Thanks ☺️
Excellent video. Really helped me add a feature on my site! Thanks for sharing! (I like your presentation style as well....very good for intermediate users of woocommerce)
Thank you for your kind words 🙂
Thanks, for your time and creating content like this
Glad you enjoy it!
Super tips and snippets - very useful. Thanks for sharing.
Thank you for watching 😊
Wonderful video. For the shipping timer hack , Is there a way restrict the snippet to certain categories only?
Not sure. Test with these conditionals www.businessbloomer.com/woocommerce-conditional-logic-ultimate-php-guide/
These are golden, and customers wants these tweaks all the time. You can add scroll-padding css property to add some padding to scroll-to-tab function. Also maybe adding date picker and dynamically inserting the date instead of text-field in to the product edit page, might be interesting.
Thanks. Maybe in the future I’ll take another look and make a sequel for this video :)
I was just about to ask for this. Can you help with instructions on how and what for the scroll to tab padding? Thanks.
@@ionutsabo So, what element padding do you mean?
@@wpsimplehacks the scroll to tab could use some top space where it lands. Especially in the case of a sticky header for example. Where the tab name and first few lines would be covered by the sticky header.
@@ionutsabo
Replace this line
$('html,body').animate({scrollTop:$(tabpanel).offset().top}, 750);
with this
$('html,body').animate({scrollTop:$(tabpanel).offset().top -150},'slow');
play with -150 value
Thank you for this video. I think you missed adding a code snippet on your website. The code snippet you show at 05:24 (Show estimated delivery time) is not on your website. Can you add it please? Your videos are amazing my friend. Thank you.
Nope, it’s there. See here wpsimplehacks.com/woocommerce-single-product-page-hacks/#hack-10-how-to-add-estimated-delivery-date-and-time-on-your-woocommerce-single-product-page
@@wpsimplehacks I am so sorry. You are right. It was further down. I was expecting to find the snippet right after Hack #1 as you show it in the video. Thank you
what an amazing video. Well done!
Thank you for watching 😊
Hi, I hope you are well. In the 17:00 "NEW" badge for the products, I found an error. When the product has no reviews it looks perfect and nice, but when the product has reviews it is very close to the stars of the reviews. I tried to fix it with this line of code " margin-botton: 1em; " but it doesn't work and I can't move it up. Can you help me to solve this problem? By the way I bought the Blocksy Pro with your affiliate link, I hope that supports your time and knowledge and I also want to thank you for all the time and knowledge you offer to others.
What theme you are using with this NEW badge?
@@wpsimplehacks
Hello Thank you for replying! First I want to thank you for all the time you dedicate to your channel and you definitely deserve more subscribers than you have, I hope in the future to see you grow in your channel💖.
The Theme I use is Blocksy-Pro just like the one you use in your tutorials. I follow all your steps carefully and take what interests me and apply it to my website. Here I send you a screenshot so you can see the 2 errors I have, they are very close to each other and cause confusion to the user. Can you pass me the line of code to correct this defect.
prnt.sc/17hc96t Add To Cart and Return to shop are to close
prnt.sc/17hcqxm The badge anthe stars are to close to
Please send me the links to the sites where this happens and I’ll give it a closer look. Send me an email to info@wpsimplehacks.com
You sir, are amazing and extremely helpful. Just one issue I've run in to, with the "How to add Back to category button on Woocommerce single product page?" - the button works perfectly, but on hover it comes up with "back to category ########". Is there anyway to stop this?
Sorry, can’t help you with that
Perfect, thank you. Please make a video of the single product web store, with Blocksy theme. Looking forward to it.
@blaz667
Please explain a bit what is it you want this video to cover?
Really hard and good job man ...thank you
Glad you liked it!
Next JS 15 version full course video please...you are helping many young developers to understand next-js easily.
Sorry, can't help you with this 😊
Hi! Thank you for posting all of these great hacks! I was wondering if you can help me with the Woo commerce add on feature. I would like it so that my customers can add more than one add on to the product. AS it is now, they can only choose one. Do I need a bundle or table to do this? Or is there a snippet for that? Thank you, Kelly
Hi Kelly,
See whether this solution helps you out ruclips.net/video/p6g3hVtq_E0/видео.html
hi thank you for helpfull video. i have a question. can we change the grouped product table location? For example at the top of the product tab section.
Sorry, can’t help with that
Thank you very much for clean code tuts :)
I always prefer it over some plugin.
Glad you like them 🙂
Thank you. This helps understanding concept how the page is made. Can I also put upsell product to not in the tab about with Blocksy Hook like 'single:except:before'?
WooCommerce doesn’t have a upsells' product shortcode which means you can't use my snippet to do that.
Hello, thanks for this amazing tutorial 🙂
How do I go about adding an icon (delivery icon from Font Awesome etc) to the custom product fields?
You would need to mess with the CSS a bit. Also, if your theme or any other plugin doesn’t already load Font Awesome then you would need to make it load. CSS is probably something like this:
.custom-text:before {
font-family: 'Font Awesome 5 Free';
content: "\f0d1";
padding-right: 7px;
font-size: 13px;
color: #404040;
}
@@wpsimplehacks thanks so much for the response, I'm currently using the Divi Theme but I can't seem to get it right as it changes all the text to icons 😬 I've tried using the :before and :after but I don't think I'm using it correctly, can you please guide me on this one.
Many thanks 🙂
Hello, great video of showcasing these usefull tips! I have a question, i used themebuilder from Elementor for designing a single product page. I am looking to know how can i apply this code snippets to this template or any particular template instead of just the pre default Woocommerce product page template.
Elementor overrides default Woocommerce hooks and unfotunately I don’t know what hooks they’re using. It wpuld be wise to ask it from their support.
Thanks for this effort, very good work!
Glad you liked it!
All very useful hacks. Thank you!
Gla you liked them 😊
thanks a lot komrad for the hacks, help a lot of newbie like me
Thank you for watching
Awesome work as usual! Thank you
Our pleasure!
Hi! I'm using Blocksy and created a few content blocks, Is there a way to make the custom tabs to be product bound, instead of being applied as a global single product? Thank you!
What do you mean by "tabs to be product bound"? Can you describe it a bit more?
@@wpsimplehacks Say If I'm having product 1 it would have only tabs A,B. Product 2 would have only tabs C,D. That way I could use blocks that are specifically related to the products only, with their own design and info.
The easiest and most effective way to do that is with this plugin here wordpress.org/plugins/yikes-inc-easy-custom-woocommerce-product-tabs/
@@wpsimplehacks Thanks!
@@wpsimplehacks What about if product_category=car display tabs A and B if product_category=boat display tab C and D. Can you modify your code with this amendmends?
Beautiful job, thank you!! :)
Thank you too!
Hey Thank you !
When I try to add a custom product tab and "You save" badge to my single product site the snippets wont appear in the product. I don't know why but I would be greatfull if you could help me by this problem.
What theme you're using? Most likely it overiddes Woocommerce default hooks positions. Also, Elementor templates are overriding them.
Very helpful video!But I have a question: Any chance to make variable product dropdown locks like grouped product table?Thanks
Try searching for some "Woocommerce variations table" plugin. There are some that should do the trick.
Thanh you so much, i'll try it.@@wpsimplehacks
Thanks for theses awesome hacks. But 12:27 Show "You save:" badge is not working for variable products. I am using Woodmart theme. Please help.
I just tested and it works well. Probably your Woodmart theme overrides Woocommerce hooks
Always you makes valuable videos. 👌
Can you tell me how can I add "How many Product Sold" on shop page frontend?
See, whether this helps you out:
add_action( 'woocommerce_single_product_summary', 'products_sold', 11 );
function products_sold() {
global $product;
$units_sold = $product->get_total_sales();
if ( $units_sold ) echo '' . sprintf( __( 'Units Sold: %s', 'woocommerce' ), $units_sold ) . '';
}
Thank you very much! How to hide products witout images ?
letmegooglethat.com/?q=woocommerce+hide+products+without+imagez 😉
Hi!! Great Video!!!
Always learn a lot from your video!!!
I just have a small questions. About the Hack #1: How to create and display custom product field?
It's work good when I add code. I Add some information to the placeholder. I can't delete information and layout in front-end by empty placeholder.
Is there a solution can solve this?? I don't need to show this information all the time in front-end.
Thank you!!!
Sorry, but I did not understand your issue. Could you post a screenshot here with the explanation and maybe I can comment on that.
@@wpsimplehacks Thank you. It's seems I can't post any URL here. Will be deleted in 3 seconds.
Sorry for my bad English. In your Video. The "Estimated shipping time : 2-3 weeks" part. Can we make the shipping information text field empty after we don't need those information??
I can only change the text "Estimated shipping time : 2-3 weeks". It's won't save if I delete all those text.
Amazing channel, on point, and really rare to find such hacks online, thanks a lot. My question is how can I add a custom field that enables a customer to customize the text on the product image. I am selling neon signs and want my visitors to add their own text in the field and it will be displayed live on the product featured image. I did a couple of trials and was able to achieve that through PHP functions, but couldn't find a way to let them choose different fonts and colors for that specific custom field created.
See whether this blugin helps you out 1.envato.market/5b5KQb
This is the best hack video I've seen on RUclips, thank you. Went to your website for more useful insights. I am currently setting up a new e-commerce site and this video is invaluable. I like the Shipping Timer but I have a question. Could you tell me a line of code to add to the Shipper Timer so I can select different delivery times for different categories, products etc. Some of our products and categories are more bespoke and will take longer than others. Your code adds the same Timer throughout the products. I would like to have different ones. Could you also show me how to style these differently. Sorry for asking so much but you seem like a maestro at Woocommerce
1) See this tutorial about Woocommerce conditionals www.businessbloomer.com/woocommerce-conditional-logic-ultimate-php-guide/
2) I modified my blog post with the specific categories and specific product examples. See here wpsimplehacks.com/woocommerce-single-product-page-hacks/#hack-10-how-to-add-estimated-delivery-date-and-time-on-your-woocommerce-single-product-page
@@wpsimplehacks Thank you for your help, keep up the engaging content.
thanks for the great tutorials, I'm using boddyboss theme, any solution for making the image gallery with a slider in case of lots of images ???
I have no experience with Buddyboss theme. You would probably need to use some plugin that allows you to do that. Take a look at the Kadence Woo extras for example wpsimplehacks.com/wooextras
I have made an overview video about it ruclips.net/video/eUvzIA6jdEA/видео.html
Great videos, thank you :D I have a question, can you explain how can I style the default woocommerce "added to cart notification" that displays on top of the page when you click "add to cart"? Thank you in advance and keep up the great work
It depends on your theme. Usually it is realted to the "woocommerce-message" class. So, if you change it like here below then it will change all your Woocommerce message colors.
.woocommerce-message {
background: #ebebeb;
border: 2px solid #ddd;
}
Amazingly good content
Thanks :)
Hey, I have a question about the enquiry form. Instead of a specific form showing on a specific category, is it possible for a specific form to show on a specific variable. It would be great to do something like that. Thank you.
Unfortunately I can't help you with that
@@wpsimplehacks bruh
Wonderful, thank you very much for these!
You're welcome 😊
Thanks a lot for this content, would be valuable if at some point you can teach how to add buttons or icons to share share on social networks on the single product page. Greetings.
Hi,
Currently, I have too many videos in the pipeline and therefore, I’m probably not going to make a video on this topic. Sorry :)
Hello, can you make a tutorial about layout the product image with the thumbnails nav on the left or right of the box please
See whether this video helps you out ruclips.net/video/CnAbjgTXL60/видео.html
Thanks a lot for this type of content. ❤
Your work amazing sir
Love from 🇮🇳India
Thanks a ton
Hello, thank you for all the amazing videos, however I am trying to use the delivery timer snippets, but when i try to Save changes and activate, i get the following error
Syntax error, unexpected '
Thank you for letting me know. I fixed the code and this one works well on my end:
wpsimplehacks.com/woocommerce-single-product-page-hacks/#hack-10-how-to-add-estimated-delivery-date-and-time-on-your-woocommerce-single-product-page
Well, I am commenting again on this video as I get a lot of knowledge from your channel and it's helping me with a lot of things. Next thing what I want to request you is Can you please tell me, where I can learn all these logics and make new codes for me? I know there's a lot I can do with the help of code instead of plugins and all. It would be really nice of you If you could suggest some blogs, any videos or any paid resources. Also I am not able to change things according to my work in your code as I don't know all the logic behind it. I am able to do at some point but I want more 🥺🥺🥺
Thanks in Advance
Unfortunately I can't suggest any specific courses for you. Look for PHP and CSS for begginers from RUclips.
@@wpsimplehacks thanks a lot for your reply. I really mean it
Where can we find the woocommerce hooks information that you were showcasing in this video. And is there a way to see the available hooks in blocksy
All the links are ALWAYS in the description of the video.
Blocksy adds a "Show hooks" menu to the top admin bar. It is visible only on frontend.
Awesome video. Great improvements :) With Hack #9, how do I also implement this on variable product pages, please? It currently does the change if all variations are "on backorder" but not when just one of the variations is in stock.
Sorry, can’t help with that. It would need some custom coding but at the moment I have too much stuff on my plate to have a time for this. I hope you understand :)
@@wpsimplehacks No worries and thank you for the reply.
Thanks for creating this video. Hack #4 I want to use a related product carousel in the tab, and also want to this related product on the cart view page and checkout page.
You can shop cross-sells on the cart page. See here docs.woocommerce.com/document/related-products-up-sells-and-cross-sells/
This is awesome.
Thanks :)
Thank you for your great content. Hack #1, i get an error that says “ this snippet has been deactivated due to an error on line 8” please help
I just tested and works as promised, Are you sure you pasted it correctly because in my code line 8 is empty line.
@@wpsimplehacks thank you for responding. Yes i am sure I pasted the correct code. Yes line 8 is empty. There was someone else on the comment section that got the same error. Not sure why.
Hi. How would one display the same message on product pages for products of the same category? Thanks
Use conditional logic www.businessbloomer.com/woocommerce-conditional-logic-ultimate-php-guide/
If you’re using a plugin called WpCodebox then this one allows you to set conditions. See here ruclips.net/video/kBT3nQGiTN4/видео.html
This Tutorial is amazing. Thank You for the Input codes. 1 HUGE problem I seem to be having is:
a) The background is crashing with the general font colours, so some of the items pricing are not visisble
b) Under Upsells and Crossells, how can I edit my Tittles Colour? It's Disappearing in the White Background
c) How can I Align: Quantity, Add to cart and WishList on the same row ensuring the Qty and Add to Cart pops more
d) On the Categories page, that page that shows more than single product, how can I make my website to show: Brand, Name of Product, Price?
It would be wise to ask support from your theme developer and ask why the fonts and backgroudn are crashing.
Dear how to move the product tab(Description, Reviews,tabs) bellow add to cart button??
.
In Blockcy Theme
This should do the trick :)
letmegooglethat.com/?q=Woocommerce+how+move+product+tabs+below+add+to+cart+button
Hi, Some of this snippets are not visible on Mobile devices. Am i Doing something wrong? Thanks for your amazing job!
Which snippets are not visible on mobile devices?
Superb!!! thanks, I´d appreciate very much if you can make a tuto explaining how can redesign or customize the image gallery product, i.e the vertical scrolling like zara single product page :) thanks again
Kadence Woocommerce Extras plugins allows you to do that. See here wpsimplehacks.com/wooextras
SAVE 10% Coupon SIMPLEHACKS
For hack #2 Show estimated delivery time, are weekends excluded?
if FRI/SAT/SUN then delivery will be MONDAY
Could you please create a snippet to show Add to Cart button like Shoptimizer Theme
This is purely your theme-related topic and should be asked from the theme developer.
do you know how to make the product page a pop up for a food ordering website so user doesnt have to navigate back to the menu and just use the same page?
Maybe this helps you out ruclips.net/video/p6g3hVtq_E0/видео.html
Hello, thank you for your great content. Can you help me understand how to edit the "single product page" via WPBakery / HTML on my site? I obviously can't find it anywhere, but I'd just like to use the existing one (that I don't know where to find) and add some tweaks, like spacing etc... Thanks in advance!!
Sorry, can't help you with that. I haven’t used WP Bakery for years and if anyone asks, then I always suggest them to keep away that tool.
Hi, Could you please tell how to add more than one product search.. So we could search product contains more than 1 word instead of the category.. For example product "Samsung Galaxy Note 20 Android 9 Curved Phone". Is it possible to filter for product contain word "Galaxy" and also contain "curved". Tahnk you
Sorry, I don’t know the answer to that one :)
i want to add a section after add to cart button on single product page. how we can do that by using shortcode like i have elementor pro and i make sections and i want to them by shortcode. and Whatever I want to do section after add to cart it will be different for all products. because i want to show data like cash on delivery avialable on this product or not and more columns like this.If it is so that I can get such fields only when I add a single product then i need to just select themand they looked according to which i option select
If you have an Elementor Pro then use a Template builder it has. With it you can create your own single product page layouts.
Sir thank you so much!!! your every tutorial is working perfectly... Sir, please make a video How to add Product Subtitle?? please make a video sir
@Rajib
What do you mean by Product Subtitle?
@@wpsimplehacks thank you so much for your reply sir. Product Subtitle means - prnt.sc/124vbec please show the photo i gave you red mark i hope you will understand sir.
@Rajib
Create a custom fielt for your products and output it in a place you would like them to see. See this video here ruclips.net/video/Ni8VezPG-cg/видео.html
In this video there is a part about how to create a custom field and show it on the single product page.
@@wpsimplehacks sir thank you so so much your the great person!
Hi, I wondered if you can help me. How can I create a homepage banner offering free shipping on sales over a specified amount, and this amount (& currency) automatically changes based on the customer’s IP address? I have Woocommerce multi currency set up already. Many thanks!
It’s tricky, and you would need to hire a developer who would take a closer look at it.
I have a question. Can you help?
i don't know what i did, the On "Sale" icon on the product became just a big dot............the text inside the Dot and the background color is the same so i can not see the "Sale" text on it
is there anyway you just change the text color to distinct it from the background color?
hope you can help out
Did you use the CSS I showed? Try to play with the CSS values and see whether this helps.
@@wpsimplehacks Thanks for the prompt reply. Its my first time building a website so I haven't played with the CSS before. I am just wondering if I will mess up the whole website if I play around with the CSS? thanks a lot.
If something goes wrong, then just delete the modified CSS and nothing else happens :)
hi, thanks for your heads up. I finally managed find out the source code and know where the Sale text color was at and I changed it. it worked. thanks.
I would like to know how can we show Cross Sell on Single Product Page instead on Cart Page
Why would you need this if you can add up-sells to your single product page? ☺️ Nevertheless, Google is your frind and it has some snippets foe you that work.
G00D Work
Thanks 😊
Is there any snippet to disable dark mode (if the user has switched to dark mode in their OS) I wanna show my website in normal mode only but when switched to dark mode on my phone/chrome it is showing the site in dark mode... how to disable it????
Sorry, I don't k ow the answer
Amazing hacks
Thanks 😊
Could you please help me with the file location and name where i should add the code for "Show estimate delivery time"? for non developer this will be a great favor.
Here you can find default Woocommerce single product hooks www.businessbloomer.com/woocommerce-visual-hook-guide-single-product-page/
Hello! sir, how to display a custom field under WooCommerce single product title??? i'm looking forword to your help!!
add_action('woocommerce_single_product_summary', 'display_custom_field_value', 7 );
@@wpsimplehacks sir i add this code on Snippets but no changes.
You need to chnage this part which i showed you. Just replace the priority 22 to 7. If it is not working then probably your theme overrides the Woocommerce hooks and you should ask from the theme developer about it
Very Educative tutorial sir, but i don't know if it's because I'm 1 year late to this tutorial but for the "save badge" that shows how much a customer will save during a sale, it only works on single products and not variable products,. Why? I'd be happy if you can help me with that . Also I'm using the flatsome theme thanks
There is also a snippet for the variable products (below the first one). wpsimplehacks.com/woocommerce-single-product-page-hacks/#hack-6-how-to-display-you-save-for-sale-price
Didn’t it work on your end? I just tested and it works on my site.
@@wpsimplehacks unfortunately it didn't work for my site sir
Hello,Any hack on customizing the search result page
What is it you want to customize over there? :)
Plz share hacks about shop page customization.
Probably in the future 😊
Heads up: at 17:00 the code doesn't work. It doesn't show new badge on the product page :(
I just tested and works well on two of my sites
How to show variable products as single products in shop and category page.
Without using a plugin.
Thanks
Not possible without custom coding and lots of work. Cannot be done with couple of snippets.
Sir where to add add the "back to category" button customizer code
As I show on the video, the snippet goes to either to your child theme’s functions.php file or better yet, use Code Snipepts pluign to insert the code. It is shown in the video how to do that.
I get this code when i try to use this .......The snippet has been deactivated due to an error on line 8:
Cannot redeclare function woo_add_custom_fields.
Which snippet is the one you are using?
I get the same error. It’s hack #1 . It says there is an error on line 8. Please help
What’s your favorite hack from this list? Let me know in the comments
Hi, I am an artist and I braved the elements and designed my own website with WordPress with woocommerce. I only sell original art on the site so when a piece is sold it is no longer available. The template I chose was suggested from a RUclips tutorial I followed. I have asked for help from the person who did the tutorial and he has never responded. When I sell a piece I would like to go to the single product edit page and in the product status field be able to check a box that will show the item as SOLD but I don't know if that is possible. If you could direct me to how to do this I would appreciate it.
If your theme supports displaying an 'out of stock' badge on products, simply rename it to 'Sold.'"
If your theme doesn’t have this option, then maybe this heps you out wordpress.org/plugins/sold-out-badge-for-woocommerce/
@@wpsimplehacks thank you so much for responding, the theme does support displaying an "out of stock" badge on products but changing the name to Sold isn't so simple for a newbie. I am so new to this I'm unable to find where to change it at.
@@robmcculloughfinearts You can use Loco translate plugin which allows you to translate or change strings from your theme or plugins. See here wordpress.org/plugins/loco-translate/
Also, for single product page you can use this: wpsimplehacks.com/customize-woocommerce-stock-status/#how-to-change-out-of-stock-text-on-woocommerce-single-product-pages
@@wpsimplehacks Thank you so much!!!
I have elementor and the timer shipping show fatal error
Elementor overrides Woocommerce default hooks and therefore you can’t use these snippets with it.
wow
Yeah :)
Hello i am looking for your help.
I am creating Book Website and have created variable product with 4 attributes Ex. New, Used, Soft Cover and Hard Cover.
now I want to here give attribute value (amount) validation if variation New-Soft coer selected and attribute variabe amount is $100than another button option come as Buy if selected variation New-Hard and attribute variable amount is Above $300 than 2 button option come as 1 Buy and 2nd Rent and in rent button selection another radio box come With 4 Radio box choices..like 1 Month, 3 Months, 6 Months, 12 Months. how i can achieve this i spent almost 15+ hours but no plugin and options found on internet... i know you are genius can you create snippet for me and share with me. thanks
Sorry, can't help you with that because it cannot be solved with couple of lines of code. You would need to hire a developer who can take a closer look at it.
@@wpsimplehacks can you do at chargeable basis how much time and cost will take?
Unfortunately I don't provide this type of service at the moment.
@@wpsimplehacks Thanks for quick response
And if wanna put in Spanish?
Change my text shown in the video from English to Spanish
@@wpsimplehacks I do but the month a d day of the week is in English
If you don't use Snippets, you are sleeping ha
Ehm... What? ☺️
I found the information useful but the delivery was off. For instance, you don't really show what code to copy. There is no way of telling what to copy. You don't really give any clue as to what to do. Just because it's easy for you, someone who has no coding exp would be lost. Good thing for the rewind button.
No offense mate, but did you even watch the video from the start?
If yes, then let me ask you three questions:
1) What part of the using Code Snippets at 2:32 mark was not clear? Because this is the plugin you need in order to use my snippets. And here goes your accusation about me "not giving a clue what to do".
2) What part of the "take a look at the description of this video where is the link to the snippets" at 3:17 mark was not clear? Because all the code used in the video is in the post I created for you. Just take a look at it, grab the code and paste it. So your accusation "there is no way telling what to copy" doesn’t hold up.
3) What part of taking the code shown in the link in the description (at 3:17 mark) and pasting it to the Code snippets code box shown at the 2:32 mark was not clear? Because as I said above, you just need to open up my post shown in the description of the video and grab the code.
If you didn’t watch the video from the start, then you should do that, otherwise you will be leaving me comments like this one here.
Take care,
J.
You should delete this comment MrDarryk, it’s very shameful.
this made me realise how fucking shit woocommerce is and wordpress in general, feels so damn fucking hacky just to change basic things, their templating system sucks ass.
🤓
also how we can display shortcode content anywhere by using hoooks
If you’re using Elementor or a theme that overrides custom Woo hooks then you should find out what hooks these are using. Otherwise use something like that.
// Add an enquiry form on Woocommerce single product page
add_action( 'woocommerce_single_product_summary', 'single_product_message', 20 );
function single_product_message() {
echo 'Send us an enquiry ';
echo do_shortcode('[fluentform id="1"]'); // Your contact form shortcode goes here.
}
@@wpsimplehacks thanks a lot for providing snippet which exactly need thanks a lot lot