I want to make a different front-page and show it to the mobile user, instead of the one used on desktop.

In detail, right now we have set our site to show desktop-front-page to user, when he lands on www.domain.com. Now, I want to make a different front-page (mobile-front-page) which can be served to the user coming from mobile. Is that possible? Any ideas?

PS. I looked into wp_is_mobile() but that seems to send mobile user to a URL you specify. What I actually need is that user should land (and remain) on www.domain.com, but instead of the desktop-front-page, the mobile-front-page should be served.


Switching the actual template file could work in the same way as above using get_template_part().

For example...

if ( wp_is_mobile() ) { // If it is a mobile device

get_template_part( 'mobile-front', 'page' );

} else { // If it is not a mobile device

get_template_part( 'desktop-front', 'page' );

} // end wp_is_mobile()

To take this a step further...

You could add a filter on template_include to load the specific template file using wp_is_mobile() to determine which template file to load.

The Codex info for template_include.


I believe you're on the right track with wp_is_mobile().

Have you tried creating just one front-page.php and adding an if / else statement to alter display between desktop and mobile?

Something like:

if ( wp_is_mobile() ) { // If it is a mobile device

get_header( 'mobile' );
// Display some other stuff here
get_footer( 'mobile' );

} else { // If it is not a mobile device

// Display some other stuff here

} // end wp_is_mobile()
  • Sweet. This could surely be one way. I will wait for someone to chip-in with the method where I can switch front-pages, if not I will mark this as the right answer. – vajrasar Oct 15 '14 at 9:02

I know I might be off as this is an old question but I have found this answer here and it works, it simply redirects the main page to the mobile home page using this script in the home page text editor where /mobile is the link you want to redirect to. I have tried it and it works you can check it on medicalfa.

 if (document.documentElement.clientWidth <760) {
   window.location = "/mobile";

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.