View Source from Safari on iPad

UPDATE: Thank you to Rixtur for the update for iOS 6. Steps updated.

I’ve been enjoying the iPad quite a bit.  This device is going to change everything.  I have lots of thoughts, one of which is that the iPad will be a high productivity device.  Feeding into that, here’s a quick way to view the html, css and javascript source code of a web page from Safari on the iPad.
This guide is adapted from Dustin Caruso’s note on viewing source in Safari for the iPhone.

1. Visit this page using Safari on your iPad.

2. Use your touch selection skills to copy the following line of javascript:

3. Tap  + then Add Bookmark (Note, you can not bookmark a blank tab, so you must visit another web page first to do this.

4. The first text field is the Title field. Change the title to View Source.   Leave the second field (the Address Field) alone and hit save.

5. Tap the Bookmarks icon and then edit.  Find View Source in the list and tap the right arrow for the bookmark’s details. Now tap the Address Field and hit the X icon to clear it. Tap and paste the javascript from the clipboard.

5. Tap the Bookmarks navigation item to save the changes.

Voila.  Go to any web page using Safari, tap the Bookmarks icon and hit View Source.  Safari will open a page of source code in plain text in a new window.

84 replies on “View Source from Safari on iPad”

Thanks for the tip, it worked like a charm. Only question is this, is there a way to copy the text from the source code, so I can paste it in another document?

Hello, thanks for putting this online (with all the other great resources). Am currently on vacation away from my computer and I was stumped with only my iPhone to debug a website.
Thanks again, really made my trip better.

I cannot work out how to do this. I can selec the text, but dont understand what “tap + then add bookmark”. What should I tap?
1) the “+” on the keyboard. This doesnt work.
2) the text I have just copied? It just unhighlighs the text
3) There is no “+” on the browser top nav like in the screen shot in the IPAD 3. There is a “+” to add new tabs, but this doesnt have anything to do with it I presume.

So cant work out how to get this tip to work in ipad3.

What doesn’t work in iOS 6 is step #3, because Safari won’t let you create a bookmark of a blank tab. But you can do it if you just bookmark this blog article, change the Title to “View Source” and follow the rest of the steps.

Works great! Thanks!

Awesome! Exactly what I needed. Comparing code on two web-sites. Using my iPad 2 (iOS 6.1), don’t have my laptop with me today. Found this – problem solved!

Leave a Reply to Cody Cancel reply

Your email address will not be published. Required fields are marked *