Edit the content of a Web page in Safari

Suppose you want to print a Web page, but it contains some extra text that you don’t need. Or perhaps you want to grab a screenshot of a page, but don’t want some personal information on it to show. Hints reader canisbos points out that you can make most content on any Web page editable or removable with a simple JavaScript command:

document.body.contentEditable = true

How to implement that command? The solution canisbos proposes is to use Safari’s JavaScript console. That means first enabling the Develop menu (under Preferences -> Advanced), then choosing that menu’s Show Error Console option. You can then enter that JavaScript code in the Console and press Return.

There are actually easier ways to do the same thing: First, you can just paste javascript: document.body.contentEditable = true into Safari’s location bar and hit Return. Or—even easier—you can embed the Javascript in a bookmarklet, which will then trigger the shortcut. You can create such a bookmarklet by entering the code in the location bar, then dragging its favicon to your bookmarks toolbar; if that’s too much trouble, drag this link instead: Make It Editable.

But, wait, there’s more: The hint from canisbos was actually inspired by an earlier hint from rab777hp.That tip requires you to enable Safari’s ever-helpful Develop menu, too. Then, when you see a snippet of text that you’d like to modify, right-click on it and choose Inspect Element from the contextual menu. (If the text you want to edit isn’t immediately apparent in the resulting Web Inspector panel, use the search box at the upper right.) Once you find the text you want to tweak, right-click on it, and choose Edit Text. Type away to your heart’s content, and then hit return. The Web page you’re modifying will update instantly.

And sorry, would-be defacers: Any tweaks you make will be visible to you alone (until you refresh); they won’t affect what anyone else sees when they visit that page.