Create a custom WooCommerce Product Archive Elementor Pro & Elementor Custom Skin

Рет қаралды 101,088

4 жыл бұрын

Create a custom WooCommerce Product Archive with Elementor Pro & Elementor Custom Skin.
If you're looking for a quick and easy way to create more unique WooCommerce Product Archive pages with Elementor Pro, then this tutorial will help cast some light on how easy it is to achieve with the free Elementor Custom Skin plugin and a little creativity.
► RELATED TUTORIALS ◄
Checkout Page Customisation: • Woocommerce Checkout P...
Product Page Customisation: • How To Customize Wooco...
Take your WordPress website and skills to the next level!
► THE TOOLS I LOVE ◄
If you like what we do and would like to support us, please consider using these affiliate links when purchasing any of the plugins covered in our tutorials. Thank you for your support.
► WORDPRESS VISUAL PAGE BUILDERS ◄
★ ELEMENTOR PRO: jo.my/1s0t2s2
★ Brizy Pro: bit.ly/2Ji97r8
★ WPBakery Page Builder (Formerly VISUAL COMPOSER): bit.ly/2NVbVNP
★ DIVI 3 Page Builder: bit.ly/2HiiDcE
► WORDPRESS THEMES ◄
★ GeneratePress Premium: bit.ly/2Ydn1SE
★ OCEANWP: bit.ly/2fRHBr0
★ DIVI Theme: bit.ly/2G8JMiA
★ Astra Pro: bit.ly/2zruoKn
► WORDPRESS TOOLS ◄
★ SMART SLIDER 3: bit.ly/2G0G1vB
★ CSSHERO: bit.ly/2qbrRl6
★ SLIDER REVOLUTION 6 - jo.my/sr6
► SUBSCRIBE ◄
bit.ly/2rX7rhu
► LETS CONNECT: ◄
/ wptutz
SUPPORT: Our website offers additional information and perks. Please check it out! wptuts.co.uk

Пікірлер: 396

@nickdixon3536 3 жыл бұрын

This is exactly what i was looking for 😭. watched hours of youtube videos and no one teaches you how to do this. You Sir, are a God send. Thank You!!!

@sotamods-TMH 3 жыл бұрын

Same for me! After spending HOURS and DAYS in experimenting in the backend, I fortunately ended up in searching for an archive customization solution and now I can proceed building my shop much better and easier :)

@KennethHall 4 жыл бұрын

Outstanding, being a newbie, I have spent about 8 weeks trying to put it all together, your explanations allow me to get past bottlenecks. Thanks for your teaching.

@TheFarfellia 4 жыл бұрын

After hours and hours of online research I finally find the solution to customize the product list page, thanks to the loop :) thank you so much ! very very helpfull !

@sheralync5854 3 жыл бұрын

You are a fabulous instructor. The right amount of detail, excellent pace and examples. This really helped.

@stevechong65 2 жыл бұрын

Hey Paul, once again a great tutorial! You have solved a problem that has been bugging me for days! You are one of the best tutors out there! Keep up the good work!

@chairmansocial 3 жыл бұрын

Absolutely solid video. Very helpful regarding pointing out the dynamic functionality that nobody else teaches.

@akellaglobal4608 3 жыл бұрын

Your videos on Woocommerce have helped me quite a bit. Thank you very much for this video and others on Woolentor and Woolementor. These plugins are quite helpful, and most importantly, your short videos on how to use them a blessing and time saver. So, thank you!

@24SevenMarketing 4 жыл бұрын

Another GREAT video...there are so many plugins claiming to let you customize different WooCommerce pages within Elementor...but NONE of them can come close to what you show in this video. Again you show the real power behind Elementor Pro and its ability to create custom themes. I can't wait to see your video on Elementor Custom Skins Pro version. It, like Elementor, already does so much with the free version ... I wounder what the Pro version adds.

@ChapelOfNewSongsMararaba 4 жыл бұрын

