1. Website Planet
  2. >
  3. Blog
  4. >
  5. Edit Any Website With This Free Tool in 2024

Edit Any Website With This Free Tool in 2024

Sophia Conti
We’ve found a nifty little tool that will help you test how content looks BEFORE clicking the publish button. It lives in your bookmarks bar, and when you want to test a change on a website, you simply click the button and type whatever changes you’d like to make.

How to Install the Tool

Installing the free website editor tool is very easy. Simply highlight the code below and drag it to your bookmarks bar, where it will automatically save.

Here is the code to copy:

javascript:document.body.contentEditable = 'true';
 document.designMode='on'; void 0
wp free weebsite editor final 1

Now, it’s extremely tricky to get a single line of code like this to work perfectly on every device and browser, so you may need to troubleshoot a little. Here are some of the things I learned as I tested this tool:
  • If the code doesn’t save as a bookmark: Try adding it manually. Open your bookmark settings, click “Add new bookmark” (or equivalent field), and paste the code into the URL line. Name your bookmark something clear and concise, and try to edit a webpage.
  • If the code saves, but doesn’t let you edit webpages: You might need to make slight edits to the code. When saving as a bookmark, your browser might replace spaces with percent signs (%) or other characters that break the code. Edit your bookmark, and remove any extra characters. Be sure the code you have bookmarked exactly matches the code written above.
Many browsers guard against the use of Javascript code like this, so you may find it more finicky to use depending on what browser you’re running it on. Google Chrome did not let me save it as a bookmark. Safari and Microsoft Edge did, but I had to edit the code for spacing.

How to Use the Tool

Once you’ve installed the tool, all you have to do is navigate to the webpage you want to edit and click your bookmark. When you click on the page, you’ll see a flashing cursor that indicates you are ready to edit.

How the free website editor tool works
A silly example of how the tool works in real-time.
You can make whatever changes you like to the text of the page after clicking the bookmark. You can’t edit images or move buttons, but you can see if a headline is too long to fit on one line or if removing a paragraph will change the layout of your page above the fold.

Once you’ve made your changes, you can take a screenshot to save whatever you were experimenting with – there’s no other way to preserve your edits. To stop the tool from operating on your webpage, refresh the page. This will also make any changes you’ve made disappear.

Why Is This Tool Useful?

This tool is definitely fun to play with – I got a few laughs making funny news headlines and sending them to my dad – but we’re not here for pranks or becoming a fake news generator. We’re here because this tool is a simple, powerful way to test marketing or layout changes without having to edit source code or access a website builder.

Here are a few ways you can use this tool:
  • Test a headline to see if it fits in your layout
  • Experiment with paragraph length and formatting
  • Create several mockups of a webpage to show clients or stakeholders
  • Set up wireframes for a designer or developer to reference
  • Make multiple versions of landing pages to narrow down the options for an A/B test
Here’s an example. In the image below, I’m trying to see if I can add more text to this Apple landing page without needing a fourth line of copy. It works, but I can also see that I liked the original layout better. The whole process of testing this took about 30 seconds. (The process of typing perfectly so I could record the gif took about 10 minutes.)

Example of using the website editor tool
With this tool, you can try dozens of options without having to save, preview, or revert your changes.
If you’re a bit more code-savvy, you might be wondering why we wouldn’t just tell you to use the Inspect Element tool to edit the source code directly. It’s built in to the browser, so why not use that?

Well, you could go that route, but this tool is a much easier way to make quick, front-end changes. You don’t need to hunt for the right spot to change the HTML, because you can just click on the headline and start typing.

And of course, if you’re going to install this tool, you might as well have some fun with it. I enjoyed making myself look like a millionaire and daydreaming about the giant library I’d build in my house if I had this kind of money.

Example of using the website editor tool
Sadly, this balance decreased dramatically when I refreshed the page.

Get Started with the Free Website Editor

In just a few minutes, you can initiate the utilization of this tool. Simply incorporate it into your bookmarks right from this post, and proceed to experiment with its features. The tool’s functionality extends to this very page as well! Feel free to provide us with a humorous headline or insert a couple of playful sentences – your creativity is welcome.

Once you’ve figured out how it works, you’ll be amazed at how handy this little piece of code can be. It will live in your bookmarks bar, happy to help any time you need to make a quick change to show your web developer or create a simple mockup to prove to a client that your idea will actually look exactly the way they want it to.

Like this fun editing hack? Share it with others on Facebook and Twitter!
Rate this Article
4.5 Voted by 2 users
You already voted! Undo
This field is required Maximal length of comment is equal 80000 chars Minimal length of comment is equal 10 chars
Any comments?
View %s replies
View %s reply
1 Reply
It doesn't work, and this is already a problem, but apart from that but in your opinion what should be the actual usefulness of this code for a web developer?
1 Reply
Lier, it does work you need to drag it up to your new tab and then just get into a page and click on it and there it is finished.
Rishab Sharma
Please try https://ruttl.com to edit live website content. It is a website feedback tool on which you can collaborate with your team.
OOF, it works for me, i have tried many websites with the same exact thing but only this one works so maybe try a different site
Website Planet Team
Did you try the tips suggested in the article? Regarding the code, it wasn't necessarily designed for developers, but can help you test text/layout changes without having to edit source code or access a website builder.
Read more reviews
Related posts
Show more related posts
We check all user comments within 48 hours to make sure they are from real people like you. We're glad you found this article useful - we would appreciate it if you let more people know about it.
Popup final window
Share this blog post with friends and co-workers right now:

We check all comments within 48 hours to make sure they're from real users like you. In the meantime, you can share your comment with others to let more people know what you think.

Once a month you will receive interesting, insightful tips, tricks, and advice to improve your website performance and reach your digital marketing goals!

So happy you liked it!

Share it with your friends!

Or review us on