Access Chrome Developer Tools from Android Phones




Chrome Developer Tools from Android

Google Chrome browser's developer tools is a great way to inspect elements of a webpage. It is very useful for the web developers to make their websites more user friendly. 

But the sad thing is this feature is currently only available on desktop browsers. So, if you are currently on smartphones or you don't have access to your desktop you can't inspect any website. 

Though android browsers don't have any developer tools option, we are sharing a way to enable this feature. So that you can inspect any webpage even from your smartphones.


Watch The Video

If you don't want to read the tutorial, you can just watch this short tutorial video -



Follow The Steps

1. In order to enable the developer tools we are going to use a tool named Eruda.

Eruda Console for Mobile Browsers | TechneSiyam

2.
We have to execute a script in our browser's url tab to use this tool which will let us inspect our webpage.

3. Most of the smartphone browsers like chrome will redirect you to google search instead of executing the script. So, we will have to bookmark it to work.

4. It is not possible to manually add a new bookmark to chrome. So, we have to bookmark a random website then edit it.

5. To boolmark a website, open the menu (by clicking at the top three dots) and click the star icon.

6. Go to the menu again and click on Bookmarks to find the bookmarked website.

7. Find the bookmark and click on edit.

8. We are going to edit the bookmark's name first. We need to choose a relative name that we can remember later. We are using Developer Tools as the bookmark's name.

9. Now, we will edit the url section. We will input the below script in the url section -

javascript:(function () { var script = document.createElement('script'); script.src="//cdn.jsdelivr.net/npm/eruda"; document.body.appendChild(script); script.onload = function () { eruda.init() } })();

10. To check if it works or not, we will go to a random website. Then, we will click on url tab and type Developer Tools.

11. We will see our bookmarked script in the suggestion. We will click on it and a floating button will appear. We will be able to access the developer tools just by clicking on the button.


NOTE: Some tools available on the desktop browser may not be found on this tool. But we have tried it and most of the useful tools can be found and used.

Post a Comment


0 Comments