Home / Forums / DynamiX Support / Help with the Mobile view

Viewing 9 posts - 1 through 9 (of 9 total)
  • Author
    Posts

  • prasadshivangi
    Participant

    Hi Edcel,

    We were doing the testing on mobile devices and we figured that the mobile view of the website is totally distorted. Is there any way this can be fixed? Actually, the menu is also appearing in the most bizarre way and anyone opening the website on the mobile will not be able to understand anything because the items in the menu are totally distorted. I am attaching a few screenshots below for your consideration and advice:

    The view of the website is fine on a tab, this is the view from an android phone. Both these screenshots are from the homepage: http://www.creativeflu.com


    In case you are unable to open these, these are also in the media library by the name of :
    screenshot_20160929-225416
    screenshot_20160929-225457

    Do let me know if anything can be done about it. Many thanks.
    Shivangi


    prasadshivangi
    Participant
    This reply has been marked as private.

    Hi Shivangi,

    You actually applied a 230px margin for that text block. This is why the text looked really bad on mobile as it had to apple the margin. I removed the margin and the text now looks better on mobile.

    I have added CSS to fix the mobile menu color as well.

    Can you please check if everything looks good from your end?

    Thanks!@


    prasadshivangi
    Participant
    This reply has been marked as private.

    Hi Shivangi,

    For the homepage text on my previous reply, can you not break the paragraph into 2 parts? That’s the easiest way around that I think so it is occupying to much width.

    1) For https://www.creativeflu.com/customize-clothes/, this is indeed caused by the left and right margin you added. Removing it fixes mobile and the dektop version of the page does not actually look bad. It looks wider, but it definitely doe not look bad.

    If you want the center column where all the text are enclosed to be narrower, then change the column width under Column Settings > Responsive options. This will make sure that your site is responsive on mobile and looks good on desktop without using margins.

    2) The button and image should be fixed now. The issue was caused by the margins and alignment you set. I set alignment to center, removed the margins and set 4 columns. Now they are more responsive on mobile

    3) For the search box, I do not see the issue from my end. The search box does appear for a short while, but it actually disappears once the site completely loads. The search should appear in the mobile menu if you click on it.

    Thanks!


    prasadshivangi
    Participant
    This reply has been marked as private.

    The shopping cart appearing on mobile is likely an issue with their cache/device. It is very unlikely that it will appear on mobile since the code for the shopping cart is moved to the menu and disabled on the dock area once it detects that it is opened on a mobile device. To make sure, I have added another CSS that will hide it on mobile since it is already under the menu.

    For the logo, I am not sure what you are referring to as the issue since the logo looks fine from our end. Can you please send over a screenshot of how it looks from your end?

    Thanks!


    prasadshivangi
    Participant
    This reply has been marked as private.

    Hi Shivangi,

    In my opinion, the logo’s current size on mobile is perfect. It is only becoming an issue because of the background you are using. If you make it really small so it does not cove the woman on the background image, it will not look good at all.

    If you want to see how it looks, you can try to use this CSS:

    @media screen and (max-width: 480px) {
    #header-logo img {
        width: 50% !important;
    }
    }

    Thanks!

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

You must be logged in to reply to this topic.