Set up StyleScript

StyleScript is the free plugin WorkMore StyleScript: your site-wide CSS, JavaScript and the code that belongs in <head>, right after <body> and before </body>, in a real code editor with preview, history and safe mode — complete on its own. WorkMore StyleScript Pro, an add-on that will need it, adds code for single pages and ready-made effects; it is in development, and this page covers it once it is released.

What you need

• WordPress 6.0 or newer and PHP 7.4 or newer.
• An administrator who may add unfiltered HTML: every administrator of a single site, or a network administrator on a multisite. Other administrators see the code read-only.
• The free plugin. While WordPress.org reviews it, download it here: workmore-stylescript-1.0.0.zip. Once it is listed, install it from Plugins → Add New instead; a site that installed this zip updates from WordPress.org on its own — it is the same plugin, under the same name.

1. Install the free plugin

1. Plugins → Add New → Upload Plugin, choose the zip, Install Now, Activate.
2. Open Appearance → StyleScript. The CSS, JavaScript and Header & Footer tabs are the boxes; Header & Footer has three: In <head>, After <body> and Before </body>.

2. Write, preview, save

1. Write your CSS in the CSS tab.
2. Press Preview to see your real site beside the editor, with the code you have not saved yet — only you see it. CSS changes as you type; JavaScript and markup run when you press Run preview. The buttons above the page switch between desktop, tablet and phone widths.
3. Press Save, or Ctrl/Cmd+S. The code is live at once, and the page caches of common caching plugins and hosts are cleared. If your host caches pages some other way, clear that cache after saving.

Pasted a whole <script> or <style> block into the wrong box? The box says so and fixes it in one click. JavaScript has options under the editor: where it loads, whether it waits for the page, and whether it needs jQuery.

3. Bring in the code you already have

Tools → Bring in code from elsewhere finds the Customizer's Additional CSS and Flatsome's custom CSS and header and footer scripts, shows what it found, and moves it into the boxes after what they already hold. By default the original is emptied, so the code does not run twice. Every box keeps its history, so the move can be undone.

To move everything to another site, Tools → Export and import: an import shows what will change before anything is saved.

If something breaks

• History, in every box: compare an earlier version with the editor, line by line, and restore it.
• Tools → Open the site without custom code: the site without any of it — only you, only in that window.
• Settings → Print the custom code on the site: untick it to take all of it off for everyone, without losing anything.
• The dashboard is out of reach: add define( 'WMSS_SAFE_MODE', true ); to wp-config.php, or run wp stylescript safe-mode on. Nothing is deleted.

Pro

Pro will be a separate plugin, WorkMore StyleScript Pro, sold by Freemius; its price is on the pricing page, and its Buy button appears there the day it can be bought. It will install from the zip in your purchase email beside the free plugin, which must stay active. If a subscription lapses, nothing breaks: what you set up keeps running and stays editable.

Uninstall

Deactivating never deletes anything. Uninstalling removes the code, its history and the settings only if you ticked Settings → Uninstall; otherwise everything stays for a later reinstall.