Custom CSS/JS - Customizer
Default theme settings may differ if you have imported one of the OceanWP prebuilt website templates for WordPress. This is because these templates come with their own Customizer settings. However, the way you use the Customizer to adjust your website remains the same.
The OceanWP Customizer Custom CSS/JS panel enables you to add custom CSS and JS code to your website.
By default, the WordPress Customizer contains a panel called Additional CSS, which enables you to add custom CSS codes only. When the free Ocean Extra plugin is enabled in combination with your OceanWP theme, this panel becomes Custom CSS/JS, due to the extended features we offer.
Available Custom CSS/JS options include:
CSS code
In the CSS code box you can add custom CSS to override your theme, plugin or other website's elements' appearance / behavior which is controlled by CSS only.
Check out the OceanWP CSS Library for available custom CSS snippets.
By default, WordPress gives priority to all CSS rules added in the Customizer (otherwise custom CSS wouldn't function).
If you're using a child theme, we also recommend using the Custom CSS option in the Customizer, instead of adding codes in to the style.css file in the child theme, since this requires more coding skills and knowledge.
Custom JS
In the Custom JS box you can add custom JavaScript, Vanilla, jQuery and other JS libraries custom codes.
While adding custom JS codes, you don't need to insert the script tags (<script> ).
Found an error in this doc or believe it needs improvement?
Send us a prepurchase ticket, include the URL of the page, and add suggestions and more details about how we can make things better for you.
That's it!
Enjoy building your WordPress website with OceanWP!