PageEdit is a powerful WYSIWYG editor that lets you edit any HTML page in Chrome, and allows syntax color highlighting in source editing mode. The extension makes it easy to edit webpages and view them directly in the browser. PageEdit can particularly come in handy for web developers and designers who want to test or experiment with their own websites. Once you’ve installed the extension, click the button right next to the URL bar when browsing a webpage, and a toolbar with extensive options will be added to the top of the page. PageEdit also offers users with settings for the skin and toolbar options. The skin can be set as default, Office 2003 or v2 from a drop-down menu, whereas the toolbar can either be set as default or basic. You will notice that the basic toolbar offers you with fewer editing options as compared to the default one.
After installing the extension, click the extension’s icon (a notepad & pencil) to enable the toolbar option. For the fully featured toolbar, the top line contains elements that you can add and a button for viewing the soure code. The second line of controls has text editing buttons. You can start editing page elements by selecting either one of the buttons on top or by interacting with the existing elements on the page. To remove an element on a web page, select it and use the delete key. Elements like text, headers, images and iFrames can all be removed and/or added.
When you change the settings for the extension and switch to the basic toolbar, just the basic editing tools remain available. You can then edit a webpage and view the changes at the same time.
Right-click an image and click the Image Properties option, and a pop-up will appear over the page with the image Preview, URL, Width, Height and other options. You can edit these values and view how an image looks.
When you’re done with all the editing, simply click the Save button in the toolbar or click the Print button to print the customized page. You will then be able to either save HTML file or Download the page. Select an option, depending on your preference, and you’re good to go!
Note that the changes will disappear when you reload the page, so save the page before you navigate away from it. The extension can be used to test how changes in font size or images would make a website look, and it can also be useful when taking screenshots. Install the extension from the link below and try it out for yourself.