RSS

css &gadget &html &ipad &www rob on 09 Apr 2010 12:19 am

View Source from Safari on iPad

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

4. The first text field is the Title field. Use the title, 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.

31 Responses to “View Source from Safari on iPad”

  1. on 11 Jun 2010 at 6:27 am 1.steve said …

    Thanks very much – a great debug tool.

  2. on 30 Jun 2010 at 2:22 pm 2.Enno said …

    Thanks a lot !!
    most useful tip ever.
    best regards from Hamburg

  3. on 09 Jul 2010 at 7:10 am 3.jv said …

    Hey Thanks a lot for this… got me out of a jam this morning. Very useful!

  4. on 13 Jul 2010 at 10:51 am 4.Robthedog said …

    Nice tip that… I’ve been struggling with how to view source on the iPad for a while. Thanks :-)

  5. on 01 Sep 2010 at 2:47 am 5.Robert said …

    Excellent tip! Thanks for providing much needed functionality for Safari on iPad.

  6. on 16 Oct 2010 at 1:01 pm 6.Art said …

    Great !

    Thank you !

  7. on 18 Oct 2010 at 1:00 pm 7.Thomas said …

    Worked like a dream. Thanks so much for the hack.

  8. on 23 Oct 2010 at 11:20 pm 8.Chris Kortge said …

    Thank you! Very cool!

  9. on 09 Dec 2010 at 8:20 pm 9.Dave said …

    Wicked tip. Thanks!

  10. on 30 Dec 2010 at 7:03 pm 10.Raggs said …

    Very cool. Thank you. Anyone know of an editor app?

  11. on 15 Jan 2011 at 4:32 pm 11.Keith said …

    Fantastic tool!

  12. on 25 Feb 2011 at 2:59 am 12.Phil Lea said …

    Genius – ta vm …

    P xxx

  13. on 13 Mar 2011 at 10:30 pm 13.Three ways to view web page source on the iPad & iPhone. « glasskeys.com said …

    [...] – 03/14/2011: Rob’s Blog has an excellent technique on how to do this in [...]

  14. on 28 Mar 2011 at 10:14 pm 14.Cody said …

    Thanks Rob!

  15. on 28 Mar 2011 at 10:15 pm 15.Cody said …

    Thanks Rob! Nice tip!

  16. on 04 Apr 2011 at 5:30 pm 16.Eric said …

    Nice! Awesome trick man needed that

  17. on 13 Apr 2011 at 10:14 am 17.mike said …

    Thanks a lot … you just saved me of hours and hours of pain.

  18. on 18 Apr 2011 at 7:30 pm 18.Mike said …

    Great tip! Thank you!

  19. on 26 Apr 2011 at 1:08 pm 19.Viewing HTML Source Code on iOS | Tech N Comp said …

    [...] discovered it while browsing the internet.  For the source of the javascript bookmark, please see Rob’s Blog. Android, Apple, ios, ipad, iphone, JavaScript, Safari (web browser), Source [...]

  20. on 01 May 2011 at 6:37 am 20.Saeid said …

    Thank you :)

  21. on 01 May 2011 at 3:13 pm 21.Beining said …

    Brilliant tip! Thanks!

  22. on 17 Jun 2011 at 12:53 am 22.Srikant Dhondi said …

    Cool ! thanks you so much !

  23. on 23 Jun 2011 at 5:20 pm 23.Yassop said …

    Awesome tip! Thanks alot.

  24. on 26 Jun 2011 at 10:03 am 24.Cartoon: May the Source Be With You | Golden Key Coaching said …

    [...] dug a little, I would have found many others in my position. I would have discovered any number of JavaScript-based bookmarklets for creating an ersatz View Source command in Safari on the iPad. I might even have [...]

  25. on 27 Jun 2011 at 11:00 am 25.Cartoon: May the Source Be With You | Scripting4U Blog said …

    [...] dug a little, I would have found many others in my position. I would have discovered any number of JavaScript-based bookmarklets for creating an ersatz View Source command in Safari on the iPad. I might even have [...]

  26. on 15 Jul 2011 at 3:17 am 26.James said …

    Thank you very much for this!!!

  27. on 16 Jul 2011 at 5:52 am 27.Fabian said …

    Thanks Rob…it was a need to be fulfilled and you certainly did it!

  28. on 18 Jul 2011 at 9:12 pm 28.Nonfiction librarian said …

    Very useful! Thanks for this.

  29. on 23 Jul 2011 at 9:32 pm 29.Brian said …

    Great info. Works great, thatnks

  30. on 10 Aug 2011 at 10:05 am 30.Nathan Fitzgerald said …

    Thanks a lot man! Excellent tool +2334235564563457

  31. on 25 Aug 2011 at 1:30 pm 31.IPad, web and developers | Serge's Technology View said …

    [...] their infinite wisdom. So if you are looking for the way to see page source try method discussed here This entry was posted in Web-design and tagged ipad, page source, safari. Bookmark the permalink. [...]

Trackback This Post | Subscribe to the comments through RSS Feed

Leave a Reply