wptouch user guide

8/12/2019 WPtouch User Guide

http://slidepdf.com/reader/full/wptouch-user-guide 1/21

© 2013 BraveNewCode

WPtouch User Guide



1. Introduction 3

2. What’s New 3

3. Installing WPtouch 4

4. INSTALLING WPTOUCH 4 5. Core Settings 5

6. GENERAL 5 7. COMPATIBILITY 10

8. Themes 12

9. BAUHAUS 12 10.Theme Settings 13

11.GENERAL 13 12.BRANDING 14 13.BOOKMARK ICONS 17

14.Menus 17

15.THEME MENUS 17 16.MENU SETUP 18 17.ICON UPLOADS & SETS 20

18.Extensions 21

19.INSTALLING EXTENSIONS 21 20.Getting Support 21

21.



Introduction

WPtouch creates a compelling mobile experience for your website with stunning themes tailored

for modern handheld and tablet devices. This documentation will guide you through each of

WPtouch's features.

What’s New



Notifications

See important notifications regarding plugin updates, incompatibilities, and other important

notices in the Notifications panel.

Quick Links

View the plugin changelog, access the knowledge/documentation and get community support.

WPtouch News

Keep up to date with the latest WPtouch news right from your Dashboard.

Installing WPtouch

INSTALLING WPTOUCH You may install the WPtouch plugin through the WordPress Plugins administration panel or via

FTP/SFTP/SSH upload.

Installiing via the WordPress Plugins Administration Panel

1. Go to Plugins > Add New > Search. Search for “wptouch” without quotes.

2. Click the “Install Now” link in the search results for WPtouch.

3. Confirm the installation of WPtouch.

4. When it has finished uploading, click on “Activate Plugin”



Uploading via FTP or SSH

It is assumed for the purposes of this document that if you choose to upload WPtouch via FTP or

SSH that you know how to do so and are comfortable with the process of configuring

permissions, etc.

★ WPtouch must be installed in a directory named “wptouch" located inside the main WordPress

plugins directory. You will still be able to activate the plugin when it is placed in another

directory but WPtouch will be unable to locate many of its required files, including CSS and

Javascript source files.

★ If you’re finding that installation is not going well despite following these guidelines, you may

have a server-side issue that needs attention.

Core Settings

GENERAL SITE TITLE & BYLINE

★ WPtouch site title - If the title of your site is long, you can shorten it for display within WPtouch

themes.

★ Display "Powered by WPtouch" in footer - The "Powered by…" message will be shown in the

footer of your mobile themes.

REGIONALIZATION

★ Language - Select the language to use in the WPtouch admin panel and in supported themes.



★ Translate administration panel text - When selected, the language selected in the setting

above will also apply to the WPtouch administration panel. (Advanced)

DISPLAY MODE

Theme Display:

★ Normal (active for all mobile visitors) - The WPtouch theme is active for all mobile users.

★ Preview (active only for logged-in site administrators) - Logged-in administrators can see the

WPtouch theme on all browsers.

★ Disabled (mobile theme will never show) - The WPtouch theme will not be seen by mobile

users or logged-in administrators.

LANDING PAGE

In WPtouch you can choose a custom landing page (a.k.a. home page) for your mobile theme

while leaving your desktop theme’s home page unchanged.

WPtouch landing page:

★ Default (same as WordPress) - WPtouch will use the static front page settings defined in

WordPress Settings > Reading. ★ Select from WordPress Pages - Select from the dropdown menu an existing WordPress page

to be used as the landing page for your mobile theme.

★ Custom URL - Enter the slug (i.e. “/home”) or full URL to a post or page from your WordPress

installation.

Note: You will need pretty URLs enabled in your WordPress Permalink settings for the custom

landing page feature to fully work.



DESKTOP / MOBILE SWITCHING

★ 1st time visitors see desktop theme - Your regular theme will be shown to 1st time mobile

visitors first, with the Mobile View switch link available in the footer. Cookies are used to check

whether a device has previously visited the site. Enabling this setting forces the desktop

theme to display on a mobile device if it is the first visit. (Advanced)

★ Show switch link in mobile view - Enables the theme switch in the footer of the mobile theme.

The theme switch allows visitors to choose between viewing your mobile and desktop themes

on the mobile device. Is not shown in Web-App Mode.

CUSTOM CODE

