Return to previous page

Need Mobile Design Tutorial for XStore Theme

This topic has 10 replies, 3 voices, and was last updated 2 months ago ago by Jack Richardson

BINOD rajak

Participant

June 13, 2026 at 14:14

Hello XStore Support Team,

I am using the XStore theme for my e-commerce website. I am happy with the desktop design, but I feel that my website’s mobile version does not look as good as I want.

I would like to improve the mobile layout and make it more professional.

Do you have any video tutorials, documentation, or guides specifically for designing and customizing the mobile version of XStore?

Please share any helpful resources so that I can properly optimize my website for mobile users.

Thank you for your support.

#471215 Copied

9 Answers

Ayan Rahman

Support staff

June 15, 2026 at 04:18

Hi,

Thank you for reaching out to us.

These articles will help you – https://elementor.com/help/mobile-editing/ https://elementor.com/blog/responsive-website/ https://elementor.com/academy/responsive/ https://elementor.com/academy/elementor-responsive-101-all-you-need-to-know/

Warm Regards,
The 8Theme Team

#471228 Copied

BINOD rajak

Participant

June 15, 2026 at 12:10

Hello 8Theme Team,

Thank you for your response.

However, my issue is not related to Elementor responsive editing. My Shop and Product Category pages are not built with Elementor; they are using the default XStore WooCommerce archive layout.

The mobile product cards look different from the desktop version. For example, a “Show Details” button appears only on the mobile frontend, but I cannot find any setting to control or disable it in XStore Theme Options.

Please guide me on:

How to fully customize the XStore default mobile shop/product archive layout.
How to remove the “Show Details” button from mobile product cards.
Which XStore settings control mobile product card elements and layout.

Thank you.

#471253 Copied

Jack Richardson

Support staff

June 15, 2026 at 13:46

Hello @BINOD rajak,

We have checked your shop and do not see any “Show details” buttons in the mobile layout. Please note that the design provided in our theme is automatically styled for mobile devices, and there are no built-in settings available to modify the mobile layout.

