View Source on iPhone

This is a cool little tidbit for those of you web developers that have an iPhone. A Safari bookmarklet that enables you to “View Source” for any web page while using Safari on the iPhone. A bookmarklet (in case you didn’t know) is “a JavaScript program stored as a URL within a bookmark” as defined by Wikipedia.

The steps that follow will walk you through the process…

1 – Select and “copy” the long string of code below…

* This needs to be one long continuous string, so if you’re cutting and pasting from Firefox, you’ll need to remove the line breaks and/or spaces.

2 – On your computer, go to ANY webpage in Safari and bookmark it using either the “+” (Add Bookmark) button or by choosing “Add Bookmark…” from the “Bookmarks” menu. When saving the bookmark name it “View Source” and save it wherever you’d like in your bookmark hierarchy.

3 – Now, go into the bookmark manager. Do this by clicking the bookmark icon in your bookmarks bar or by choosing “Show All Bookmarks” from the “Bookmarks” menu. Navigate to the bookmark you just saved.

4 – Single-click on the URL for the bookmark to highlight the text for editing, and paste the text/code you just copied above.

5 – Plug in your iPhone and sync it up w/ your bookmarks on your computer.

Now, to actually use it – launch your Safari web browser on your iPhone and navigate to whatever web page you would like to view the source code for. After the page has loaded, click the bookmark icon in the lower Safari navigation bar (3rd from the left), and navigate to your “View Source” bookmark and click it.

And there you have it.

November 27, 2007 | Filed Under Browsers, JavaScript, iPhone

comments

3 Responses to “View Source on iPhone”

What’s Under the Hood: 8 Ways to View Page Source on Your iPhone | iPhoneized on May 19th, 2009

[...] Abe Fettig’s view source bookmarklet [...]
Aaron Vegh on April 10th, 2010

Hi there,
This used to be how I did this too. But I’ve now written my own app that also uses a bookmarklet, pulling the source code into my app and showing a syntax highlighted version. It also lets you search the code! It’s called Code, and you can learn more at http://codeapp.ca. It’s just $1.99, available as a universal app for both iphone and iPad.

Cheers!
Aaron
admin on April 26th, 2010

I approved your promotional comment Aaron as your program looks really nice – however, i just want to remind reader’s that your solution costs $1.99 and the one i’m offering here is free (w/ less bells and whistles, of course)