Thank you for the tutorial. Burnt over 6 hours already trying to figure this out.

@SalikMinsk 2 жыл бұрын

Wow! So quickly, accurately, succinctly and clearly! Thank you so much!

@elmerjohn3406 3 жыл бұрын

This is awesome. This is exactly what i have been looking for for hours now. THANK YOU!

@AdrianoWagner13 3 жыл бұрын

Thanks a Lot! Never got it so well explained! You made it easy and simple and saved me! Thanks a lot and keep up the great work!

@sotamods-TMH 3 жыл бұрын

BRILLIANT!!! This video was VERY helpful to me! Like Nicky Mandeville I was spending a lot of time for research and finally ended up finding your tut. I killed two birds with one stone since I was desperately looking for a solution to edit the products' look in the archive and for the single products as well! Great job, thanks a LOT and please keep on going wit hsuch awesome tuts!

@samantha2715 4 жыл бұрын

This was extremely helpful, showing products as a 'post' instead of using the product archive helped me work around some issues on a client site where they had tons of stuff overwriting woocommerce archives, thanks!

@lscottbutler2853 2 жыл бұрын

Thanks for all you do Paul. You're not only a great teacher but an excellent orator. Of the scores of videos that I've watched I haven't heard you utter a singe Um or Ah. Great work....

@nichart 4 жыл бұрын

Thanks for this great tutorial. It's a really great tool, that will use again in the future. Thank you!

@filippomarsili5470 3 жыл бұрын

I really like the way you explain things. Right on point. Great tutorials.

@TutorIsland 3 жыл бұрын

Really enjoyed the video, exactly the info I was looking for. Thanks !

@user-pr2wl4hm2b 4 жыл бұрын

Thank you so much. You have no idea how much time I trying to understand that. You saved me

@WPTuts 4 жыл бұрын

My pleasure. So glad to hear this helped. 😁

@abdullahalmohaymenrafi5553 4 жыл бұрын

Really useful. I always like the way how simply you explain everything.

@WPTuts 4 жыл бұрын

Thank you :0)

@abdulkadirhussain7471 Жыл бұрын

I am developing a site for my small business and found this tutorial to be really helpful. Thanks for the good work

@dmitryklimov9706 4 жыл бұрын

Paul, you're the best, thank you!

@morgankennedy6708 3 жыл бұрын

OMG I had to Google so much to find this but it was EXACTLY what I was looking for.

@edinhofilho98 4 жыл бұрын

I'm from Brazil and your video really helped me, thanks!

@Orsohobo 4 жыл бұрын

Finally what i was looking for! Thanks

@AnaPereira-cw7tx 4 жыл бұрын

Amazing! I searched for a long time, thanks to God I found your video!

@iriszijlstra9713 4 жыл бұрын

awesome info! exactly what I was looking for for building my shop! THANK YOU

@WPTuts 4 жыл бұрын

Great to hear :)

@EhsanBahrami-hw3qo Жыл бұрын

Very useful and excellent, a problem that I was dealing with for several days was solved, thank you very much

@CharlesHale85207 4 жыл бұрын

Some good information in there, will look for the next video as well. - Thanks

@digitaleditorial 11 ай бұрын

Thanks a lot! I've been searching for how to edit this section, and only got the basic archive options. Thanks to this video, now I have full control over my archive's look and feel. I'd add more likes to the video if I could 😀

@bhumiagaramakdes853 2 жыл бұрын

Great Info Boss.... You help and solved my problem. Thx a lot !!😄

@leslieisaac9104 4 жыл бұрын

Love these customisation videos Paul. They open up so many options for an Elementor novice like me. If you want to use Woo Product Categories on the archive page then I found that you need to set Query on the Posts to Current Query, so that the product category filtering operates. Setting Query to Product shows all products regardless of category selected.

@HerQuiddity 4 жыл бұрын

