Return to previous page

Issue with Product Grid Display on Mobile

This topic has 6 replies, 3 voices, and was last updated 1 months ago ago by Andrew Mitchell

nachodiaz

Participant

February 21, 2025 at 21:51

Hello Team,

I’m experiencing an issue with the product grid display on mobile devices. The last column on the right is getting cut off, and users are unable to scroll horizontally to view the missing content.
We tried adjusting the layout to display only three products per row, but the issue persists. It seems that the container is oversized or misaligned, causing the products to extend beyond the screen width.

Could you please provide guidance on how to properly adjust the container width or resolve this issue?

You can see an image with the problem seen on a cell phone screen and I also attached a user in case you need to enter WordPress

Thanks in advance!

Please, contact administrator
for this information.

Files is visible for topic creator and
support staff only.

#435011 Copied Theme version: 9.4.2

5 Answers

Tony Rodriguez

Support staff

February 22, 2025 at 07:57

Hello, @nachodiaz,

Thank you for bringing this to our attention. We understand your concern regarding the inability to scroll through products on mobile devices when using the “5-column grid” or “6-column grid” layout.

This behavior occurs because mobile screens typically have limited width, which makes it challenging to display 5 or 6 columns properly. When these layouts are applied, the available space is too constrained to accommodate all columns effectively, which may result in restricted scrolling or an incomplete display of products.

To resolve this issue and provide a seamless user experience, we recommend the following:

Opt for Fewer Columns on Mobile: Use a layout with fewer columns (e.g., 2 or 3 columns) specifically for mobile devices. This ensures that the products are displayed clearly and scrolling works as intended.

If you’d like assistance in making these changes or configuring your site for optimal display on mobile, feel free to reach out to us. We’re happy to help you fine-tune your website for the best user experience.

Thank you for choosing XStore.

Best regards,
8Theme’s Team

#435033 Copied

nachodiaz

Participant

February 23, 2025 at 00:33

Please provide me with the steps to change the number of columns.

#435078 Copied

Tony Rodriguez

Support staff

February 24, 2025 at 05:31

Hello, @nachodiaz,

Thank you for your response.

To make the necessary adjustments, please follow the steps below:

1. Navigate to **XStore Builders** > **Product Archive Builder**.
2. Select **Edit Archive Template with Elementor**.
3. Proceed to **Edit Archive Products**.
4. Set the column layout for mobile devices to **2 columns**.
5. Save and update the changes.

For your reference, we have provided an image in the private content area to assist you further.

We hope this guidance proves helpful. Should you have any additional questions or require further assistance, please do not hesitate to reach out.

Best regards,
The 8Theme Team

Please contact administrator
for this information.

#435101 Copied

nachodiaz

Participant

February 26, 2025 at 17:36

Hello Team,

Thank you for your response. I believe I have followed your instructions correctly, but I did not get the expected results. I set the columns to two, but the issue persists.

Could you please assist me again by indicating if there is another way to fix this or if I might be doing something wrong?

I am attaching a video showing the result I obtained.

Best regards,

Files is visible for topic creator and
support staff only.

#435534 Copied

Andrew Mitchell

Support staff

February 27, 2025 at 14:52

Hello, nachodiaz,

After updating your theme and installing all the necessary patches, the issue appears to be resolved. Please check and confirm. Kindly remember to clear your cache.

If the problem persists, please provide us with a link to the specific page where the issue remains.

Best regards,
8Theme Team

#435651 Copied
Viewing 6 results - 1 through 6 (of 6 total)