What is the Page Editor
The Page Editor is our point-and-click interface that lets you modify any webpage without writing code. It's the fastest way to get started with PixieBrix.
You can access the Page Editor in the Chrome DevTools after you've installed the PixieBrix Extension. If you haven't installed the extension, follow the steps in Installing PixieBrix before going any further.
Open the DevTools
Navigate to the page you want to edit. Then, open the DevTools by doing one of the following:
- Windows: Control + Shift + I
- Mac: Command + Option + J
- Either: right-click and select "Inspect" from the context menu
Dock the DevTools to the Bottom of the Page
Chrome might open the DevTools panel along the left, right, or bottom of your browser. With PixieBrix, you'll want it along the bottom because the Page Editor's layout is optimized for a horizontal layout. If that's not its default position, click the three dots in the top right of the DevTools window, and select the "Dock to Bottom" icon.
Access the Page Editor
The DevTools has several tabs along the top. Click the one all the way to the right that says "PixieBrix". The Page Editor will look like this:
Chrome will not show the PixieBrix Page Editor (or any other DevTool extensions) on Chrome Web Store URLs
Excellent work! Now you're ready to Build a Workflow