Thanks for pointing that out, this was driving me crazy!!

@akaguv 4 жыл бұрын

Life saver!! :D

@dhireshpahuja 4 жыл бұрын

Thanks , You sorted this for me . It was driving me crazy !! Still one thing is going wrong, Sorting the products price wise not working perfectly. Could you help with this? Thank you !

@micheleM84 3 жыл бұрын

Thanks Leslie!

@helloitslouisaa 2 жыл бұрын

OMG Thank you so much! This was also driving me crazy :D This was really helpful!

@ivannikoffandrii Жыл бұрын

Incredible instruction, thank you very much for your work!

@tomaszroot 2 жыл бұрын

Good material. Thank you very much for your help. It was a great experience

@plutorising3167 Жыл бұрын

What a great instructor! Just subscribed. Thanks so much.

@viniciussabara2951 3 жыл бұрын

thanks man, thanks a lot! you deserve the best!

@mmb811 3 жыл бұрын

Fantastic video tutorial, clear and to the point! Well Done, keep up the great videos, Liked & Subscribed ;)

@acno4780 2 жыл бұрын

Thank you for the video, very educational.

@maudverboom4582 2 жыл бұрын

Thanks so much! It helped a lot.

@ajaymanjeethutube 2 жыл бұрын

Really a great Tip and tuts.. Bring out and share more like this... Very usefull and Thanks a ton...

@pellekarlsson152 4 жыл бұрын

Great video Paul ! I think woocommerce customization is a big issue for all famous pagebuilders companies to solve. For the moment there are too many solutions from Third-part some of them too expensive and less good...I hope all pagebuilders Team work hard on the"woo customization issue"

@arashazadkhan7036 3 жыл бұрын

Thanks alot for this helpful Video , You save my day !!!!!

@santobramas 4 жыл бұрын

Yes ! AWESOME ! Thank you

@alexwaymann640 2 жыл бұрын

This is genius way to. Thank you for amazing experience!

@jasonbeard 4 жыл бұрын

I bought the Custom Skin Pro when first released on LTD & still havent used it yet. Be good to see a vid on that.... Onya Paul...

@ishield6452 4 жыл бұрын

Thanks for all the great videos.

@drteddyweb 4 жыл бұрын

Another amazing tutorial as usual....

@allecsable 4 жыл бұрын

Thanks so much! It helped a lot. However, I am now struggling with my filters because since I used the Posts Widget, it is not connected to my filters anymore, which work with the product attribute. Can you help?

@Nimber22 3 жыл бұрын

Im having the same issue, did you find a solutions ?

@kennethmoesgaard2696 3 жыл бұрын

I'm also struggling with this issue. Pls let me know if any of you figure this out. I have tried for hours...

@dots560 2 жыл бұрын

Try Filter everything plugin. Got the info on this channel and it worked for me.

@lodeluyckx 3 ай бұрын

Extremely helpful, thanks

@martagraugil 3 жыл бұрын

soo useful!! Thank you so so much!!

@KayyDainty 3 жыл бұрын

Hi, thank you for your amazing tutorial. What if I wanted the product to show a secondary image on hover? How would I do that?

@dhireshpahuja 4 жыл бұрын

Thank you so much. Helpful video. Just one question How can we add sorting menu on top of this? Thanks !

@RafaelRodriguezCorcho 2 жыл бұрын

Cool tutorial, thanks!

@alissoncustodio3477 4 жыл бұрын

You save my Life. Thanks bro, more one sub:)

@clarylifeglobal9573 4 жыл бұрын

Thanks so much for this tutorial. It really helped a great deal. However, there's a challenge. The "add-to-basket" which is now "add-to-cart" has issues with styling it on Elementor. It doesn't always follow the settings.

@bangshady2054 3 жыл бұрын

so so so appreciated!!! Clap clap! Thanks alot

@stepupmybody7784 4 жыл бұрын

This was super helpful! Thanks

