The editor

Snipfire → Snippets opens the editor: a full-screen app inside WordPress built on Monaco, the editor engine behind VS Code.

The sidebar #

• + New: create a snippet. Pick the type: PHP, HTML, CSS or JavaScript (with Pro also SCSS and LESS).
• Search snippets…: searches titles, descriptions, folders, locations, tags and IDs.
• Filters: All, On, Off, Errors (and Testing with Pro), plus All types.
• The snippet list, with folders you can open, close, rename and drag snippets into. Tick checkboxes for bulk actions.
• Links at the bottom: Tools & safe mode, Snippet library (see The snippet library), Import, Export all, Classic view, and with Pro Activity and Git sync.

If Snipfire finds snippets in another snippet plugin, the sidebar tells you, for example Found 32 snippets in 6 other plugins — Import them →. See Switching from another plugin.

The toolbar #

From left to right:

Under the editor, the Problems panel lists errors and warnings. Click one to jump to its line. After Run, the Run output appears here too.

The settings panel #

Everything about how, where and when the snippet runs. Which fields you see depends on the type:

Hide the panel for more room with ⋯ → Hide settings panel.

Keyboard shortcuts #

Snipfire adds these to Monaco's usual shortcuts. Use Cmd instead of Ctrl on a Mac.

A few of Monaco's own that come in handy:

Themes #

The editor has a dark theme (the default, VS Code-like) and a light theme. Switch with ⋯ → Light theme / Dark theme. The choice is remembered in your browser.

Unsaved changes #

If you open another snippet or leave the page with unsaved changes, Snipfire asks first: Discard unsaved changes?

When someone else has the snippet open #

On a site with several people in Snipfire, two of you may open the same snippet. Snipfire keeps you from overwriting each other's work without knowing it.

• Who else is here. While you have a snippet open, a banner shows anyone else who has it open too: Maria also has this snippet open. If you both save, the last save wins. The editor checks once a minute, so it can take a minute to appear or go away.
• A newer version was saved. If someone else saves the snippet while you have it open, you see Maria saved a newer version at 14:32. with Load it (or Load it (drops your changes) if you've changed something). Loading it gives you their version to carry on from.
• Saving over someone's newer save. If you save anyway, Snipfire stops and asks: Someone else saved this snippet, Maria saved this snippet at 14:32, after you opened it. Saving now would overwrite their changes. Click Save mine anyway to replace their version with yours, or cancel and open History to see what they changed. Their version stays in the history either way.

Changes made by Git sync, WP-CLI or an import count as someone else's save too.

For scripts: the REST API does the same check when you send base_modified, and answers 409 when the snippet changed. See REST API.

Banners above the code #

Besides the ones above, the editor may show:

• Read-only. You can look at the snippet but not change it, with the reason, for example You can view snippets but not change them. See Team access.
• PHP is turned off for Snipfire on this site (SNIPFIRE_DISABLE_PHP in wp-config.php), so this snippet can't be switched on or run. See Locking Snipfire down.
• From the snippet library: what to fill in before you switch on a snippet from the library.

Your language #

The editor follows the language in your WordPress profile (Users → Profile → Language), so two people can work on the same site in different languages. See Languages.