December 6, 2012 — By Dale Mugford

WPtouch Pro Tips Central: imofx.com

IMOFX LOGO

Our “Tips Central” blog series spotlights WPtouch Pro-powered sites built and maintained by designers, developers and site owners like you. Read about other designers, developers, and site owners’ experiences with WPtouch Pro and get ideas for your own projects. Our experts also provide their recommendations for additional site enhancements using WPtouch Pro.

Site URL: www.imofx.com
Site Owner: Edwin van der Veer
License Type: Single
imofx on Twitter: @imofx

tips-central-imofx-iphone-ipad-themes

How long have you been using WPtouch Pro?
I’ve been using WPtouch Pro for two years now.

Why did you choose WPtouch Pro to power your mobile site?
That’s easy. WPtouch Pro offers the most in terms of customization and flexibility. I’m a self-taught photographer and I want the pictures I take to be readily available on a mobile platform too. I’ve been experimenting with other mobile “solutions” but none of them offered the options WPtouch Pro has. Besides that, there are a lot of big names that use this plugin. That’s enough recommendation for me!

What do you like most about using WPtouch Pro?
It’s very versatile. It caters to different platforms such as iOS, Android and RIM. Besides that, it delivers content in the most convenient way. BraveNewCode has added support for the (latest addition of the) iPad, so a website can take advantage of that too. Right now I use a responsive WordPress theme alongside WPtouch Pro so that my site looks cool on any platform!

When I encountered some setup problems, I had to fly in the cavalry (the BraveNewCode support team) more than once (due to my lack of knowledge unfortunately). That’s when I knew I made the right choice. Customer support is absolutely fabulous and luckily, they’re very patient too. ;)

What improvements would you like to see included in future WPtouch Pro updates?
That’s a difficult one. It already has lots of bells and whistles and I feel I’m using only a very small part of those options. Oh yes, there’s one: I would love to be able to choose from some more themes. Right now it’s possible to alter color, fonts, background and such, but it would be awesome to give my site just a little more personality.

OUR TIPS CENTRAL SUGGESTIONS FOR IMOFX.com

Note: Links to support documentation are available exclusively to current WPtouch Pro customers who are logged into bravenewcode.com.

1. Enable iPad Support.
On an iPad in portrait view, the desktop theme renders the home page gallery on top of the site menu. This makes it impossible to click the menu items. With WPtouch Pro’s iPad support enabled, more control can be had over the mobile theme in order to present an optimal site experience. The desktop theme’s home page custom template can be incorporated into WPtouch Pro along with custom CSS as a way to keep the mobile and desktop themes consistent while maintaining full menu accessibility.
Support Documentation: Enabling iPad Support

tips-central-imofx-iphone-ipad-themes

Menu issue in iPad

2. Create a custom menu.
Keeping content access consistent helps to smoothly integrate both mobile and non-mobile experiences. A custom menu can be created by using the WordPress menu functionality that will allow mobile visitors to access more site content than is currently available. The Gallery is likely a primary reason for visitors to come to the site; making it available from the WPtouch Pro menu could be beneficial.

The WPtouch Pro menu can be styled with custom menu icons through Menu + Icons > Menu and Icon Setup. Access to the customer login function can be added through Active Theme > Menu, Posts and Pages > Show Account in tab-bar.
Support Documentation: Using a custom WordPress menu

tips-central-imofx-iphone-ipad-themes

Custom WordPress Menu Support

3. Include a custom iOS Web-App icon and startup images.
There are opportunities within WPtouch Pro to enhance the iOS Web-App experience. Branding and messages can be included by customizing the home screen icon and title as well as adding startup screens.
Support Documentation: iOS Web-App Mode

tips-central-imofx-custom-webapp-icons

Custom Web-App Icon Setup

4. Refine some interface elements.
A few items can be refined in order to improve the overall appearance of the mobile theme. These include:

  • Using a transparent logo will allow the image to blend into the header area seamlessly. Header colors can be selected under Active Theme > Style/Appearance > Header Styling or can be customized using CSS in a WPtouch Pro child theme.
  • Similarly, the text-shadow for text in the footer can be changed from white to black or another dark color through the options found at Active Theme > Style/Appearance > Body and Post Styling.
  • By using custom CSS in a child theme, styling can be added to the contact form that appears below the main content in the mobile theme. For instance, {#sfw-respond:margin: 10px;} can be added to allow some space between the form elements and the edge of the screen.
  • The logo can be consistent between the desktop theme and the mobile theme.

Support Documentation: Applying custom CSS

tips-central-imofx-styling-options

Styling Options

 


Are you interested in having your WPtouch Pro-powered site featured in our “Tips Central” series? Please drop us a note through our contact form to inquire.

Added To Cart

Item added to cart successfully. You can either continue browsing and add more themes or extensions, or checkout now.

View Cart Checkout