@IndyVirmond 3 жыл бұрын

Hi, thanks so much for the tips, really helped! One question though, that doesn't work with product filters right?

@mamadoukone6839 3 жыл бұрын

Thnaks For this it's very helpful for me !

@shunoni2359 4 жыл бұрын

Thank you for this. I've been trying several expensive plugins, none of which could achieve this. Quick question - is it possible to use this method to display "top selling" products? I wasn't sure if that type of query would be supported.

@rexleop1 3 жыл бұрын

You are the best!

@phucthaifg 4 жыл бұрын

Thanks so much for this tutorial! This is applied for products, is there any way to apply for sub categories instead of products?

@phaonce407 3 жыл бұрын

Hi! Did you found any solution to apply custom loop to woo categories?

@-nzyx-7458 3 жыл бұрын

@@phaonce407 I duplicated the product archive for each category and set the condition for each product category. You can change a specific category if you go to > Query>include by>Term>your category then it should work

@mizan1148 3 жыл бұрын

@@-nzyx-7458 thank you so much this information helped me a lot. thanks!!

@ginalilydattilio928 3 жыл бұрын

Thanks so much!! This video really helped me. I'm trying to use the loop again on my product page. I have an accordion file and I want to include other products in the same category in one of the drop-down areas. I used a shortcode [product_category category="Lumina"] to pull the products into the area I want but I can't style them. Do you have any advice on how I might be able to style my products to match the product archive styling I created with custom skins as you demo'd in your video?

@andreacicali249 4 жыл бұрын

Hi Paul, I'm new to WP and I'm trying to build my first my website from scratch. Thanks for the great tutorial. I have a question, how can I deal with Product categories? Now, navigating on the category archive it display the same page with all the products? Should I build a different template for each category or is there a more streight forward way? Thanks a lot!

@pankajrakholiya5382 2 жыл бұрын

Thanks so much for this tutorial. It really helped a great deal. However, there's a challenge.

@nataliamarsab 4 жыл бұрын

Thank you! It was very useful. I have a question. Can I put a filter in the archive product? I tried to put one but it doesn't work

@TheJetchkout 3 жыл бұрын

thanks you, this very helpful to me

@imranmanan7346 3 жыл бұрын

wow this is exactly what I was looking for. thank you. I can't find the elementor custom skin pro tutorial though

@genteka5106 4 жыл бұрын

This is Clever!

@Aziz-Ahmed-UK 4 жыл бұрын

Great Tutorial. Thanks

@ryankramer 4 жыл бұрын

Outstanding. Add another appreciative comment to the pile!

@joysing7564 4 жыл бұрын

Really helpful ,thanks very much

@alixiahodge4395 3 жыл бұрын

Thanks i have the same question that Ken has is there a way to work with sub catergoies ?

@davidsots558 4 жыл бұрын

So cool ! Thank you very much! Can we make a custom skin and apply it to a posts or products slider ?

@medodoha84 4 жыл бұрын

Your videos are amazing. And I always love to follow you. I have a question. How to Create a Grid/List Toggle in WordPress Archive custom post types archive pages? Thanks sir.

@jeremyjohnson5460 4 жыл бұрын

Great video!

@mohitsandhu2842 3 жыл бұрын

thanks for making this tutorials

@silviapedrini9451 4 жыл бұрын

Thanks so much for this tutorial! can i something to allow clients to sort product by price, popularity ecc???

@alaaabdelrahim4074 4 жыл бұрын

You are awesome thank you, you saved me........

@wallerode46e 3 жыл бұрын

Hi Paul, thanks for this very interesting video. I did some testing on a shop I'm working on and it works really well. There's just one thing that's bugging me: apparently, because you're using the posts-widget, the query doesn't exclude products that are OUT OF STOCK. They are just shown without a price in the list. That's no so good. Can you think of a way to avoid that? Apart from that, great solution!

@twinfinagency3126 4 жыл бұрын

