20.4 C
Toronto

Tip: How to view webpage HTML on iPad / iPhone (iOS 13)

This article outlines the steps required to view the source code (HTML, CSS, JavaScript, etc.) for any webpage on your iDevices including iPad, iPhone or iPod touch using iOS 13, 12, 11, and 10 without any hacks or javascript.

As a web design project manager, I need to view HTML from my iPhone or iPad. Here are a few quick steps to set up your iPhone to view HTML source code. These steps are app free and built into Safari, so as a web-curious user wanting to take a look at the HTML source code for any website check out these steps.

Note, these steps may work on older versions of iOS, however, has not been tested. This process uses a small app without the need for backdoor programming, javascript, or other coding is required! For iOS 12 and lower, scroll down. 

How to view HTML source code on iPhone / iPad Devices (iOS 13)

Step 1: Install a free app from the Apple Store called View Source.

Step 2: Load Safari (iPhone, iPod, or iPad), if it is not already open, and visit any web page.

Step 3: Click the Share Button (it looks like a box with an arrow pointing upwards.)

Step 4. Scroll down to your Actions (below Messenger favourites and app icons)

Step 5. Choose View Source (see Step 5 and 6 if View Source is not listed)

Step 6. If View Source is not available – choose edit actions at the bottom of the screen and enable View Source

Step 7. To move View Source to the top of the list (favourite Actions) – select edit actions on the bottom of the page.

How to view HTML source code on iPhone / iPad Devices (iOS 10, 11, 12)

  1. Load Safari (iPhone, iPod, or iPad), if it is not already open, and visit any webpage. For this example we are using PaperStore.net
6 Steps to view HTML of a web page on iOS 10, 11, and 12

2. Click the Share Button

2. Click the Share Button

3. Choose MORE to add new features to your Share Button

Step 3: 3. Choose MORE to add new features to your Share Button

4. Scroll to the bottom of the Activities List – toggle on (turn green) “View Source

Step 4: . Scroll to the bottom of the Activities List - toggle on (turn green) "View Source"

5. You will now see View Source under your Safari Share Button

Step 5: You will now see View Source under your Safari Share Button

6. On any webpage – Choose View Source from the Share Menu to View the HTML.

That’s it! Now you can use the new View Source Button under your Share Button to review the HTML on any webpage using mobile Safari (and Chrome) on your iDevice (iPhone, iPod, or iPad).

Tremendous kudos to Roman Tomjak and his simple View Source app and clean integration into the safari web environment.

Leave a Reply

Mark is a foodie in training, photographer, Starbucks addict, runner, cyclist, and single parent living outside of Toronto, Ontario. Living with Crohn’s Disease and Diabetes, life for this Transportation Planner and RPP can be an interesting mix.

763FollowersFollow
8FollowersFollow
140FollowersFollow

Must Read

Why you should not add a new hard drive to your computer as a backup solution?

External storage enclosures, or adding a second or more hand drive to your desktop computer are a useful and increasingly popular way to expand digital storage; however it can be difficult to manage storage across multiple disks that may be both internal and external.

Fix: Safari Requires you to Always Login to Websites

Here is the solution to solve you needed to always need to login to websites despite you enabling Keep Me Logged In...

Review: My first thoughts about FreeStyle Libre (Canada)?

Welcome to my review of the new Abbott FreeStyle Libre continuous glucose monitor. This page will be my personal account of using...