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.
Accessing the Page Editor
To head to the Page Editor, go to any web page and right-click on the page (this opens something called the Context Menu). Click Inspect, the last option at the bottom, which opens the Chrome Dev Tools.

- Windows: Control + Shift + I
- Mac: Command + Option + J, or use F12
Although it looks a little scary, we’ll fix it fast!
First, change the dock to appear at the bottom of the screen, rather than the right side. Chrome might open the DevTools panel along your browser's left, right, or bottom side. 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, you can easily change it. Click the three dots in the panel's top right corner, after the gear icon and before the “X”.
Then, select the second to last option for Dock side.
Finally, select the PixieBrix tab in the top toolbar of the Dev Console.
Now, you’ve made it to the PixieBrix Page Editor!
Excellent work! Now you're ready to Build a Workflow