★ HTML, JavaScript, statistics or custom code - WPtouch off ers a field where you may quickly

and easily add code to be appended to the footer code of your mobile theme. You may

include HTML or JavaScript format, including CSS and statistics tracking script.

TOOLS AND DEBUG

★ Use jQuery 2.0 in themes (faster for mobile devices) instead of WordPress' version (Advanced)

- jQuery 2.0 is significantly smaller and faster than previous jQuery versions. May cause

problems with other plugins, use carefully.

★ Show load times and query counts in the footer (Advanced) - WPtouch will show the load time

and query count to help you find slow pages/posts on your site.



★ Enable debug log (Advanced) - Creates a debug log .txt file to help diagnose issues with

WPtouch.In a single WordPress installation, debug logs are saved as .txt files in the /wp-

content/uploads/wptouch-data/debug/ directory.In a WordPress network installation, the

debug directory is located inside the sub-site’s directory: /wp-content/blogs.dir/

YOUR_SUBSITE_DIRECTORY/files/wptouch-data/debug/. You can also view the debug log

from your WPtouch admin panel by clicking on “View Debug File”.

★ Your Server Configuration - Displays information about your server’s configuration such as the

version of PHP in use.



ADMIN MODE

The WPtouch admin area can be viewed in two modes: Basic and Advanced. Items flagged as

“advanced” are generally not needed when simple desktop themes are used.

★ Admin Panel Mode (Advanced) - 'Advanced' reveals settings that are used infrequently.

• Advanced Mode off ers options needed to bring your mobile theme in sync with some

desktop themes’ advanced functionality (such as functions that power shortcodes, custom

post types, custom fields, and custom page templates). It also provides additional

functionality such as tools that provide site performance data.

Advanced features are flagged with this icon:

★ Basic - Displays the basic, most frequently used settings.

PREVIEW THEME

Preview Theme allows you to simulate your mobile theme in your Safari or Chrome desktop

browser. The preview tool opens a smartphone-sized window in your browser that allows you to

see how your mobile theme will look on an iPhone-sized mobile device. This tool off ers an

approximation only. Touch-based functions such as slider control will not be active.



RESET SETTINGS

To reset your entire WPtouch installation to its default state. Useful when settings have become

corrupt. Resetting cannot be undone. You may, however, choose to backup your settings if you

like. Remember that importing corrupt settings will negate the reset.

COMPATIBILITY

Not all options are visible when the WPtouch admin mode is set to “Basic”. To see all options, set

the admin mode (in Core Settings) to “Advanced”.

SHORTCODES

★ Remove these shortcodes when WPtouch is active - Enter a comma-separated list of the

shortcodes you’d like to deactivate in your WPtouch theme. Your desktop theme will remain

unaff ected and the remaining shortcodes will remain functioning in your mobile theme.

IGNORED URLS

★ Do not load WPtouch on these URLs/Pages - URLs entered in this area will display your

desktop theme to all users, including those on a mobile device. No switch link will be

displayed in the desktop theme to switch to the mobile theme on the excluded pages. Enter



each permalink URL fragment on its own line. Rather than using absolute file paths, use

relative URLs such as

/about or /products/store

where /about is http://www.yourdomain.com/about and /products/store is http://

www.yourdomain.com/products/store.

CUSTOM USER AGENTS

★ User-agents (line separated) - Adding additional user-agents will force WPtouch to be active

for matching browsers.

Please note that full functionality is not guaranteed on non-offi cially supported mobile devices.

★ Active user agents - The list shows the user agents that are active for WPtouch as well as the

custom user agents.



Themes

BAUHAUS WPtouch includes the Bauhaus theme. Additional themes are available only in WPtouch Pro.



Theme Settings

GENERAL

BLOG

★ Number of posts in post listings - Overrides the WordPress Reading settings for "Blog pages

show at most"

• Posts marked as sticky will continue to display at the top of your post listing in addition to

the number of posts set here.

★ Exclude categories - Enter a list comma separated by category name

★ Excluded tags - Enter a list comma separated by tag name

★ Post-thumbnails - Select where post-thumbnails should be displayed or not displayed at all.

★ Show post categories or tags - Show the categories or tags in the blog post listings.

★ Show post date - When enabled, the post date will be shown for each post in post listings.

★ Show post author - When enabled, the post author will be shown in the post listings.

