Mobile site – products not appearing properly

[leapb4ulook]

Hi

I’m having an issue with the mobile version of my site. The producst have started to show side-by-side, rather than as one product spanning the width of the device. Can you advise what may be wrong?

Also, very recently, my revolution slider was appearing right below my homepage menu (the same as in your demo site) but now it has moved down and won’t span the width of the screen no matter what settings I choose. Do you know if this is something to do with the theme? Any advise you can give would be hugely appreciated.

Thanks
Amy

Attachments:

You must be logged in to view attached files.

[Kyle – SUPPORT]

Hi

This page? http://timelessluxuryonline.co.uk/browse-our-collection

– Kyle

[leapb4ulook]

Hi Kyle

That’s right, plus on http://timelessluxuryonline.co.uk/pre-owned-rolex-datejust and /second-hand-rolex-precision.

The products appear fine on the home page. I have a feeling it’s to do with the WPBakery Visual Composer plugin but can’t be sure.

Amy

[Kyle – SUPPORT]

Some pages you are using the page builder, some you’re using visual composer, you can’t use both. You also need to make sure the editor is enabled, rather than the classic editor

– Kyle

[leapb4ulook]

Thanks Kyle. I’ve changed all product pages to visual composer and enabled the editor (nto classiceditor). This hasn’t fixed the problem. Do you mean ALL pages of my site?

[leapb4ulook]

Thanks Kyle. I’ve changed all pages to visual composer and enabled the editor (not classic editor). This hasn’t fixed the problem. My home page producsts are now also displaying incorrectly. Can you adise any futher? Your help is hugely appreciated!

[Nishant – SUPPORT]

Hello leapb4ulook,

I saw your homepage. The products are displayed in a carousel. How do you want to display them?

[leapb4ulook]

Hi Nishant

Home page is fine, the problem is showing on the following page on mobile devices /pre-owned-rolex-datejust

Thanks for looking at it! Any ideas?

[Nishant – SUPPORT]

Check it now http://timelessluxuryonline.co.uk/pre-owned-rolex-datejust

Is that the way it should look?

Let us know.

[leapb4ulook]

That looks much, much better, Thank you, Nishant. I was hoping it would display like it does on the attached. Do you know if this is possible and if not can you tell me what the fix
is for the way it is now?

Thanks again,

Attachments:

You must be logged in to view attached files.

[Mohammad – SUPPORT]

Hi,
Please use this custom css code:-

@media only screen and (max-width: 479px) {

body .woocommerce-shop-page ul.products li.product, body .product_list_widget > div > ul.products li.product {
    width: 100% !important;
}

}

Thanks
Mohammad

[leapb4ulook]

Thanks Mohammad. I’ve added that in WPadmin (my filezilla FTP won’t connect for somereason and I’ve been locked out of it for months). Does the way I’ve added it to you look right, see attached? The mpbile product pages still look woring on a couple of pages. I’m not a developer so my knowledge is very limiteed.

Thanks foe your help!

Amy

Attachments:

You must be logged in to view attached files.

[Mohammad – SUPPORT]

Hi,
Please change & gt; with > at css code.
Thanks
Mohammad

[leapb4ulook]

Thanks Mohammad, I really appreciate the support. I have repaced that rogue code, apologies for not noticing it in the first place. I’ve added it to the style sheet, see attached image, and it hasn’t made a difference to how the products view on mobile. The black wishlist box is pretty much covering the product images.

Are you able to advise any further on this? Ideally the products would appear the full width on moble and be stacked (rather than carousel) as it’s easier to go up and down with your thumb when browsing.

Thanks
Amy

[leapb4ulook]

Hi again

I have just updated to Neighborhood 3.10 and the mobile appearance has got worse, see attached. As mentioned above, I need the products to appear the full width and either caroselling or stacked.

Attachments:

You must be logged in to view attached files.