Viewing 3 posts - 1 through 3 (of 3 total)
  • Author
    Posts
  • March 23, 2017 at 9:25 pm #765748
    alliancepp

    Hello Support. Can you help me with this…
    I’m showing this page on my desktop (looks great but doesn’t respond well on mobile): http://www.westcotthomes.com/find-your-home/
    Question…is there a way to show/redirect to a different page/url for mobile/tablet users only. I could then create a simple text listing with links.

    Thanks for your help!

    March 23, 2017 at 9:32 pm #765753
    kevinmcgillivray

    I can’t directly answer your question (although I don’t think you can do this without server-side software sensing what client is accessing the site) but I can say that I’ve done this sort of thing by creating sections on the same page where one only displays above a given width and the other only displays below that given width. The first section includes the fancy desktop version while the second section includes the simplified version. You might give this a try. I’ve had to do this with sliders that looked horrible on mobile.

    Hope this helps…

    March 24, 2017 at 4:09 am #765837
    Nikko

    Hi,

    You can do this by adding 2 menu items for Find Your Home (one to show on desktop and hidden on mobile, the other one shows on mobile and hidden on desktop). To add class on menu item, check this post: http://presscustomizr.com/snippet/adding-css-classes-wordpress-menu/
    On you desktop link put this class show-desktop and for mobile show-mobile. Then add this css code in Quick CSS (located in Enfold > General Styling):

    .show-mobile {
  display: none !important;
}

@media only screen and (max-width:767px) {
  .show-mobile {
    display: block !important;
  }

  .show-desktop {
    display: none !important;
  }
}

    Hope this helps :)

    Best regards,
    Nikko

  • Author
    Posts
Viewing 3 posts - 1 through 3 (of 3 total)
  • You must be logged in to reply to this topic.