Enqueue Inline Styles

Being a developer, there are many times you’ll work on a project where you need to generate CSS dynamically based on the options in WordPress admin.

Ideally, we used to manually echo inline styles until WordPress 3.2. Now, from WordPress 3.3, there is a new function wp_add_inline_style() introduced which will help you create dynamic CSS and then attach it to the specific stylesheet. So, when the stylesheet is enqueued, your inline styles will appear in that stylesheet.

There are 2 different ways to enqueue inline styles:

  1. Your styles will appear sitewide if you attach it to the child theme’s stylesheet.
  2. Your styles will appear on specific pages if you attach it to a specific stylesheet that only loads on those specific pages.

Check out more information in WordPress Developer Guide.

Sample Code

Get instant free access to my monthly developer friendly newsletter where I'll share my best informative tips about WordPress and my Life Experiences.