Home Forums WoodMart support forum Mobile browser image positions

Mobile browser image positions

Viewing 10 posts - 1 through 10 (of 10 total)
  • Author
    Posts
  • #623958

    tyu
    Participant

    When I activate the “show desktop” feature of the mobile browser, there is an error in the image positions. I sent the screenshot, this error does not occur on your demo theme page. However, I did not make any changes in the elementor settings.

    #623961

    tyu
    Participant

    screnshot:

    Attachments:
    You must be logged in to view attached files.
    #624280

    Luke Nielsen
    Keymaster

    Hello,

    On my side it works well, here is a screenshot

    Try to clear the browser cache and recheck the issue.

    Kind Regards

    • This reply was modified 4 days, 17 hours ago by Luke Nielsen.
    #624369

    tyu
    Participant

    Question 1:
    When show desktop is active, it still stays in mobile site view.
    I cleared the cache and tried on different devices.
    It shows as a mobile site up to a certain resolution.
    It is already the same on your demo site.
    Is there any way to adjust this?

    Question 2:
    The distortions I sent screenshots of continue.
    There is no distortion on the demo site.

    #624376

    tyu
    Participant

    sizing works very well on your demo site.
    but it doesn’t work properly on the site.
    I think you added codes for these
    Because elementor only allows us to enter 3 size options.

    I shared a screen recording with you

    #624861

    Luke Nielsen
    Keymaster

    Hello,

    1. Send some screenshots of where the mobile view is shown on the Desktop.

    2. I see the normal quality of the image on your side, or do you mean that the image is cutted?

    3. Adjust the sizes as described in our article – https://xtemos.com/docs/woodmart/faq-guides/image-size-content-alignment-product-grid/

    Kind Regards

    #624898

    tyu
    Participant

    The question is clear in the video I sent in my last message.
    Images are distorted on different screen sizes.
    I already sent you a video and screenshots.
    my question has nothing to do with your proposed solutions.
    I sent again video and screenshots.

    #625007

    Luke Nielsen
    Keymaster

    Hello,

    Send me access to the admin panel so I can check the site settings and investigate it more deeply.

    Thank you in advance.

    Kind Regards

    #625181

    tyu
    Participant

    Hi,

    I’m simply asking the question again.

    The images on the home page on your demo site work properly on different screen sizes. (Rendered size) (I also sent this video)

    But on the site I use, the images on the home page do not work properly on different screen sizes.

    I explained all of these with videos and screenshots.

    If you do not have the competence to answer, please direct someone who is knowledgeable about the subject.

    I didn’t change the theme settings, I mentioned that at the beginning.

    Thanks.

    #625430

    Bogdan Donovan
    Keymaster

    Hello,

    Difference in Width. In your response with the video (https://xtemos.com/forums/topic/mobile-browser-image-positions/#post-624376), you compared your site to our demo at the same screen widths, noting differences in column widths and image sizes. Our demo site does not have any customizations that affect column positioning. The main reason why your site cannot be directly compared to ours is that our demo was initially created using the first page builder supported by our theme, WPBakery, while you are using Elementor. WPBakery and Elementor have different breakpoints for positioning content on mobile devices, such as tablets and smartphones, making it impossible to achieve an exact match.

    By default, Elementor has 3 breakpoints (screenshot: https://monosnap.com/file/mADnGU4jBVKxpAM29wu3ZmlcyuKeo1):
    • Desktop: Screen width 1025px and above
    • Tablet: Screen width between 1024px and 769px
    • Mobile: Screen width 768px and below

    WPBakery, by default, has 4 breakpoints (screenshot: https://monosnap.com/file/doniyPfwe3O10ix0eVYyyCpCmHsNpW):
    • Desktop: Screen width 1200px and above
    • Tablet Landscape: Screen width between 1199px and 992px
    • Tablet Portrait: Screen width between 991px and 769px
    • Mobile: Screen width 768px and below

    As described above, by default WPBakery offers more options for screen widths, especially for tablets, and allows multi-column layouts at smaller resolutions (992px–1024px) compared to Elementor. These breakpoint settings are integral to their respective page builders, and we cannot modify them through the WordPress theme. Changing these defaults could break their functionality and make it impossible to support future updates.

    Difference in Height. The height difference is due to the banner elements containing the images having different background image settings on our WPBakery demo (and WPBakery content import).
    • In WPBakery, the banner size is directly determined by the image’s aspect ratio.
    • In Elementor, the “Fixed height” option is enabled, making the banner height depend on a manually set value, with the background image stretched relative to that height.
    To replicate the WPBakery demo in Elementor, go to the banner settings, select the Content tab, navigate to the Background section, and disable the “Fixed height” option (screenshot https://monosnap.com/file/nRrmskhLwrr5V05lkRmybHQiX55P1C).

    Kind Regards

Viewing 10 posts - 1 through 10 (of 10 total)