The Settings tab controls the main behavior of MinimalCSS across your WordPress site. This is where you configure how the plugin should generate, test, and apply optimized CSS before moving on to page-level optimization.
For most sites, the Settings tab should be reviewed first. Once your general settings are saved, you can use the Page Inventory, Archive Inventory, Optimization, Images & Media, and Fonts sections to fine-tune performance improvements.
What the Settings Tab Is For
The Settings tab is used to configure the plugin-wide options that affect how MinimalCSS works on your site.
Depending on your setup, this may include:
- Choosing whether optimized CSS should run in test mode or live mode
- Controlling how MinimalCSS generates and loads optimized CSS
- Setting default behavior for pages, posts, and archives
- Managing background generation behavior
- Reviewing compatibility-related options
- Saving global preferences before generating CSS across the site
These settings help you safely test MinimalCSS before applying changes for all visitors.
Recommended First-Time Setup
When setting up MinimalCSS for the first time, we recommend starting carefully.
First, review the Settings tab and save your preferred defaults. Then generate optimized CSS for a small number of pages before using the full-site generation option.
A typical setup process looks like this:
- Open the Settings tab.
- Keep the plugin in a safe testing mode while you check your site.
- Generate CSS for a few important pages.
- Review the optimized versions of those pages.
- Confirm that the layout, design, menus, forms, sliders, and interactive elements still work as expected.
- Move to live mode only after testing the key pages on your site.
This workflow helps you catch theme or plugin compatibility issues before optimized CSS is shown to regular visitors.
Test Mode vs. Live Mode
MinimalCSS is designed to let you test optimized CSS before applying it sitewide.
Test Mode
Use Test Mode when you are first configuring the plugin or testing new optimization settings.
In Test Mode, you can generate and preview optimized CSS without immediately affecting every visitor. This is useful when you want to confirm that each page still looks and behaves correctly.
Test Mode is recommended when:
- You are setting up MinimalCSS for the first time
- You recently changed your theme
- You installed or updated a page builder
- You added new plugins that affect frontend design
- You want to compare optimized and bypassed versions of a page
Live Mode
Use Live Mode when you are ready for visitors to receive the optimized CSS generated by MinimalCSS.
Before enabling Live Mode, review your most important pages, including your homepage, service pages, landing pages, blog posts, archive pages, product pages, and contact forms.
Live Mode is recommended only after you have tested your key templates and confirmed that the site looks correct.
Safelisted CSS Selectors
The Safelisted CSS Selectors setting lets you tell MinimalCSS to always keep specific CSS selectors in the optimized CSS output.
This is useful when a theme, plugin, form, popup, menu, slider, or dynamic element uses CSS that may not be visible during the initial CSS generation scan.
MinimalCSS creates optimized CSS based on what it detects on the page. However, some elements only appear after a visitor interacts with the site, such as opening a menu, clicking a tab, submitting a form, triggering a popup, or using a filter. If those styles are not detected during generation, they may need to be safelisted.
Safelisted selectors help protect styles for dynamic or conditional elements.
You may want to safelist selectors for:
- Mobile menus
- Dropdown menus
- Sticky headers
- Popups and modals
- Form validation messages
- Success or error messages
- Sliders and carousel states
- Tabs and accordions
- WooCommerce notices
- Cart and checkout messages
- AJAX-loaded content
- Cookie banners
- Page builder animation states
For example, if a form error message or mobile menu state does not look correct after optimization, the related CSS selector may need to be added to the safelist.
Only add selectors that are actually needed. A very large safelist can reduce the benefit of CSS optimization because more CSS will be preserved.
After adding or changing safelisted selectors, regenerate CSS for affected pages and archives so the updated safelist is included in the optimized output.
Auto Generate on Publish
The Auto Generate on Publish setting allows MinimalCSS to automatically generate optimized CSS when new content is published.
When this option is enabled, MinimalCSS can detect when a new page or post is published and add it to the CSS generation process. This helps ensure that newly published content can receive optimized CSS without requiring you to manually generate it from the Page Inventory each time.
This setting is useful for sites that publish content regularly, such as:
- Blogs
- Resource libraries
- News sites
- SEO content sites
- Product-focused sites
- Client sites with ongoing content updates
Auto generation can save time and help keep optimization workflows consistent.
However, newly published pages should still be reviewed when they are important. If the page includes a custom layout, form, video embed, slider, popup, WooCommerce element, or page builder section, test the optimized version after generation.
If Auto Generate on Publish is enabled and a newly published page does not look correct, regenerate CSS for that page or exclude it from optimization while you review the issue.
Background Processing and Queue Behavior
Some MinimalCSS actions may run in the background, especially when generating CSS for multiple pages or archives.
When you generate CSS for many items at once, MinimalCSS may add those tasks to a queue. This allows the plugin to process optimization work more reliably without requiring you to keep the same screen open the entire time.
You can review queue activity from the dashboard or activity area, including items that are pending, running, completed, or failed.
For best results, start with a smaller batch of pages, confirm the results, and then use the Generate All CSS option when you are comfortable with the output.
Compatibility Tips
Because every WordPress site is different, some themes, plugins, page builders, sliders, forms, and dynamic elements may require extra testing.
After saving your Settings, test pages that include:
- Contact forms
- Sliders or carousels
- Navigation menus
- Sticky headers
- Popups
- WooCommerce carts or checkout pages
- Page builder layouts
- Image galleries
- Login or membership areas
If a page does not look correct after optimization, you can bypass optimization for that page or review the related inventory and optimization options.
When to Regenerate CSS
You should regenerate optimized CSS when major frontend changes are made to your site.
This may include:
- Updating your theme
- Changing global styles
- Editing page builder templates
- Adding or removing major plugins
- Redesigning important pages
- Changing header, footer, or navigation layouts
- Updating archive templates
- Changing font or media optimization settings
Regenerating CSS helps ensure that MinimalCSS is working with the latest version of your site design.
Suggested Settings Workflow
For most sites, use this workflow:
- Configure the Settings tab first.
- Generate CSS for your homepage.
- Test the optimized version of the homepage.
- Generate CSS for a few important service pages, landing pages, or posts.
- Review your Page Inventory and Archive Inventory.
- Exclude any pages that should not be optimized.
- Test important frontend features.
- Generate CSS for the remaining pages and archives.
- Move to Live Mode once the optimized pages have been reviewed.
This gives you a safer rollout and helps avoid applying optimizations too broadly before testing.
Troubleshooting
My page looks different after optimization
Bypass optimization for that page and compare the optimized and bypassed versions. If the issue only appears when optimized CSS is active, regenerate CSS for the page or review whether the page should be excluded.
I changed my theme or page layout
Regenerate CSS for affected pages and archives. MinimalCSS needs to work from the current version of your frontend layout.
A plugin update changed the design
Regenerate CSS for pages affected by that plugin. This is especially important for page builders, forms, WooCommerce, sliders, galleries, and layout-related plugins.
The queue has failed items
Review the queue or activity log to identify which pages failed. You can retry generation for those items or generate CSS for them individually.
I am not sure whether to use Live Mode
Stay in Test Mode until you have reviewed your most important pages. Live Mode should only be used after confirming that optimized pages display correctly.