WPTouch Pro – Add Custom CSS

When developing a mobile web design in WordPress, there is one plugin that is a cut above the rest;  WPTouch Pro.  The reason this plugin is awesome for web designers is because it has so much functionality and makes it very easy for a beginner to use and also enough room for a developer to make changes too.  One change that I needed to make on a website was to incorporate my own custom CSS.  This makes it easy for me to make my own rules and when an update for WPTouch Pro is released, it won’t mess with my custom changes.

(The below instructions assume you have already installed the WPTouch Pro plugin)

1. Navigate to the “Theme Browser” link at the top of the WPTouch Pro settings page
2. Click the “Copy as Child” button in the “Classic” theme section
   • 
3. Click the “Activate” button in the new “Classic Child #1” theme section
   • 
4. In your code editor (I use Dreamweaver), navigate to wp-content -> wp-touch-data -> themes -> classic-child-1 -> ipad/iphone -> style.css
   • 
5. Insert your custom code here and save to your server
   • 

Listed below is a link to the original article that gives specific examples of common CSS customizations.