How to edit webpages to print etc

To edit a webpage in your browser, e.g. if you want to delete some stray images or text before printing the page out (to save ink and paper, ever eco-friendly of course), here's a simple trick.

Go to the webpage you want to edit. Paste the following text (all the way to ""void 0") into your browser's address bar (hold down Ctrl and tap l to get there quickly), then hit Enter:

javascript:document.body.contentEditable='true'; document.designMode='on'; void 0

After that, if you click the mouse pointer in the webpage, e.g. on an image, you can delete it, or click in the body and you can change or delete text etc before you print out the page, save it, take a screenshot...

You'll notice the mouse pointer becomes a four-headed double arrow if you click or hover over certain areas of the page, so you can even drag text, photos or images around.

You can also resize certain areas by clicking and dragging. Just experiment and see.

Here's an example where I mucked around with my pal Kirk's blog:

Hat tip: Quick Online Tips. (A bookmarklet is also available, see e.g. Lifehacker, but I've found it doesn't work in all browsers. Where it works, you can just click it to make the current web page editable. For beginners: what are bookmarklets/favelets and how to use them.)

In Chrome the URL shown in the address bar actually stays unchanged!

Tags: trick, tricks, webpages, Improbulus, A Consuming Experience