Mobile WordPress ThemeFebruary 17, 2012
My goal for today was to make my blog mobile. A site should not just be developed for desktops. “With the galloping development of modern technologies the screen size margin of your readership can be anything in-between a 30″ desktop monitor and the iPhone’s 3.5″ screen.” Speckyboy.com
For this, I used a popular plugin called “WPTouch”. To install WPTouch:
- Login to your WordPress Dashboard
- Click Plugins -> Add New
- Search for “WPTouch”
- Install and activate the plugin
- Click Settings -> WPTouch
- In the general settings I left most of the options except I unchecked “Show Author’s Name”, “Show Categories”, and “Hide Excerpts”
- Update your footer message.
- In advanced settings I unchecked “Enable Categories tab in the header”
- In the Icon Pool create an icon (59x60px) and upload the icon (you will need to scroll down and save options after you upload the icon)
- I didn’t like the pinstripe background because it didn’t match my site, so I opened Dreamweaver and edited /wp-content/plugins/wptouch/themes/default/style.css and around line 2068 I changed the background.
- You may also want to change the site title font. In the same stylesheet the style is around line 193.
- Since I’m using Google web fonts, I had to modify the WPTouch core header file /wp-content/plugins/wptouch/themes/core/core-header.php and add the reference to the Google font before the ending </head>
- I also added more fonts to the WPTouch plugin settings by editing /wp-content/plugins/wptouch/html/style-area.php around line 81
which will appear under Settings -> WPTouch
*Remember if you are adding Google web fonts you will need to add the reference in the core-header.php file.
If you have any questions, leave a comment. To learn more about WPTouch see http://wordpress.org/extend/plugins/wptouch/