Customizing mobile theme templates in WPtouch Pro 4.x

When you want a unique layout exclusively for your mobile theme, such as creating a mobile-only home page or altering your post display.

Copying Templates from the parent WPtouch Pro theme

In version 1.1+ of the Make a Child Theme extension, you can easily copy templates from your child theme’s parent. After making a child theme, select the child theme you want to copy templates in from the “Child Theme” dropdown.

You will see a list of templates available to copy from the parent theme to your child theme’s directory. Select the templates you want to copy for customizations and click the “Copy Selected” button.

The theme templates will be copied to your child theme’s default folder in /wp-content/wptouch-data/name_of_your_child_theme/default, which may now be customized. If you are not using the Make Child Theme extension, you can manually add the template(s) to your child theme's /default directory.

Porting Templates

When your desktop theme uses custom templates that you'd like to bring into your mobile theme, you may be able to do so simply by placing a copy of that template file inside your WPtouch Pro child theme.

If your desktop theme uses a sub-directory for its page templates and your copied template doesn't seem to be working as expected, try creating a new sub-directory inside your child theme's /default/ directory, naming it the same as the directory in the desktop theme. Moving your new template inside. The result will be a template that is located in the same relative position as the one in the desktop theme.

Add any elements you'd like in your custom page template between<?php /* Mobile Template: Custom Name ?> and <?php get_footer(); ?>You may want to retain some of the styling from your mobile theme's default page code so carefully check through the core code for anything you'd like to include in the layout of your custom page template such as div classes, etc.

Assign your new mobile page template to the page via the Mobile Page Template widget in the WordPress Page Editor. Save the changes.

Add any custom styling you'd like for your new page to your child theme.

Templates for Posts

Here's how to build a custom template for use with your WordPress posts in WPtouch Pro.

First make a copy of the theme you'd like to customize. Copying ensures that the original theme is preserved for future use. See Make a Child Theme for details.

Next, copy the single.php file from parent theme (/wp-content/wptouch-data/themes/_your_PARENT_theme_/default) to use as your new post template in your newly copied theme.

Save the new single.php file to your newly copied theme. The specific location on your server will depend upon whether you have a single site WordPress installation or a WordPress network:

Save single.php to /wp-content/wptouch-data/themes/YOUR_NEW_THEME/default/single.php if you have a single WordPress installation, or

Save single.php to /wp-content/wptouch-data/YOUR_SUBSITE_ID/themes/YOUR_NEW_THEME/default/single.php if you have a WordPress network installation.

Customize the new single.php file as you like.

When your copied theme is active, changes to single.php will apply to all posts displayed in your mobile theme.

Customizing mobile theme templates in WPtouch Pro 3.x

There are two situations where you may want to use a custom template for your mobile theme:

If your desktop theme uses a sub-directory for its page templates and your copied template doesn't seem to be working as expected, try creating a new sub-directory inside your child theme's /default/ directory, naming it the same as the directory in the desktop theme. Moving your new template inside. The result will be a template that is located in the same relative position as the one in the desktop theme.

Add any elements you'd like in your custom page template between<?php /* Mobile Template: Custom Name ?> and <?php get_footer(); ?>You may want to retain some of the styling from your mobile theme's default page code so carefully check through the core code for anything you'd like to include in the layout of your custom page template such as div classes, etc.

Assign your new mobile page template to the page via the Mobile Page Template widget in the WordPress Page Editor. Save the changes.

Add any custom styling you'd like for your new page to your child theme.

Templates for Posts

Here's how to build a custom template for use with your WordPress posts in WPtouch Pro.

First make a copy of the theme you'd like to customize. Copying ensures that the original theme is preserved for future use. See Themes for details.

Next, copy the single.php file from Foundation theme (/wptouch-pro-3/themes/foundation/default/single.php) to use as your new post template in your newly copied theme.

Save the new single.php file to your newly copied theme. The specific location on your server will depend upon whether you have a single site WordPress installation or a WordPress network:

Save single.php to /wp-content/wptouch-data/themes/YOUR_NEW_THEME/default/single.php if you have a single WordPress installation, or

Save single.php to /wp-content/wptouch-data/YOUR_SUBSITE_ID/themes/YOUR_NEW_THEME/default/single.php if you have a WordPress network installation.

Customize the new single.php file as you like.

When your copied theme is active, changes to single.php will apply to all posts displayed in your mobile theme.