November 22, 2012 — By Dale Mugford

WPtouch Pro Tips Central: Creative Web Development

Creative Web Development 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: http://webdesign-westmidlands.com
Director, Creative Web Development: Derek Plant
License Type: Single Licence
Blog: Wired into the Web

tips-central-creative-web-development-mobile-ipad-themes

How long have you been using WPtouch Pro?
Only the last couple of months, but we very quickly understood how powerful it is and dug a little deeper to try and get the most out of it. We have been amazed by the results.

Why did you choose WPtouch Pro to power your mobile site?
We were looking for a way to create and maintain a mobile version of our website without a great deal of time or expense and without a steep learning curve. WPtouch Pro was the obvious choice.

What do you like most about using WPtouch Pro?
A lot of things. Firstly, although we use Headway which is a responsive theme and works very well, it doesn’t quite have the same user experience as when viewing the site with WPtouch Pro. However they play very well together and we like using Headway for iPad and WPtouch Pro for mobile phones. We think they make a great combination. It depends on the site layout of course, and you need to preview both to decide, but the level of choice offered by WPtouch Pro allows for very fine control.

One of our favorite features is the use of WPtouch Pro’s custom shortcodes. These make it very easy to have fine control over which content displays only on mobile devices and which displays only on the desktop theme.

A way we like to work is to start with a layout of the desktop version then add color-coded, semi-transparent panels over the different areas: For example red for mobile only, green for desktop only, and none for the common elements. This makes it very easy to see at a glance what we can eliminate or even add in just for mobile display. Using just two shortcodes gives us all of the control we need to apply them using the WordPress editor.

The ability to use a custom landing page, a custom menu, and custom icons gives tremendous freedom to give a great user experience that looks and feels that it has been designed specifically for mobile users.

What improvements would you like to see included in future WPtouch Pro updates?
Not many things because it would be a shame to lose the easy learning curve. Maybe an easy way to show widgets would be a good addition although we use a workaround for that — it would be great to be able to display widgets in the menu similar to the way categories display. It may also be good to have a notification bar for announcements.

Other than that we can’t really see much room for improvement. Its beauty is in its simplicity. That simplicity is what inspired us to create a WPtouch Pro video overview and to publish a WPtouch Pro Kindle eBook.

OUR TIPS CENTRAL SUGGESTIONS FOR Creative Web Development

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

1. Add a custom home screen icon.
To round out the current implementation of iOS Web-App Mode, a custom home screen icon may be added. This would complement the existing custom startup screen and custom title for the web-app. This icon may be added via Menu + Icons >; Menu and Icon Setup >; General Icons + Menu Setup >; Site, Theme & Bookmark.
Support Documentation: iOS Web-App Mode

tips-central-creative-web-development

Custom icon support

2. Make the custom landing page consistent in the desktop theme.
We noticed that the custom mobile landing page, when viewed in the desktop theme, did not share many of the same page elements with the rest of the desktop theme. Consistency here is important as the custom landing page becomes the site home page when visitors use the switch link.

We also noticed excellent use of the WPtouch Pro footer to add contact and branding elements that are unique to the mobile theme. WPtouch Pro’s custom menu option was also used to add menu items in the mobile theme that are not present in the non-mobile theme. Kudos!

tips-central-creative-web-development-custom-footer-and-menu

Custom footer and menu


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