How to add custom CSS to a specific page of your WordPress site ?

Since WordPress 4.7, you can add custom CSS to your website from the live customizer in the "Additional CSS" tab. This is very useful, but this custom CSS will applied globally to the entire website. So how to add custom CSS only to a specific page ?

With the free Nimble Builder WordPress plugin, you can add custom CSS, scoped to specific page of your site : post, page, archive, 404 page, etc. It means that your custom CSS will only be applied to this page and not globally. Any CSS changes you make will appear in real time preview in your draft, just like other changes made in the customizer, this means you have time to safely test and tweak the look of your site, and publish only when you are happy with it.

If not done already, install Nimble Builder from your WordPress administration :

  1. Log into your WordPress site.
  2. Go to: Plugins > Add New.
  3. Search for â€˜Nimble Builder’.
  4. Select Install Now

Then navigate to the page for which you want to add custom CSS. Click on Nimble Builder's icon in the WordPress admin bar

Open Nimble Builder menu and select the " Current page options"

Expand the Custom CSS editor and start writing CSS code.

Not sure how to use Cascading Style Sheets (CSS) code? No worries, we have created a few pages of documentation to help you get started :

Did this answer your question? Thanks for the feedback There was a problem submitting your feedback. Please try again later.