Tagged: ,

Viewing 5 posts - 1 through 5 (of 5 total)
  • Author
    Posts
  • July 5, 2016 at 1:15 pm #657027
    marienlely

    Hi all,

    I’ve searched for it but not sure if it’s been done. I have a work page using a parallax plugin for desktop versions. However, the parallax images aren’t responsive and don’t scale well for mobile screens.

    My question is: When viewed at a certain size (like mobile screens) can I call up a different page in place of the page used for my work page.

    What I want to do is replace my work page with a simple masonry gallery for mobile screens. Or even keep the page, but replace all content with a masonry gallery when on mobile.

    My work page: http://marienlely.com/work

    I would like to replace it with a masonry gallery. An example of a gallery I already have is shown at the bottom of my homepage. This shows all my work links, but in condensed masonry gallery form.

    Home page: http://marienlely.com/

    Another solution could be removing the work link from mobile and just showing the home page. Since the masonry gallery is already here I can use that as my work mobile page as well. I would prefer option 1 though if possible.

    let me know if this is possible. Thank you!

    July 5, 2016 at 1:57 pm #657044
    Vinay

    Hey marienlely,

    When viewed at a certain size (like mobile screens) can I call up a different page in place of the page used for my work page.

    It can be done using jQuery but at the moment there is no simple solution or a snippet for this you need hire a freelancer to get this done.

    Best regards,
    Vinay

    July 5, 2016 at 1:59 pm #657048
    marienlely

    Thanks for the response Vinay. What about just excluding the page when viewed at a certain size?

    July 5, 2016 at 11:56 pm #657296
    Vinay

    Hi,

    It’s not possible to exclude the page but you can hide the contents of the page if this is something that help please try adding this code to the Quick CSS section under Enfold > General Styling or to your child themes style.css file:

    In the below code replace the page id with the actual page id class name of the page which you like to hide. Right click and inspect the body element to get the page ID.

    @media only screen and (max-width: 767px) {
	.page-id-XXX {
		display: none !important;
	}
}

    Best regards,
    Vinay

    July 6, 2016 at 10:19 am #657362
    marienlely

    Vinay, thanks! Works perfect.

    For anyone finding this thread I made mine to include landscape Ipad minis as well. I also included a piece of code to remove it from my nav list with this:

    /* — 1. REMOVE WORK MOBILE — */

    @media only screen and (max-width: 1024px) {
    #menu-item-MENU ITEM NUMBER HERE { display: none !important; }}

    @media only screen and (max-width: 1024px) {
    .page-id-PAGE NUMBER HERE { display: none !important; }}

  • Author
    Posts
Viewing 5 posts - 1 through 5 (of 5 total)
  • The topic ‘Replace a page for a desktop view with page for mobile view’ is closed to new replies.