Make WooCommerce 'Products' and 'Product Archive' elements look the same in mobile view

[matmurray]

Hi everyone,

First post here, and I'm hoping you lovely people can help me!

I'm using Elementor Pro to build my WooCommerce store, but I'm having some troubles making it look like I want. Hopefully some of you can help!

On my main store page, there's a 'Products' element which lists all products, and includes a product sorting dropdown menu:

https://imgur.com/4UR3Tom

On my single product template, I can only add a 'Product Archive' element, which lists products:

https://imgur.com/P16JXV4

here's a link: thecomputergameshow.com/store/banner-tee/

I want the products element on my main store page to look exactly like the element on the Single Product template (second image) in terms of image size, spacing, etc (without the sorting dropdown) but I can't seem to do it.

Is there a way of making these two looking identical?

This query is only for mobile view btw; the elements are fine on desktop.

Thanks!
Mat.

 

[markdaps]

When I built my shop, I made the shop page, single product and product archive pages from scratch.

Also created some global widgets so that I could reuse them and maintain the same style throughout the shop.

If you need complete control over design, then I find that the best way.