I’ve been doing a lot of testing and development on various platform. And it is difficult to debug the javascript, css and layout of the webpage without seeing the code in action.

Safari has a User Agent switcher under the ‘Develop’ menu. The Develop Menu can be enabled in Preferences > Advanced. It allows you to test your layout on Safari, IE, Firefox, Chrome, and Opera for both Mac and Windows browsers, and iOS devices.

But some User Agents are not on the list. Luckily, it is easy to add other User Agents since Safari uses a simple XML file that can be edited on test editors or GUI.

The method that we are going to use is by editing it thru GUI.

Run the following command:

Now, you can edit the file.

Add the following code:

Another way to edit the XML file is by copying the plist file to Documents folder or any desired location

Open the file and paste the code as specified above.

Then copy the edited file back to Safari:

Now, if you switch to Android as your User Agent, you can see your layout and modify its css and components inline.

• cp /applications/safari app/contents/resources/useragents plist ~/desktop/
• safari developer menu user agent ios 6
• safari developer menu user agent string ios 6
• UserAgents plist internetexplo
• wptouch

• Redirect a Subdomain to main domain using htaccess
• CSS Text Shadow and Text Effects
• Wordress, Joomla, Drupal and other sites were hacked: iFrame Injection Attack
• WordPress: How to remove paragraph tag from the_excerpt
• Video: Adobe After Effects CS5 Sparks Title Sequence Tutorial
• Setting up a PC / laptop as a wireless router
• Photoshop Elements 8 Tutorials
• [ WordPress ] Adding a Category Title & Description
• Disable directory indexing via .htaccess
• 20 Ways To Increase The Life Of Your Laptop’s Battery