Display Real Colors in Embeds Instead of CSS Variables
This snippet resolves color rendering issues in JetEngine components embedded via oEmbed by converting CSS variables into actual color codes, ensuring accurate color display in popups and external embeds.
Specifications
Display Real Colors in Embeds Instead of CSS Variables
5 January, 2026
-
Plugin
-
Category
-
Programming languages
Installing Instruction
How to Add Snippets into the functions.php File of the Active Child Theme
- Copy the required code snippet to your clipboard.
- Navigate to WordPress Dashboard > Appearance > Theme File Editor.
- Click the functions.php tab to open the file.
- Paste the code snippet below the existing code in the Selected file content: area.
- Click the "Update File" page.
Example Use Case
Use this snippet whenever you embed JetEngine components externally via oEmbed but encounter issues with CSS variables not rendering correctly. This ensures that dynamic colors show properly, improving visual consistency.
Applicable scenarios:
- Marketing sites and landing pages — maintain accurate brand colors in embedded popups or widgets.
- Portfolio sites — retain design consistency in embedded components on other platforms.
- External content sharing — ensure color fidelity when JetEngine content is embedded outside the main site.
Specifications
Display Real Colors in Embeds Instead of CSS Variables
5 January, 2026
-
Plugin
-
Category
-
Programming languages