★ Show search in header - If enabled, a tab for the search bar will be shown in the header area

when the menu is expanded.

PAGES

★ Show comments on pages - Overrides the WordPress settings for showing comments on

pages.

★ Custom latest posts page (Advanced) - Select an existing WordPress page to display your

latest posts.



LOGIN FORM

★ Use fly-in login form - Will add login links and allow mobile visitors to login to your website

from mobile devices.

★ Show "Sign-up" and "Lost Password?" links - Enable to show links for mobile users to sign-up

and retrieve their password.

FEATURED SLIDER

★ Enable featured slider - Requires at least 2 entries to contain featured images.

★ Automatically slide - The slider images will automatically slide.

★ Featured slider posts also show in listings - Posts in the Featured Slider will also appear below

the slider in the post listings.

★ Select to show the latest posts, from a specific category or tag, or enter a comma-separated

list of page/post IDs to display in the Featured Slider.

BRANDING THEME COLORS

★ Theme background - Select a color to use for the WPtouch theme background

★ Header & Menu - Customize the header and menu color.

★ Links- Choose a custom color for the active links throughout the active WPtouch theme

★ Post/Page Headers - Choose a custom color for the header area of your posts and pages.



SITE LOGO

Logo images in .png, .svg and .jpg format may be uploaded for use in your mobile theme. Images

will be automatically scaled.

You can always reference http://www.bravenewcode.com from your mobile device to see what

a .svg file using the recommended sizes looks like.

TYPOGRAPHY

★ Font Style - Choose a Google font pairing designed for this theme, or default browser fonts.



SHARING

You may choose to enable the set of sharing tools bundled with WPtouch: Facebook, Twitter,

Google Plus, and email. The set of buttons may be placed above or below your content and

styled in either your theme’s colors or with the colors of each social network.

★ Show sharing links - Will show Facebook, Twitter, Google Plus and Email buttons on single

post pages.

★ Sharing links location - Choose to display the sharing links above or below the post content.

★ Color scheme - Display the sharing links in your theme’s colors or the colors of each social

network.

FOOTER SOCIAL LINKS

★ When you enter the full urls of your social network pages, corresponding icons will display in

the footer of your mobile theme.



BOOKMARK ICONS

OPTIONS

★ Icon Title - When visitors bookmark your website, this will be the title shown.

Note: Not all homescreen icon options are available in all themes.

• Android - 96x96 pixels

• iPhone/iPod Touch - 120x120 pixels

Menus

THEME MENUS

HEADER MENU

★ Select a custom WordPress menu or the WordPress pages to display as your main menu.



MENU OPTIONS

★ Enable parent items as links - If disabled, parent menu items will only toggle child items.

★ Use menu icons (Advanced) - When disabled, menu icons will not be used in the Header

Menu.

MENU SETUP

★To exclude an item from the active menu, disable it via the “Show/Hide” checkboxes.



1.To begin customizing the menu items, select the menu in the “Menu” dropdown.

2.Select the Icon Set from the right icon pool.

3.Drag and drop a custom icon over the default icon.



4.Save your changes and preview.

The icon tools at the bottom of the left panel allow you to:

★ Change the default icon for all your non-customized icons at once. Once changed, the icon

setting will remain as the new default. To revert the new default icon to its original setting, the

WPtouch settings must be reset.

★ Reset any individual icon to the default icon.

ICON UPLOADS & SETS ★ Icon Upload - The Icon Upload tool allows you to add custom icons to be used in your

WPtouch mobile theme menu(s). Icons must be in .png, .jpg, or .gif format and will be

automatically resized.

★ Uploaded Icons - Individual icon files that have been uploaded will appear in the “Custom

Icons” area.

★ Icon Sets -WPtouch makes hundreds of icons available for use in your mobile themes. Icon

sets that are installed or that are available for download and installation are listed. To install

additional icon sets from the available downloads, click the “Install” button next to the desired

set. The icon set will then be automatically downloaded and installed.



Extensions

INSTALLING EXTENSIONS Extensions are powerful modules that may be added to WPtouch to enhance the appearance

and performance of the mobile and/or desktop themes. Extensions are available only in WPtouch

Pro.

Getting Support

Access community support for WPtouch (free) in the WordPress.org Support forum - http://

wordpress.org/support/plugin/wptouch

wptouch user guide

Documents