Creating a Mobile Friendly Website or Blog using Wordpress Web Tools

One of my web clients, creator of Ann-Nahari Clothing Collection recently asked me how to make her website “smart-phone” friendly. If you have ever tried to browse websites via your tablet or mobile device you might have noticed that some sites are very large and hard to view, which often times requires you to do a lot of scrolling. And on the other hand there are some sites that fit perfectly on any mobile screen because they were designed to be mobile-friendly.

For many online entrepreneurs mobile friendly websites and mobile marketing techniques are still unchartered territory, but as more and more consumers shop and browse on the go it’s becoming more important for us to “get with the times and get mobile!” But of course, time and money are always big concerns for entrepreneurs, especially when it comes to new technology. You might not feel like you are ready to afford going mobile today, but if you have built your site using wordpress you can easily make it mobile friendly for FREE and/or minimal cost in under an hour.

Using my recent Ann-Nahari web project as an example (view my full web services here), today I’m going to share the wordpress plugin that I used to make her site mobile friendly and include a few simple recommendations on how you can brand this plugin to better match the look and feel of your online business.

For this project I used the ‘WPtouch’ plugin, which formats your site with a mobile theme for visitors on Apple iPhone / iPod touch, Google Android, Blackberry Storm and Torch, Palm Pre and other touch-based smartphones.

There is both a free and paid pro version of this plugin, so if you are comfortable updating your wordpress site you can add a version of this plugin for free or do so with minimal cost using the help of a web developer like myself. Note I currently offer web updates for $45/ hour via my Pretty Professional Website Services detailed here.

STEP 1: INSTALL PLUGIN
Once you login to your wordpress dashboard, select the ‘Add New’ option under the Plugins link in your left sidebar. Be sure to search for ‘WPtouch’.

STEP 2: CHANGE COLORS
Once the plugin is installed, click ‘Settings’ in the left sidebar and select the ‘WPTouch’ link. There you can customize your mobile theme settings to match your brand. Change the ‘sub header’ and ‘site wide links’ color to match the color you use on your website.

STEP 3: ADD YOUR LOGO
Under the option ‘Default and Custom Icon Pool’ you can add custom icons like a logo graphic. If you’re adding a logo icon to brand this theme, the best dimensions for it are 59x60px (png).

STEP 4: SET LOGO AND MENU ICONS
Under the option ‘Logo Icon // Menu Items and Page Icons’ you can set the icon image you want for each page and set the pages you want visible.

Once you upload your logo image, you can select it from the dropdown menu for ‘Logo and Home Screen Bookmark Icon.’

Below this option you will see a scrollable listing of all your website pages. For each page you can select a custom icon you added or one that is in your library. Only check those pages you want to be visible in your menu.

STEP 5: CHANGE YOUR CHANGES
Remember to press the blue ‘Save Options’ button at the bottom of the WPTouch Settings page, so all your changes will be saved.

If you would like to learn more about this topic, go watch the Power Circle Video replays online. One of the sessions includes “Explode Your Business with Mobile Marketing” presented by Gigi Biggins. In this session Gigi explains everything web entrepreneurs want to know about the mobile world including apps, mobile sites, text messaging campaigns and more.

Watch replays online – http://powercircle.sistasense.com.
Related post: Landing Pages Vs Squeeze Pages

BROWSE OTHER WEB PROJECT DESIGNS