Cut and paste one line of code to make any website editable
Have you ever wanted to edit the web pages of another website? This simple line of code makes it possible.
Of course you can’t actually edit the actual web page but you can edit the page as you see it on your screen.
This is one of the ways scammers create fake screenshots, fake Adsense & affiliate earnings and even fake Paypal transactions.
All you need to do is visit the site you want to edit, paste the code below into your web browser address bar (tested in Firefox & IE7) and hit the Enter button.
Then simply select a portion of text on the page and start editing.
javascript:document.body.contentEditable='true'; document.designMode='on'; void 0















Now, I understand, how the affiliate marketers, and the authors of the million dollar secret formula actually operate.
Thanks.
Silki July 7, 2008 10:39 am | Reply
That’s quite scary - I knew it was possible by altering the HTML and resaving somewhere, or by doing some Photoshopping, but that’s just much simpler.
Rob Lewis July 7, 2008 12:22 pm | Reply
Like Rob I knew it could done but never realised how quick it could be. I suppose this is just one of a number of ways it could be done though. Guessing the lesson here is always beware what links you are sent?
Stuart Smith July 7, 2008 1:48 pm | Reply
[...] noticed this did not work in Gmail. This is tested and is known to work in Firefox 3 and IE7. [via blogstorm.co.uk] Tags: Firefox, Internet Explorer 7, Javascript, Web developmentLike this post? Subscibe [...]
Edit Any Webpage Directly From Your Browser | Hackosis July 7, 2008 2:09 pm | Reply
You are aware that the editong happens only inside the momory of your browser??? You can edit what you want but you will not be able to save your “Work”
So it is just a funny joke that will not harm your pages in any way.
visitor July 7, 2008 4:54 pm | Reply
Yes I’m aware of that. Pretty cool though.
Patrick Altoft July 7, 2008 4:56 pm |
Replydid you even read the post?
“Of course you can’t actually edit the actual web page but you can edit the page as you see it on your screen.”
Dean July 8, 2008 12:47 pm |
ReplyHehe, awesome hack, Patrick. I’m not too sure about disclosing this little secret right here, who knows what scams might occur if it falls in the wrong hands :<
Tibi Puiu July 7, 2008 7:01 pm | Reply
Seriously…you guys are morons. Like you said, this does NOTHING WITH THE HOSTED VERSION.
it’s just a few seconds easier than saving and modifying the source locally.
moron@moron.com July 7, 2008 7:16 pm | Reply
I think that you may have missed the point that Patrick is trying to make, here - it’s not about editing the hosted version at all. It’s about being able to easily forge things like screenshots, and go “look at this! Here’s a screenshot of an actual Adsense page, with over $10m in earnings!”. It doesn’t matter whether the changes get saved or not - it’s simply about being able to create fake screenshots easier.
Luke July 7, 2008 9:38 pm |
Why wouldn’t they just download the page and edit it. There are tons of scripts that already do this. There are tons of editors that do this for you online too (like FCK Editor).
I feel like I’ve jumped back in time to 2001 when this was new.
moron@moron.com July 8, 2008 12:01 am |
Yesterday a friend of mine came to meet me at my office.
I last saw him some years ago at high school.
He talked for long about earnings he was raising through adsense. Sitting at my desk, using my firefox, he showed me (after a short phone call I had to answer) his huge adsense earnings on the adsense profile.
But after reloading the page, it revealed as a fake.
I think this is the kind of story this link is about.
Many would trust what they read on *theyr* screen, not wondering about hitting F5 to test it out.
And many more can, with a bookmark, fake screenshots without learning html or at all.
btw, I never trust screenshots, do you?
otacon July 8, 2008 1:50 pm |
Wow. There is one thing I really love about this — with firefox, you can save the edited page.
I’ve always wanted a decent editor that could just work w/ templates.
Seriously — got a tipjar?
bofh July 7, 2008 7:22 pm | Reply
I should also mention, it will save the various Editibles into the final document, so be sure to remove before upload if you do this
bofh July 7, 2008 7:25 pm | Reply
This works in Safari as well!
Matthew July 7, 2008 7:35 pm | Reply
This is very cool and scary
Sphurthy July 7, 2008 7:37 pm | Reply
[...] Cut and paste one line of code to make any website editable. [...]
Misbehaving Monkey » Blog Archive » Cut and paste one line of code to make any website editable July 7, 2008 7:40 pm | Reply
Fair enuff, but wats the point if i cant save my designs????
prags July 7, 2008 7:40 pm | Reply
@ visitor, not true.
@ prags, just make the changes you want then “Save Page As…..” under “File” in Firefox. This does not change the way the page is served up from the internet, but you can save a changed version of it to your desktop or something.
2oonhead July 7, 2008 8:40 pm |
ReplyThis should be handy for note taking (other than using some other firefox extensions). I just made this code a bookmarklet. Now for writing papers and such, I can find a web page, click my bookmarklet, make notes, then save the web page w/ notes. Much faster than editing source, and better formatting than copying to Word/notepad/whatever, and adding notes there. If someone has a better way of taking notes, point me to the extension.
nobody July 7, 2008 7:47 pm | Reply
so then how would you edit a website with a blank index.html tag so you can edit the files in that same folder!?
hmm July 7, 2008 8:10 pm | Reply
Works in Opera too. Neat trick!
mgroves July 7, 2008 8:19 pm | Reply
[...] to Blogstorm for this little [...]
Fakey fakey fake fake? | A Buck A Night July 7, 2008 8:39 pm | Reply
[...] even makes the images repositionable and resizable ( streeeeeeetch! ) Here’s the original post: Cut and paste one line of code to make any website editable __________________ WordPress and phpBay Pro [...]
Editing your Earnings Pages - WickedFire - Affiliate Marketing Forum - Internet Marketing Webmaster SEO Forum July 7, 2008 8:47 pm | Reply
You can also do this within Firebug. Very cool, and you don’t need a plugin.
Mac Tips July 7, 2008 8:59 pm | Reply
[...] (Via) [...]
JASON PRIESTAS » Website Editing with a Little JS July 7, 2008 9:00 pm | Reply
Actually the ‘title’ is possible:) Just put a simple script and make your site editable in 7 minutes.
Users Guide ScreenCast:
http://www.core.gen.tr/videos/asli9.swf
Desginers Guide ScreenCast:
http://www.core.gen.tr/videos/asli101.swf
Product Info:
http://www.core.gen.tr/#coretal
evrim July 7, 2008 9:20 pm | Reply
That’s insane! very c00l for developers to mess around with ideas, layouts ….
Chris Architect July 7, 2008 9:37 pm | Reply
Holy hell this is insane. I had no clue it was this easy to do…
SoLinkable July 7, 2008 9:45 pm | Reply
The dangers don’t lie in screenshots, they lie with people who edit hidden form values to change item prices, and people who edit AJAX for malicious purposes.
Sure the changes aren’t saved on the server, but that doesn’t mean the page stops being able to interact with it.
noptical July 7, 2008 9:47 pm | Reply
Why would you include item prices in your hidden values. There is no need for that and is bad design. Item prices should be stored server-side (a database for example).
If your webshop needs you to have item prices in the hidden values, then you should try another webshop.
Peter Stuifzand July 8, 2008 11:19 am |
ReplyWhile trying it on various sites in my favorites list, found that funnyordie.com displays only a login form after entering this javascript url in the address bar. All images and text from the page are hidden.
Jeff July 7, 2008 9:50 pm | Reply
[...] Cut and paste one line of code to make any website editable - Still believe those get-rich-quick screenshots? [...]
Linkblog - June 28th to July 7th | wibbler.com July 7, 2008 10:01 pm | Reply
this is madness! Its actually quite fun to play with though
Durkin July 7, 2008 10:03 pm | Reply
[...] clipped from http://www.blogstorm.co.uk [...]
How to make a website editable? « 8-bits of Coffee July 7, 2008 10:42 pm | Reply
Or you could just use Firebug and it’s a lot easier, cleaner, and faster…
CaptainObvious July 7, 2008 10:51 pm | Reply
In Firefox, once you type the command in the address bar and hit enter, grab the command and drop it into the bookmarks toolbar, then right click, properties, change name to “Edit” and there you have it, a nice little button handy for when you need it.
Tipper July 7, 2008 11:40 pm | Reply
That’s pretty wild stuff. It definitely explains a lot of the clickbank “earnings” I’ve seen from a lot of folks.
Zibby July 8, 2008 12:40 am | Reply
Is there any /other/ line of code which can allow me to save and use a page as an offline web application?
lefty.crupps July 8, 2008 1:17 am | Reply
Any way to add this the the head of an HTML file to make it permanent and automatic to visitors?
d00d July 8, 2008 1:22 am | Reply
[...] Cut and paste one line of code to make any website editable “paste the code below into your web browser address bar javascript:document.body.contentEditable=’true’; document.designMode=’on’; void 0″ (tags: viapopular hack javascript edit editor code) [...]
links for 2008-07-08 « Talkabout July 8, 2008 4:56 am | Reply
Works in Opera 9.50
Larry July 8, 2008 4:58 am | Reply
Ummm… have you guys never heard of the “firebug” firefox plugin?
It lets you edit the DOM live, even the dynamically generated stuff.
In other words, there are actual tools for this - most of them are for debugging your own web development. Thinking this kind of thing is important is like thinking it’s important that someone knows that my username bought a hard drive on ebay last year. Ooooh, scary!
liquidpele July 8, 2008 5:40 am | Reply
OMGWTF, you people ain’t heard of Firebug yet?
redivide July 8, 2008 6:05 am | Reply
[...] Jul. 8th 09:01 h one line of code to edit them all (webdev) visit weblink 0 [...]
gfrast / Daily hand picked web links - mixed with a shot of reality. July 8, 2008 8:01 am | Reply
hey, 2001 called and wants its leet hax back!
ralph natterbough July 8, 2008 8:39 am | Reply
This is quite scary.
Donno how much scam had already been done and how many affiliate marketers have laughed all their way to the banks.
Team Nirvana July 8, 2008 8:42 am | Reply
Phew! I used to do this using FF and FireBug. But this is much cooler!
S July 8, 2008 9:40 am | Reply
You do realise that everyone is going to test it on your page?
Great trick!
Vineetgupta July 8, 2008 11:39 am | Reply
haha nice one.
ben July 8, 2008 12:01 pm | Reply
This is also a standard feature of Opera.
To edit the source:
1. View > Source (Or Ctrl+U)
2. Make the edits in Opera’s color-coded Source Editor
3. Click “Apply Changes”
Bam, site’s edited.
Also, with the developer tools you can view all of the scripts, DOM, and all of the errors that show up in the code.
Tools > Advanced > Developer Tools
It’s cool to see that you can do this in IE, though.
ODP July 8, 2008 1:04 pm | Reply
Does it illegal for this work?
I am new comer know not much about that.
phetrs July 8, 2008 4:32 pm | Reply
how does it work?
phetrs July 8, 2008 4:34 pm | Reply
[...] place on the internet that will make youtube commenters seem intelligent by comparison » Cut and paste one line of code to make any website editable » USA National Gas Temperature Map Surprise, surprise. Gas prices are lowest in red states, [...]
Mulling It Over July 8, 2008 6:44 pm | Reply
You can do this with Firebug… And more. Kudos anyway, it works in IE at least.
Harry Roberts July 8, 2008 8:28 pm | Reply
Freakin awesome now i can edit microsoft,ibm,sony website and take screenshots.Thats it!
Kamal July 8, 2008 8:44 pm | Reply
Very cool
ext July 9, 2008 12:01 am | Reply
I just tested it out on this page using Firefox 3. Amazing. (Maybe I can trick my
moroninexperienced kid brother into thinking I’m magic after I hide the URL bar…)turnthebeataround July 9, 2008 5:27 pm | Reply
Also works in Safari on a Mac
Lars July 11, 2008 8:36 am | Reply
Omniweb has had this feature for years. Very helpful when troubleshooting code.
The anecdotal story about fake adsense earnings is hilarious. I can’t quite believe it though.
Wordpress SEO July 12, 2008 9:59 am | Reply
good, useful article.
paresh July 13, 2008 10:40 am | Reply
Have you ever wanted to edit the web pages of another website? No, just my sites.
oMan July 13, 2008 11:15 pm | Reply
Thanks for sharing this simple yet powerful javascript code.
Enamul July 17, 2008 3:15 pm | Reply
I have been using the edit features of the Web Developer toolbar for what seems like years to do this while testing out html and CSS. The Scrapbook extension for Firefox is nifty too. It allows you to download a local copy of a webpage but you can erase the parts of a page you don’t want first- e.g. you just want to save the text and delete sidebars, footers, images etc…
Sueblimely July 22, 2008 2:15 am | Reply
Thats pretty cool,
Fake Adsense Stats
montsa007 July 26, 2008 8:01 am | Reply
Wow. I just tried that and it is a bit scary. However, will be neat to play joke on my sons with it.
Peace
Robert July 28, 2008 5:20 pm | Reply
Wow, now I think this infomation is worth more than the books “millionaire authors” sell.
Nishi July 30, 2008 12:24 am | Reply
U can turn editing off by entering
javascript:document.body.contentEditable=’false’; document.designMode=’on’; void 0
and the edit mode will be off.
CodyG!!!!! August 3, 2008 1:49 am | Reply
[...] Cut and paste one line of code to make any website editable - Still believe those get-rich-quick screenshots? [...]
Linkblog - August 2nd | wibbler.com August 3, 2008 9:00 am | Reply
Ok now I have to try it…
betty August 8, 2008 5:39 am | Reply
[...] Cut and paste one line of code to make any website editable - A quick and dirty method to make any website editable, right in your browser’s screen! Is that how affiliate marketers really operate? [...]
Thursday Links Roundup #7 - Putting Blogs First August 15, 2008 6:38 am | Reply
[...] Edit Mode for Web Pages. [...]
tasteslikeangry » Moar link dump. Weirder this time. August 20, 2008 6:29 am | Reply