Basic Usage

While logged in as an admin, open any page of your Wordpress site’s front end, such as your home page.

Opening Mobius

Click the Mobius button ( the mobius ring ) in your browser's lower right corner. This button toggles the visibility of the Mobius Dashboard.

The Mobius Dashboard

The Mobius Dashboard looks like this:

a screenshot of a WordPress site with Mobius open, showing a mobile preview, a CSS editor, and the published site in the background.

The Output Pane on the left is hidden at first. Click the Device Previews button to view it.

Try adding CSS in the CSS Editor. For example, type the following the CSS Editor:

body {
   background: green;
}

Your changes should reflect instantly in the Output Pane as well as on the page, behind the Mobius Dashboard, similar to when you update CSS using your browser’s developer tools.

However, unlike with developer tools, you can save your changes in Mobius directly to your WordPress site by clicking the Save button, or by using Cmd (Mac) | Ctrl (PC) + S to save.

When you want to close your Mobius Dashboard, click the Mobius Toggle again. You can also use the keyboard shortcut of Cmd (Mac) | Ctrl (PC) + M.

On this page