Hello WPTuts!! Thanks for the tutorial!! Amazing!! Can i make a loop for post categories, tags, search.... cause when i apply a condition to them... they just show me one product. Thank You!!

@relaxity999 3 жыл бұрын

Thanks alot for the tutorial

@connectpositivelaetitia8442 3 жыл бұрын

Thank you for this great video ! Is there a way to make it work dynamicaly when we change category ? I didn't find how to do it ! thanks a lot

@gurugugu1816 3 жыл бұрын

Excellent video. Many thanks! I´m not been able to use the categories side bar, it is not searching for the products listed in the category, do you have any idea why? thanks again

@paulmanco 4 жыл бұрын

Crack! Saludos desde Perú!

@Andrew-ji2tj 4 жыл бұрын

Very nice tutorial hopes that you add wishlist and Quickview buttons on images in your next video.

@goldenboy11788 4 жыл бұрын

Just a question... is this the way to customize your loops on your woocommerce SHOP? I'm still a bit confused between SHOP PAGE vs ARCHIVE PAGE, as I'm really looking forward to customizing my SHOP PAGE, especially with regards to how my PRODUCT LISTING will look. Anyways, I've been a follower of your channel esp when it comes to ELEMENTOR + ACF. Thanks for always making informative content like these :)

@rudyramkissoon2276 4 жыл бұрын

I totally love your tutorials, great job. I do have a problem I need help with my ecommerce website. Can u assist me?

@Mohammad-vv5ef 4 жыл бұрын

Hi, thank for your special WordPress tutorials, I've been looking for a such video to learn how to create a customized Product Archive and finally I found it but the thing is that Although I set the condition as All Product Archives but the my shop page still uses Woo-commerce default Product Archive. Please help me!

@robbie9783 3 жыл бұрын

Wao, me has salvado la vida!

@martinholmboe1179 3 жыл бұрын

This is excellent! Implemted it already. Next question: How to apply search filters to theese product loop pages ? The 'standard product filter' plug ins do not seem to work on product loop archives? Any hints?

@levigelis 3 жыл бұрын

Thank you so much for the excellent guide I encountered a problem: The Add to Cart widget automatically redirects to the product page after adding to cart I want to avoid it and find no way

@martagraugil 3 жыл бұрын

Hello!! Thanks a lot for this video!! It was really useful. I have a QUESTION: is it possible to set any kind of product filter using this option? Thank you :)

@niharikasingh280 3 жыл бұрын

Hey the whole tut is actually awesome and helped me a lot in setting up the archive template for simple products in many ways . However, when i use this method with variable product which has price variations, the result is not that great .The whole prices in the archive template seems to be attached to each other.Hence all the products takes the same prices. Any help on that front. Thanks.

@jhonbetancourt1197 4 жыл бұрын

Great tutorial. Is it possible to show the following photo of the product when I hover the cursor?

@benjaminharris943 Жыл бұрын

This video was super helpful, finally i can style my archive and product page the way i want it. However, i have one problem. whatever i search for in the searchbar, the actual results shown are always ALL products. How do i control that? With the conditions?

@creativemarketing5582 4 жыл бұрын

Thanks for video. How do I add the categories with the products into a page I want

@lifetrail_hiking_mentoring 2 жыл бұрын

Great videos Paul, I'm now having issues with the Loops I created months ago when I first watched this video. I'm having trouble accessing the Loops and it looks different in Theme Builder. Does Custom Skin no longer work with the new Elementor versions?

@modhausstudio 10 ай бұрын

Thanks so much for this video! Do you happen to have a updated tutorial on this subject?

@tinoo9030 3 жыл бұрын

Thanks for great tutorial. But is it possible to add line for product ATTRIBUTES somehow ? In Loop/text editor/dynamic there are no option for it. Or could our Custom Product Archive template integrate somehow with WooCommerce Variation Swatches plug in who has that options ? Thanks !