Descripción
Tired of copy-pasting the same CSS across multiple pages? Studio Noir Custom Page Styles lets you write a style once and reuse it on any page — no duplicates, no maintenance headaches.
Key Features
- Write custom CSS directly in the page/post editor
- Upload CSS and JavaScript files
- Select unlimited existing styles with drag & drop reordering
- Choose header or footer loading for JavaScript files
- Automatically generates CSS files for better performance
- Choose which post types to enable
- Secure and WordPress coding standards compliant
Perfect For
- Adding unique designs to landing pages
- Customizing individual blog posts with external libraries
- Managing page-specific styles without bloating your main stylesheet
- Reusing common style patterns across multiple pages
- Adding JavaScript effects and animations to specific pages
How It Works
- Edit any page or post
- Find the «Custom Page Styles» meta box
- Upload CSS/JS files, select existing styles, or write custom CSS
- Reorder styles by drag & drop to control load order
- Publish and see your styles in action!
Load Order
Styles are loaded in the following order for maximum flexibility:
- Selected styles (base templates)
- Uploaded files (libraries and frameworks)
- Direct CSS (final adjustments and overrides)
Support Development
If you find this plugin helpful, consider supporting its development:
Your support helps me continue creating free, open-source WordPress plugins!
Capturas
Instalación
Automatic Installation
- Go to Plugins > Add New
- Search for «Studio Noir Custom Page Styles»
- Click «Install Now»
- Activate the plugin
Manual Installation
- Download the plugin zip file
- Go to Plugins > Add New > Upload Plugin
- Choose the downloaded file and click «Install Now»
- Activate the plugin
After Activation
- Go to Settings > Custom Page Styles
- Select which post types you want to enable
- Edit any page/post and find the «Custom Page Styles» meta box
- Start adding custom styles!
FAQ
-
Can I use this on custom post types?
-
Yes! Go to Settings > Custom Page Styles and select which post types you want to enable.
-
Will this work with my theme?
-
Yes, Studio Noir Custom Page Styles works with any WordPress theme.
-
How many styles can I apply to one page?
-
Unlimited! You can select as many existing styles as you need, upload multiple CSS/JS files, and add custom CSS – all on the same page.
-
Can I control the order styles are loaded?
-
Yes! Use drag & drop to reorder selected styles. The order you set determines the load order.
-
What file types can I upload?
-
CSS (.css) and JavaScript (.js) files only. Maximum file size is 5MB per file.
-
Where should JavaScript files be loaded?
-
You can choose header or footer for each JS file. Footer is recommended for most cases (default).
-
Where are the uploaded files stored?
-
Uploaded files are stored in
/wp-content/uploads/sn-cps-styles/{post_id}/to keep files organized by post. -
Does this affect site performance?
-
No, CSS is generated as separate files and only loaded on the relevant pages, which is better for performance than inline styles.
-
Can I use this with page builders?
-
Yes, Studio Noir Custom Page Styles works alongside page builders like Elementor, Gutenberg, and the Classic Editor.
-
What if the meta box doesn’t appear?
-
- Make sure the plugin is activated
- Check that the post type is enabled in Settings > Custom Page Styles
- Click «Screen Options» at the top of the editor and make sure «Custom Page Styles» is checked
Reseñas
No hay valoraciones para este plugin.
Colaboradores y desarrolladores
«Studio Noir Custom Page Styles» es un software de código abierto. Las siguientes personas han colaborado con este plugin.
ColaboradoresTraduce «Studio Noir Custom Page Styles» a tu idioma.
¿Interesado en el desarrollo?
Revisa el código , echa un vistazo al repositorio SVN o suscríbete al registro de desarrollo por RSS.
Registro de cambios
2.0.1
- FIX: Save to Library and Sync to Library now correctly use the current textarea CSS instead of the stale database value
- FIX: Syncing to Library no longer clears the Library entry’s CSS when the post had not been saved first
2.0.0
- NEW: Style Library — manage reusable CSS as independent entries (Custom Post Type)
- NEW: «Save to Library» button — register a page’s CSS as a named reusable style
- NEW: «Sync to Library» button — overwrite or fork an existing Library entry
- NEW: Automatic migration from v1.x data to Style Library entries
- NEW: Migration error notice with Retry / Dismiss actions
- NEW: Trash warning when a page with unregistered CSS is moved to trash
- IMPROVED: Style selector now uses Library entry names instead of page titles
- IMPROVED: Library entry deletion cleans up CSS files, uploaded files, and page references
- IMPROVED: Uninstall routine now removes all v2.0 data (CPT, meta keys, options)
1.1.1
- SECURITY: Enhanced path traversal protection in ajax_remove_file()
- SECURITY: Added MIME type validation using finfo_file() in ajax_upload_file()
- FEATURE: Automatic filename conflict resolution (adds -1, -2, etc.)
- IMPROVED: File upload security with comprehensive validation
1.1.0
- NEW: Unlimited style selection (previously limited to 2)
- NEW: Drag & drop reordering for selected styles (ACF-style sortable UI)
- NEW: File upload feature for CSS and JavaScript files
- NEW: Choose header or footer loading for JavaScript files
- NEW: Files organized in post-specific directories
- IMPROVED: CSS load order optimization (selected uploaded direct CSS)
- IMPROVED: Security enhancements for file uploads (type validation, size limit)
- IMPROVED: Better UI with visual feedback and file management
1.0.2
- IMPROVED: Style loading priority optimization
- Set
wp_enqueue_scriptshook priority to 20 - Custom CSS now reliably overrides theme styles
1.0.1
- SECURITY: Enhanced CSS sanitization (WP_Error support)
- SECURITY: Additional dangerous pattern detection
- SECURITY: File size limit added (1MB for CSS)
- IMPROVED: Better error handling with Transient API
- IMPROVED: Path traversal attack prevention
1.0.0
- Initial release
- Custom CSS per page/post
- Reuse existing styles feature
- Post type selection
- Automatic CSS file generation
- Security: SQL injection prevention
- Security: CSS sanitization
- Security: File path validation