If you would like to explore more customization options, we recommend using our built-in Archive Products Builder (https://www.8theme.com/documentation/xstore/xstore-builders/xstore-products-archive-builder-with-elementor/), which includes pre-built templates that can be imported through XStudio.

If you prefer to continue using the current layout for your shop archives, the only way to make changes to the mobile view is through additional customization in your child theme or by applying custom CSS. If you still need our assistance, please, attach some screenshots for your questions.

Best regards,
Jack Richardson
The 8Theme’s Team

#471257 Copied

BINOD rajak

Participant

June 16, 2026 at 12:36

Hello Jack Richardson,

Thank you very much for your reply and for checking my website. Your explanation was very helpful, and I appreciate your support.

Regarding the “Show details” button, I would like to clarify that it was appearing on my mobile shop page before. When users clicked on the “Show details” button, it was redirecting them to the login page. After I reported this issue and made some changes, the “Show details” button is no longer visible, which is why you could not find it during your inspection.

I am attaching some previous screenshots showing the issue and the mobile product design problems I experienced, including the “Show details” button and the current design issues such as duplicate Add to Cart buttons.

Thank you again for your valuable assistance and support. Your previous reply was very helpful to me.

Best regards,
BINOD RAJAK

Files is visible for topic creator and
support staff only.

#471294 Copied

Jack Richardson

Support staff

June 16, 2026 at 14:16

Hello @BINOD rajak,

This button appears when the Catalog Mode setting is enabled on your website. You can verify this in Theme Options → WooCommerce → Shop → Catalog Mode. Additional configurations are also available within the Catalog Mode settings.

Best regards,
Jack Richardson
The 8Theme’s Team

#471304 Copied

BINOD rajak

Participant

June 17, 2026 at 14:58

Subject: Elementor Shop Page Design Looks Different on Live Website

Hello Jack,

Thank you again for your previous support. Your response was very helpful and I appreciate your assistance.

I am facing another issue with the shop page design and would like your guidance.

I created and customized my shop/archive products layout using Elementor Products Grid. Inside Elementor Editor, the design looks clean, professional, and properly aligned. However, after viewing the live website, both desktop and mobile layouts look completely different from the Elementor preview.

Some issues I noticed:

Product cards are not aligned properly.
Product titles are breaking the layout and creating uneven card heights.
Buttons are not positioned consistently.
Large empty spaces appear on the shop page.
Mobile product cards look very different from the Elementor editor preview.
The final frontend design does not match what I designed in Elementor.

I have attached screenshots showing:

Elementor Editor Preview
Mobile Preview inside Elementor
Actual Desktop Shop Page
Actual Mobile Shop Page

Could you please check whether XStore Archive Products Builder, WooCommerce Shop settings, or any theme option is overriding the Elementor Products Grid layout?

I would greatly appreciate your advice on how to make the live shop page match the Elementor design exactly.

Thank you for your support and assistance.

Best regards,

Binod Rajak
UPGRADE
https://uupgrade.in/

Files is visible for topic creator and
support staff only.

#471317 Copied

Jack Richardson

Support staff

June 18, 2026 at 12:03

Hello @BINOD rajak,

The issue may be related to your LiteSpeed Cache plugin. In the editor, the cache does not apply, while on the live page, a cached version may display outdated styling or missing elements. Could you please clear the cache in the plugin or temporarily disable it and then check the result?

If you still require our assistance, please provide temporary wp-admin access in the private content section, in case you have changed it since the last time you shared it with us.

Best regards,
Jack Richardson
The 8Theme’s Team

#471336 Copied

BINOD rajak

Participant

June 21, 2026 at 12:30

Hello 8Theme Support Team,

I hope you are doing well.

Thank you for your previous support and assistance.

I have been working on my website according to your recommendations and recently spent a significant amount of time optimizing LiteSpeed Cache and improving the website design.

However, I am facing a few issues and would appreciate your guidance.

1. LiteSpeed Cache Delay

After making design changes, I clear the LiteSpeed Cache regularly. The problem is that the cache does not seem to clear immediately.

In many cases, it takes approximately 3–4 hours before I can see the updated version of the website on the live frontend.

This makes website development very difficult because I cannot immediately verify whether my changes are working correctly.

Could you please check if there are any recommended LiteSpeed Cache settings that work best with the XStore theme?

If necessary, I can provide temporary WordPress admin access and would greatly appreciate it if your team could review and configure the cache settings for optimal compatibility with XStore.

2. Homepage Mobile Layout

I have successfully fixed most of the issues on my Shop Pages and Product Pages.

However, while designing the Homepage, I am still experiencing several mobile layout inconsistencies between the Elementor editor and the live website.

Could you please review the homepage settings and verify whether any XStore settings, responsive options, or theme styles are affecting the mobile layout?
3. Elementor Pro vs PRO Elements Plugin

I am currently using both:

Elementor Pro
PRO Elements Plugin

I would appreciate your recommendation regarding the best setup.

Would you recommend using Elementor Pro only, or should I continue using PRO Elements as well?

My goal is to keep the website stable, compatible with the XStore theme, and optimized for the best possible performance.

Since my website does not load as fast as I would like, I would appreciate your advice on which setup would be better for speed, compatibility, and long-term maintenance.

Thank you very much for your time and support.

Best regards,

Binod Rajak
UPGRADE
https://uupgrade.in/

#471392 Copied

Jack Richardson

Support staff

June 22, 2026 at 06:05

Hello @BINOD rajak,

1. With all due respect, as the issue is related to the LiteSpeed Cache plugin, we kindly ask you to submit your request to their plugin support team. They will be able to assist you with the cache clearing delay, as our support is limited to our own products.

2. In accordance with Envato’s privacy policy, we do not provide additional customizations or manual configurations on customers’ websites. However, if you need assistance with the configuration of a specific widget or element, please provide us with screenshots or a short video, and we will review the issue to suggest possible solutions.

3. Elementor PRO is a paid version that offers additional features for the Elementor plugin, while PRO Elements is a free, community-maintained project designed to add professional features typically found in premium plugins and add-ons for websites built with Elementor. Please note that PRO Elements does not include templates, template kits, or support services, which are available with Elementor PRO. Since you are already using Elementor PRO, we recommend disabling the PRO Elements plugin to avoid potential conflicts between the two. If you encounter any issues, you can safely enable PRO Elements and disable Elementor PRO as needed.

Best regards,
Jack Richardson
The 8Theme’s Team

#471396 Copied
Viewing 10 results - 1 through 10 (of 10 total)