A web page is made of elements to make it visually appealing and easy to read. iOS users know options like inspecting or inspecting elements on web pages. By inspecting the Element, you can view the website element and its coding, basically what happens on the backhand. You can make changes on your iOS device without affecting the actual webpage. You can edit its language or can make changes to files. This definitely raises the question of how to inspect element on an iPhone.
Furthermore, inspecting is used by developers who inspect specific web elements on your device to come up with a solution you might be facing on your iOS device. Or you are just an iPhone user and curious about how the website is built or how elements on a webpage work and to want to know all the nitty-gritty of it. Either way, I’m going to help you.
You will learn ways you can inspect Element on iPhone:
- Inspect Element on iPhone
- Inspect Element by connecting your iPhone with your Mac
- Additional Apps
Read on to this blog to know more about how to inspect element on iPhone.
Inspect Element on iPhone: Steps explored
You can inspect directly with your iPhone from the Shortcut App. The Shortcut App on your iPhone lets you view the page’s source code, edit it, and download images from websites from Safari itself. There’s not one Shortcut App feature that will let you inspect elements; you will have to add shortcuts for each of them.
But I got your back. I’ll show you exactly how you can debug the website from your iPhone:
- Step 1: Open Shortcut App
- Step 2: Tap on Gallery
- Step 3: Search the keyword for the Element you want to inspect. For example, search “Edit.”
- Step 4: Tap on the shortcut you want to add
- Step 5: will lead you to the ‘Add Shortcut’ Option. Tap on it.
This shortcut will appear on your shortcut app in the My Shortcuts folder and also insights of Safari’s Share Sheet.
How to Inspect a Webpage
- Step 1: Open Safari
- Step 2: Go to the Share button
- Step 3: This will lead you to the Share Sheet. Select from all the Shortcuts you have added to the Shortcut App
For example, Selecting Edit Web Page will let you edit the web page.
Note: some shortcuts might need permission to connect. In that case, you can tap on ‘Allow Once.’
Inspect Element by connecting your iPhone with your Mac
- Step 1: Open Settings
- Step 2: Go to Safari
- Step 3: Go to Advanced (at the bottom)
- Step 4: Turn on ‘Web Inspector
- Step 5: Go to Mac and Open Safari
- Step 6: Click on Safari from the Menu
- Step 7: Go to Preferences
- Step 8: Click Advanced from the navigation bar
- Step 9: Check Click on ‘Show Develop Menu in Menu Bar.
You will be able to see Develop Option on the Top Menu. You need to connect your iPhone to your Mac with a cable. After your iPhone is connected to your Mac:
- Step 10: Click Develop tab
- Step 11: Select your iPhone (from the drop-down menu)
Now, select Connect Via Network to avoid using cable again. After disconnecting your iPhone from your Mac, you can still inspect it without a cable connection.
- Step 12: Open Safari on your iPhone and go to the webpage you want to inspect (keep iPhone unlocked and webpage open)
- Step 13: Go to Safari on Mac
- Step 14: Click on Develop tab again and Select your iPhone
- Step 15: This will lead you to a list of web pages on your iPhone. Click on the webpage you want to inspect.
You will have all the info about the Selected Webpage on your Mac screen!
Additional Apps to inspect Element on iPhone
Apart from Safari, other search engines, such as Google, Yahoo, Firefox, etc., do not provide the facility to inspect Element on iPhone. If you’re unsatisfied with inspector alignment on your iPhone or connecting it with your Mac, you can try additional apps/third-party apps to inspect the Element on your iPhone.
You will find plenty of apps to inspect elements on your iPhone, but I will suggest the best top 3 apps you can install on your iPhone from App Store to inspect elements:
- Web Inspector (suggested by Apple)
- BrowserStack (cloud-based platform)
- Inspect Browser
That’s about it. Now, you know How To Inspect Element On the iPhone app. I will help all the newbie developers with handy solutions to save time inspecting specific elements on your iOS device and for all the iPhone users who want to see what happens in the backhand.