How to edit text on any webpage

Why would I want to edit the text of a website?

There are tons of interesting applications for editing the text of a website. You might want to edit your bank account balance to say you’re a millionaire and then take a screenshot and impress your friends, or more useful, you can edit fields which are ‘greyed out’ and you can edit their values. The best part is that it is extremely simple to change the text on a webpage.

What do I need to get started?

You will need a web browser that allows you to inspect source code live in the browser. We’ll walk through the how to do it Chrome.

 

Using Chrome to edit the source code of a webpage

The Chrome browser is the browser I would recommend for this as it has a very powerful suite of development tools for editing the text of a website. For the first example, we’re going to edit my bank account balance to make it look like I have $1,000,000!

1. Right click on the webpage you want to edit, more specifically WHAT you want to edit.

bank balance edit text right click

2. Click on 'inspect'

You can also use the shortcut “CTRL + SHIFT + I”

When click ‘inspect’ it will show you the following. What you are looking at is the source code of the webpage. If you aren’t familiar with source code and web development, don’t let this deter you, as it is fairly easy for what we are doing. 

Look at the code below. You can see the bank balance of $652.96. 

bank balance edit text webpage

3. Double click the value you want to edit.

Once you double click you’ll notice the field becomes editable.

bank balance edit text webpage double click

4. Type in the new value

As you can see below I have edited the bank balance text to $1,000,000.

bank balance edit text webpage double click edit

5. Exit out of the inspect window

Wow! Now I can impress my friends with my millionaire status!

Now this example is silly and not terribly practical, but the next section can be used for something much more useful!

bank balance 1,000,000

Edit non-editable grayed out fields

That’s right! You know when you are trying to edit something and it won’t let you edit it? You can use this technique to edit those fields! In the following example we’re going to edit our WiFi network name!

Edit your WiFi network name when it is grayed out

1. Right click on the Wireless Network Name (SSID)

WiFi Network

2. Double click on the value after value="

inspect wireless network edit

3. Edit the value to the name you want to use

You can see below that I changed the wireless network to value=”The Faster Fixer is the best!”

inspect wireless network faster fixer

4. Close out of the inspect window and click apply to save

inspect wireless network faster fixer is the best!

More Information

Did this help you learn how to edit things that are running in your web browser? If you get fancy with it, you can disable and enable fields that are hidden, you can change variables and more. If you’d like a future guide on more of these little workarounds just leave a comment! If you need any help just ask!

Theme: Overlay by Kaira