New Landing › How can we help? › Themeforest Theme Support › Dante › Website look broken on mobile

Viewing 15 posts - 1 through 15 (of 17 total)
1 2
  • Back to forum
    Posted in: Dante
  • June 16, 2016 at 1:22 pm #275246
    Joanna
    Member
    Post count: 185

    Hello,

    I would like to kindly ask you for help. I have checked my website on mobile (Samsung S5, Chrome browser) and few pages are broken. Could you please assist how can I fix it?

    Screenshots attached with corresponding numbers.

    1. About page – text does not have line height, letters overlap. Link: http://www.varrojoanna.com/
    2. Portfolio page don’t show at all. Link: http://www.varrojoanna.com/portfolio/
    3. About page – layout is broken. Link: http://www.varrojoanna.com/about/

    Is it possible to set up custom page design for mobile view? For example if it doesn’t work so that I can set it to text or different, easier layout?

    Thank you,

    Joanna

    Attachments:
    You must be logged in to view attached files.
    June 17, 2016 at 6:56 pm #275597
    David Martin – Support
    Moderator
    Post count: 20834

    Hi,

    I do not have an actual device, I am using an emulator: http://responsivechecker.net/device/galaxy-s5

    The only error I see is no.3 which would require some custom CSS using media queries.

    – Can you clear your device cache, then re-test 1 & 2?

    Thanks.

    June 17, 2016 at 7:43 pm #275606
    Joanna
    Member
    Post count: 185

    Yes that is correct. I have managed to fix myself the issue 1 and 2 already by changing the layout.

    Issue 3, could you please help how to do that? How can I create a simple text version to be displayed on mobile instead of the complex that I have?

    Also, I have found one more problem on mobile and it is that the anchor link “Services” is not click able. Any idea why?

    Thank you for your time,

    Joanna

    June 20, 2016 at 1:16 pm #275895
    David Martin – Support
    Moderator
    Post count: 20834

    Hi,

    Depending on the complexity we can help you.

    Please test your menu link as:

    #services

    And not:

    Strategic Brand Identity Designer

    Thanks.

    June 20, 2016 at 1:29 pm #275898
    Joanna
    Member
    Post count: 185

    Wow, super! Now the anchor tag works on mobile too! Thank you very much.

    So the last problem I see on the mobile is the about page.
    Any ideas how could I resolve the layout issues?

    Thank you,

    Joanna

    June 20, 2016 at 1:32 pm #275899
    Joanna
    Member
    Post count: 185

    Sorry, now that I am testing more, I can see that #services link does not work on the menu when switching from other pages. For example when I am on portfolio page and want to click on services the link does not work anymore with this fix.

    June 22, 2016 at 10:05 am #276326
    David Martin – Support
    Moderator
    Post count: 20834

    Yes, for inner pages you set another menu which will use the full URL.

    You set this alt menu within your desired page, Meta Options => Page Meta => Page Menu.

    Thanks.

    June 22, 2016 at 10:21 am #276332
    Joanna
    Member
    Post count: 185

    Super, now all the links are working for the mobile. I have then only left the layout issue on about page.

    Thank you,

    Joanna

    June 23, 2016 at 12:01 pm #276662
    David Martin – Support
    Moderator
    Post count: 20834

    There is not an easy way to get that page to display correctly on mobile. I suggest you create a simplified mockup of what you are looking for.

    Thanks.

    June 23, 2016 at 12:10 pm #276667
    Joanna
    Member
    Post count: 185

    OK, and is it possible to keep the current look for web and set another look (simple text version) for mobile?

    Thank you,

    Joanna

    June 24, 2016 at 12:38 pm #276993
    David Martin – Support
    Moderator
    Post count: 20834

    Yes, you would need to use media queries to do this. Let us know a simplified layout of your page and we can certainly help you.

    Thanks.

    June 28, 2016 at 10:54 am #277670
    Joanna
    Member
    Post count: 185

    Hi there, thank you! I have created a kind of mobile version of the page so when someone clicks About page on mobile I would like him to see: http://www.varrojoanna.com/about-mobile

    Thank you,

    Joanna

    June 29, 2016 at 11:56 am #278040
    David Martin – Support
    Moderator
    Post count: 20834

    Hi,

    I have you setup the CSS for this and added two Row assets to the page. One for desktop, one for mobile.

    Please go here and re-size the page down: http://www.varrojoanna.com/about/

    You will need to amend and copy the mobile only content but this will show you how to do it.

    Thanks.

    June 29, 2016 at 12:14 pm #278045
    Joanna
    Member
    Post count: 185

    Hi,

    I am not sure what do you mean. Can’t we just set it somehow to show this page: http://www.varrojoanna.com/about-mobile when someone clicks on mobile on About page? I can see now I should edit this page:http://www.varrojoanna.com/about/ to achieve the mobile view? Or I can just copy to the 2 row view what I designed on this page: http://www.varrojoanna.com/about-mobile.

    I would like to keep somehow the comparison view.

    Thanks,

    Jo

    June 29, 2016 at 12:19 pm #278049
    David Martin – Support
    Moderator
    Post count: 20834

    Hi Jo,

    If you want to redirect mobile visitors to another page, you will need to look for a plugin to do this.

    You only need to edit the mobile row for the about page, it’s right at the bottom – add in your own content there. There would not be enough screensize to have a comparison view.

    Thanks.

  • Back to forum
    Posted in: Dante
Viewing 15 posts - 1 through 15 (of 17 total)
1 2

You must be logged in and have valid license to reply to this topic.

License required for one of the following items
Login and Registration Log in · Register