The display is inconsistent between the elementor and the preview.

This topic has 16 replies, 2 voices, and was last updated 8 months, 1 weeks ago ago by Tony Rodriguez

  • Avatar: Dylan
    Dylan
    Participant
    March 4, 2024 at 17:40

    I set it up in worldpress elementor, why did it change during preview?
    In addition, I found that there is always a problem with the display in mobile view.

    Files is visible for topic creator and
    support staff only.
    15 Answers
    Avatar: Tony Rodriguez
    Tony Rodriguez
    Support staff
    March 5, 2024 at 07:01

    Hello, @Dylan,

    Thank you so much for purchasing our theme and contacting our support center.

    We are writing to inform you that we require further clarification regarding your recent request. To assist you most effectively, we kindly ask that you provide a detailed description of the problem you are encountering, as well as your specific objectives or desired outcomes.

    For a more thorough examination of your settings, we would appreciate it if you could securely provide your WordPress administrative login credentials and include the URL of the page where the issue is occurring in the designated private content area.

    We kindly recommend that you take a complete backup of your site before proceeding.

    Your cooperation in this matter is greatly appreciated, and we look forward to resolving your concerns promptly.

    Warm regards,
    The 8Theme Support Team

    Please contact administrator
    for this information.
    Avatar: Dylan
    Dylan
    Participant
    March 5, 2024 at 07:47

    Thx for your assistance.

    I have four questions to solve.

    1.The text displayed in the elementor editor is inconsistent with that displayed in the view page/preview, and there are a large number of text and position errors.Currently, I’ve only edited the Home Page, so you can try to debug this page. Path: Pages-Home.

    2.About mega menu. The name of the header menu I use is: My Main Menu. And I set up a mege menu static block (My Mega Menu shop) for shop section. It cannot be displayed well. In addition, when the menu is expanded, it will disappear as long as the mouse is moved, and no links can be clicked.

    3.In the mobile interface, the mega menu cannot be used. How can I set it to display the same content as the desktop interface? Especially the display of the secondary menu. Hope you can help me set it up.

    4.Please help me set up/delete all plugins and keep only the necessary and fully compatible ones. I don’t want the speed and normal operation of my website to be affected by plug-in compatibility issues or excessive bloat.
    In addition, I need SEO\EMAIL\FORM\PRODUCT MANAGE\IMAGE MANAGE\ Alt-image optimization and other necessary plug-ins (that you trust). Please help me install and set them up.

    Please contact administrator
    for this information.
    Avatar: Tony Rodriguez
    Tony Rodriguez
    Support staff
    March 5, 2024 at 09:49

    Hello, @Dylan,

    Thank you for your response.

    1/ We are pleased to inform you that the issue you reported has been successfully resolved. Our technical team has disabled the ‘Static Block Cache’ and ‘Remove Query Strings From Static Resources’ features, which can be found under the ‘Speed Optimization’ section in the Xstore > Theme Options of your website.

    Furthermore, we have temporarily deactivated the Jetpack and cache plugins to ensure optimal performance during this adjustment phase.

    We strongly recommend that you keep the cache plugin deactivated while your site remains in development mode. This measure will help to prevent any potential conflicts or performance issues during the site construction process.
    2/ We are pleased to inform you that we have successfully implemented a CSS code update within the XStore Theme Options under the “Theme Custom CSS” section, specifically in the “Global CSS” area. This enhancement has effectively resolved the issue with the mega menu dropdown.

    Please refer to the image provided at the following link for further reference: https://imgur.com/tiSAK6G

    3/ We are writing to inform you that we have conducted a thorough investigation into the mobile mega menu issue you reported. To assess the situation, we activated the XStore parent theme on your website and are pleased to report that we did not encounter any problems. For your reference, please find an image illustrating the functioning menu here: https://imgur.com/ngS3pvd.

    Upon further analysis, it appears that the issue is isolated to your child theme. We kindly request that you consult with your site developer to review and address any discrepancies within your child theme that may be causing the problem.

    We trust that this information will be of assistance to you.

    4/ With reference to the required plugins, we kindly invite you to consult our theme documentation at the following link: https://www.8theme.com/documentation/xstore/plugins/included-plugins/.

    Additionally, you are welcome to install and utilize third-party plugins on your website that may better suit your needs. Please be advised that the use of such plugins is at your own discretion and risk.

    If you have any additional questions or concerns, please do not hesitate to reach out to us. Our support team is always available to assist you.

    Best regards,
    The 8Theme Team

    Avatar: Dylan
    Dylan
    Participant
    March 6, 2024 at 14:01

    Thank you for your help. But I still have questions about the third point.

    In my testing, whether in preview mode or testing on my phone after published, I couldn’t open the secondary menu. How can I solve this problem?

    Avatar: Tony Rodriguez
    Tony Rodriguez
    Support staff
    March 7, 2024 at 06:17

    Hello, @Dylan,

    Thank you for your response.

    We are pleased to inform you that the technical issue you reported has been successfully resolved. To ensure that the changes are reflected on your end, we kindly ask that you clear your browser’s cache before revisiting your site.

    Our team has implemented the necessary modifications to the CSS code within the Theme Options > Theme Custom CSS > Global CSS section of your website’s administrative panel. These adjustments have addressed the concern you brought to our attention.

    For your convenience, we have included an image as a reference to guide you through the changes that were made. https://imgur.com/KTp6Pxw

    Should you require any further assistance or have additional questions, please do not hesitate to reach out to us.

    Best Regards,
    The 8Theme Team

    Avatar: Dylan
    Dylan
    Participant
    March 7, 2024 at 13:11

    Thank you for your assistance. But when I checked this modification, I still found some problems.

    1. In the mobile interface and desktop interface, the main menu-secondary menu can be displayed well. But it shows an error on the tablet.
    2. The secondary menu can be displayed normally on the normal menu, but an error is displayed on the sticky header menu.
    3. Please tell me how to adjust the font size and margin of the secondary menu under different adjustment interfaces…

    Files is visible for topic creator and
    support staff only.
    Avatar: Tony Rodriguez
    Tony Rodriguez
    Support staff
    March 7, 2024 at 14:08

    Hello, @Dylan,

    Thank you for your response.

    1/ & 2/ We are pleased to inform you that we have conducted a thorough review of your website on an actual tablet device, and we are happy to report that it is functioning correctly. For your reference, we have attached an image that illustrates the website’s performance on the tablet. https://imgur.com/u4NJjYJ & https://imgur.com/1tOwmHT

    We kindly advise that for the most accurate assessment of your website’s responsiveness and functionality, it is essential to perform checks on real tablet devices rather than relying solely on the responsive mode available in browser inspection tools.

    We trust that this information will be of assistance to you.

    3/ We would like to inform you that it is possible to modify the font size and margin of the secondary menu by applying custom CSS code across various interface adjustments.

    To assist you more effectively, we kindly request that you provide us with a screenshot clearly indicating the specific changes you wish to implement or a visual representation of your desired outcome. This will enable us to review your requirements and supply you with the appropriate CSS code to address your issue.

    Thank you for your cooperation.

    Best regards,
    The 8Theme Team

    Avatar: Dylan
    Dylan
    Participant
    March 7, 2024 at 15:31

    Thx for your help.
    I actually checked the menu and it looks well.

    As for the third question mentioned above, I would like to ask how to use css code to adjust the spacing between the two banners, as well as their size and position? (I have attached the image)

    In addition, I still have a few questions about the product page.

    1. How should I create a complete set of product pages efficiently? Such as necklace page, earring page… What is its workflow?
    2. Currently, I use xstore builder to create a product archive page, and set the display conditions to: include – all product archives. I think this page is a good template, what should I do next?
    3.Should I use xstore builder to create a single product page again? …

    Files is visible for topic creator and
    support staff only.
    Avatar: Tony Rodriguez
    Tony Rodriguez
    Support staff
    March 8, 2024 at 06:28

    Hello, @Dylan,

    Thank you for your response.

    Regarding the third question mentioned, We would like to inform you that the utilization of CSS code is not necessary for the adjustments you are seeking to make. You have the capability to modify the spacing, size, and positioning of the two banners by editing the pertinent static block within the Elementor plugin. For your convenience, we have included reference images to guide you through this process.

    https://pasteboard.co/2iFHLGm5VJlY.png

    https://pasteboard.co/tgsZyDjHmBHL.png

    https://pasteboard.co/n7FtpNKnSbGM.png

    We hope you find this information helpful.

    1/ & 3/ We are pleased to inform you that you can efficiently create a comprehensive suite of product pages using the XStore builders. Our Single Product Builder, integrated with Elementor, is designed to cater to your specific requirements. For detailed guidance, please refer to our documentation: [XStore Single Product Builder with Elementor](https://www.8theme.com/documentation/xstore/xstore-builders/xstore-single-product-builder-with-elementor/).

    Furthermore, we invite you to explore our prebuilt demo sites for inspiration and reference:

    – [Gold Earrings Demo](https://xstore.8theme.com/elementor/demos/wedding/product/gold-earrings/)
    – [Italian Gold Over Sterling Silver Demo](https://xstore.8theme.com/elementor/demos/jewellery/product/italian-gold-over-sterling-silver/)
    – [Diamond Necklace Demo](https://xstore.8theme.com/elementor/demos/niche-market04/product/diamond-necklace/)
    – [Delicate Birthstone Studs Demo](https://xstore.8theme.com/elementor2/luxury-jewelry/product/delicate-birthstone-studs/)

    2/ It sounds like you’ve successfully created a product archive page using the xStore builder and set the display conditions to include all product archives. If you’re satisfied with the template and layout, here are some next steps you might consider:

    Customize Content:

    Add engaging and informative content to your product archive page. This could include a catchy headline, product descriptions, and any relevant information for your customers.

    Configure Filters and Sorting:

    If your product archive page contains a significant number of items, consider implementing filters and sorting options. This allows users to easily find what they’re looking for and enhances the overall user experience.

    Regularly Update Content:

    Keep your product archive page fresh by regularly updating content, adding new products, and removing outdated information.

    Remember to continually monitor the performance of your product archive page and make adjustments based on user feedback and analytics data. This iterative process can help you optimize the page for better conversion and user satisfaction.

    We hope this helps. We kindly request that when you have a new issue, please initiate a separate topic for each one on our support forum. This practice helps prevent any inconvenience and ensures that you receive a prompt response for each individual query.

    If you have any additional questions or concerns, please do not hesitate to reach out to us. Our support team is always available to assist you.

    Best regards,
    The 8Theme Team

    Avatar: Dylan
    Dylan
    Participant
    March 11, 2024 at 17:40

    When my website went online, it was very slow and the website score was only 30 points.

    Please help me fully check whether the code is work well so that I can determine whether it is due to a server problem.

    Thx a LOT!

    Avatar: Tony Rodriguez
    Tony Rodriguez
    Support staff
    March 12, 2024 at 05:56

    Hello, @Dylan,

    Thank you for contacting us and for using XStore.

    Website speed depends on various factors that we do not control. What we can do is share the links that can help you with speed optimization: https://www.8theme.com/documentation/xstore/troubleshooting/how-to-speed-up-my-website/

    Every additional plugin slows down the site a bit, so we would recommend you disable unrequired plugins.

    We are writing to address the issue you have been experiencing with your website’s slow loading speed. After conducting a speed test on your website via GTmetrix, we have found that the performance is suboptimal. You may review the results at the following link:
    https://gtmetrix.com/reports/jojokiki.com/iezEmELW/

    We recommend that you review the suggestions provided by GTMetrix in the Top Issues list, accessible here: https://imgur.com/FUx8sBv & https://imgur.com/jt4W6vJ

    About your results on gtmetrix results:

    – Reduce initial server response time: https://gtmetrix.com/reduce-initial-server-response-time.html

    -–Avoid an excessive DOM size – read these posts about DOM https://docs.wp-rocket.me/article/1412-avoid-an-excessive-dom-size
    https://isotropic.co/avoid-an-excessive-dom-size-on-your-wordpress-website/
    Edit your page and Product elements. It should reduce the DOM structure. Also, you may try to reduce the DOM results on the page by reducing the number of sections of the page/elements in the footer or header;

    –Properly size images: https://gtmetrix.com/properly-size-images.html

    — Avoid chaining critical requests: https://gtmetrix.com/avoid-chaining-critical-requests.html

    –Use explicit width and height on image elements: https://gtmetrix.com/use-explicit-width-and-height-on-image-elements.html

    – Use any a Content Delivery Network (CDN), it can give an equally fast web experience to your users across the globe. We use CDN on our demos.

    For further guidance on how to improve your website’s speed, we invite you to review our theme documentation. The following links provide detailed information on this topic:

    1. https://www.8theme.com/documentation/xstore/theme-installation/main-theme-options/
    2. https://www.8theme.com/documentation/xstore/troubleshooting/how-to-improve-wp-rocket-settings-with-xstore/

    For a comprehensive understanding of the specific issues that may be affecting your website’s speed, we suggest conducting a website speed test with GTMetrix. This tool can provide you with actionable recommendations to further enhance your website’s performance.

    We trust that you will find this information useful in improving your website’s performance.

    We trust that this guidance will be of assistance to you. Should you require any further support, please do not hesitate to reach out to us.

    Best regards,
    The 8Theme Team

    Avatar: Dylan
    Dylan
    Participant
    March 13, 2024 at 13:52

    I have partially resolved this issue by using relevant optimization plugins. Thank you for your assistance.

    But when I want to use Yoast for SEO optimization, it doesn’t run well. Display “Error parsing the response to JSON.”

    what should i do?

    Files is visible for topic creator and
    support staff only.
    Avatar: Tony Rodriguez
    Tony Rodriguez
    Support staff
    March 13, 2024 at 14:03

    Hello, @Dylan,

    1/ Could you please check how it works with default WordPress themes like (Storefront) to understand is it our theme issue or not?

    Looking forward to collaborating with you.

    Additionally, we strongly advise that you create a complete backup of your website before making any changes. This precautionary measure is to ensure the safety and integrity of your data.

    2/ Please read official documentation of the yoast plugin: https://yoast.com/help/we-couldnt-complete-the-optimization-of-your-seo-data/

    We hope this helps.

    Best regards,
    The 8Theme Team

    Avatar: Dylan
    Dylan
    Participant
    March 13, 2024 at 16:37

    Yes, it appears the issue was indeed related to the theme. I switched to the “Storefront” theme, and the Yoast SEO DATA OPTIMIZATION worked flawlessly. Upon switching back to the Xstore theme, to my surprise, the Yoast SEO DATA OPTIMIZATION also functioned perfectly! It seems like the problem has been unexpectedly resolved, but I’m not certain if there was a code conflict initially. If possible, could you check the code status to ensure it hasn’t been compromised?

    Additionally, I’m a bit concerned because I activated the Storefront theme through Appearance > Theme and then reactivated the Xstore Theme. My website looks the same as before, but I’m unsure if this process was correct or if it might lead to unknown issues.

    Avatar: Tony Rodriguez
    Tony Rodriguez
    Support staff
    March 14, 2024 at 05:31

    Hello, @Dylan,

    1/ Thank you for reaching out and updating us on your recent experience with the themes. We are glad to hear that switching between the “Storefront” and “Xstore” themes seems to have resolved the issue with Yoast SEO DATA OPTIMIZATION. It might be a cache issue on your end not a code conflict initially.

    2/ As for your process of activating and reactivating the themes, it’s perfectly fine to do so through the Appearance > Themes section of your WordPress dashboard. WordPress is designed to handle theme changes smoothly, and your website appearing as it did before indicates that the transition was successful. However, if you notice any unexpected behavior or encounter any issues in the future, please don’t hesitate to reach out to us for assistance.

    Once again, thank you for bringing this to our attention, and please feel free to contact us if you have any further questions or concerns. We’re here to help.

    Kind Regards,
    8theme team

  • Viewing 16 results - 1 through 16 (of 16 total)

You must be logged in to reply to this topic.Log in/Sign up

8theme customization service
We're using our own and third-party cookies to improve your experience and our website. Keep on browsing to accept our cookie policy.