How do I view page source in Safari?

[ardchoille]

While surfing the web on my iPad mini I came across a few sites that look great. I'd like to view the page source of the site so I can learn how some of the page elements were done, particularly the CSS. This would help me improve my own website.

Is there a way to view page source in Safari on the iPad mini?

 

[twerppoet]

No way to do it in Safari.

The Atomic web browser is fairly cheap (99 cents), and will let you view the page source. There is a free, lite, version as well. I don't know if that feature is included, but probably. So you can test it and see if it's what you need.

All you need to do is copy the URL when you see a page you are interested in and then paste it into Atomic.

As a bonus, Atomic can change it's browser ID. That means website can be fooled into thinking that it is a desktop browser. Useful for when you want to bypass a mobile site that offers no link to the desktop version. Hold in mind that the desktop version may not work well, which is the normal reason to not offer the site, but in your case you may want to be able to see it and see the source anyway.

I'm sure there are other third party browsers that will view the source; however, it is the only one I have that does it, or does it easily enough that I did not need to dig into settings to find the option.

 

[ardchoille]

No way to do it in Safari.

The Atomic web browser is fairly cheap (99 cents), and will let you view the page source. There is a free, lite, version as well. I don't know if that feature is included, but probably. So you can test it and see if it's what you need.

All you need to do is copy the URL when you see a page you are interested in and then paste it into Atomic.

As a bonus, Atomic can change it's browser ID. That means website can be fooled into thinking that it is a desktop browser. Useful for when you want to bypass a mobile site that offers no link to the desktop version. Hold in mind that the desktop version may not work well, which is the normal reason to not offer the site, but in your case you may want to be able to see it and see the source anyway.

I'm sure there are other third party browsers that will view the source; however, it is the only one I have that does it, or does it easily enough that I did not need to dig into settings to find the option.

Thank you for that info. I have seen others here recommend Atomic Browser for different reasons so I am going to try it.

 

[twerppoet]

I mostly use Safari, but I keep a few other's with specialty features, just in case.

 

[ardchoille]

I mostly use Safari, but I keep a few other's with specialty features, just in case.

Very good practice!

I just installed the lite version of Atomic Browser and was blown away at the huge feature set. So, I uninstalled it and bought the paid version - it's one of those apps that's so good I jumped at the chance to support the developer. Thank you so much for recommending this wonderful browser.. solved my problem

 

[twerppoet]

You are welcome.

 

[DarkRavenMoon]

Want to view the source code of a web page in mobile Safari on your iDevice?

Bookmark any page then edit it, name it 'View Source' and change the address to this:

javascriptfunction(){var a=window.open('about:blank').document;a.write('Source of '+location.href+'');a.close();var b=a.body.appendChild(a.createElement('pre'));b.style.overflow='auto';b.style.whiteSpace='pre-wrap';b.appendChild(a.createTextNode(document.documentElement.innerHTML))})();

Damn emoticons! Sub the for a : and a (

1. Open Safari.

2. Go to any web page (google as an example).

3. Once there add the page as a bookmark.

3a.

3b.

4. Rename the page to 'View Source' and save it.

4a. So it looks like this.

5. Tap 'Edit'.

6. Select the bookmark you renamed earlier so that you can edit the address.

7. Remove the address and paste the JavaScript from the top of my post.

All done So, now no matter which web page you are viewing you can simply select 'View Source' from your bookmarks and the source code will open in a new window

Enjoy

 

[twerppoet]

Want to view the source code of a web page in mobile Safari on your iDevice?

Bookmark any page then edit the URL, name it 'View Source' and change the address to this:. . .

Did not know there was a bookmarklett for this. Thanks.

 

[DarkRavenMoon]

No, never bothered looking as I use the above hehe

PS
Added screen grabs to my last post to help describe it a little easier.

Hope it helps someone.

 

[twerppoet]

What you are doing above is known, in general terms, as a bookmarklet. A bit of javascript tucked away in a bookmark.

Here are quite a few more. I don't think your example is among them, but I haven't looked at them all in a while.

http://www.ipadforums.net/ipad-faq/72353-guide-creating-safari-bookmarklets.html#post519309

 

[DarkRavenMoon]

Ah ok thanks I misread your post. I thought you said, "Did you know there was.."

Not up on the buzz words I guess lol

 

[DarkRavenMoon]

I've posted a link to this thread on there - thanks for the heads up on the other bookmarklets

 

[KevinJS]

You can disable emoticons in posts if you use the website view of iPF. It's in the list of options under the posting window.

Sent from my iPad using iPF

 

[twerppoet]

Ah ok thanks I misread your post. I thought you said, "Did you know there was.."

Not up on the buzz words I guess lol

No problem. That's what I get for not using complete sentences.

 

[DarkRavenMoon]

I only get these: