Kadence Theme Font Issues Due to Malformed CSS Variables – Need Help

  • saeedashifahmed

    (@ripulahmed)


    1 year ago

    The Kadence theme contains invalid references, which primarily occur when using WP Rocket. This causes fonts to load incorrectly.

    Details:
    Many invalid references exist in the Kadence theme, resulting in improperly loaded fonts. For example, the CSS displays malformed variables such as:

    font-family: var( —-global-body-font-family, inherit );

    These appear incorrectly as:

    font-family: var( u002du002dglobal-body-font-family, inherit );

    Questions:

    1. How can I fix these invalid references?
    2. Is there a way to clear or resolve them?
    3. Could you clarify if these references are valid in any way?

    I am not a CSS expert, but this issue was flagged in a report from the WP Rocket support team. They advised me to contact Kadence support for a resolution.

    Screenshot: https://d.pr/i/09mAJL

    The page I need help with: [log in to see the link]

Viewing 9 replies - 1 through 9 (of 9 total)
  • architalevelup

    (@architabasandrai20)

    1 year ago

    Hi @ripulahmed,

    I tried replicating the issue on my website, but everything appears to be working correctly—the CSS references are loading as expected. Check the screenshot of my website page source code: https://share.zight.com/Blue0XX5

    Since you’re using the WP Rocket plugin, could you try disabling it and temporarily turning off the “Remove Unused CSS” feature? This might be affecting how styles are applied. Let me know if that helps, and I’d be happy to assist further!

    Best,
    Archita

    Thread Starter saeedashifahmed

    (@ripulahmed)

    1 year ago

    Hi @architabasandrai20

    Thanks for your response.

    Even if I disable WP Rocket and remove it completely, the issue remains same. Currently disabled, you can check, the invalid reference u002du002dglobal is still there.

    Can I perform find and replace from u002du002dglobal to —-global? Using Plugin like String Locator?

    Just curious, are you from Kadence? @architabasandrai20

    architalevelup

    (@architabasandrai20)

    1 year ago

    Hi @ripulahmed

    Yes, I am from Kadence Technical Support.

    I tested the CSS issue by enabling the WP rocket on my website, but unable to replicate the issue. Check the screencast here: https://share.zight.com/bLu2DOjo

    Can you check for plugin conflicts?

    You can use the Health Check & Troubleshooting plugin to deactivate plugins on your website temporarily. This plugin allows you to put your website in troubleshooting mode. This allows you to activate and deactivate plugins without affecting your live website.

    Can you try running your website in Troubleshooting mode with only the active Kadence Theme and Kadence Blocks plugins?

    Then, can you see if you experience the same issue? https://www.kadencewp.com/kadence-theme/knowledge-base/troubleshooting/temporarily-deactivating-plugins/

    I haven’t personally used this plugin String Locator, so I can’t guarantee how it will handle the replacement. I’d recommend testing it on a staging site first to ensure it doesn’t cause any unexpected issues.

    Let me know if you need any guidance!  I am happy to help.

    Thread Starter saeedashifahmed

    (@ripulahmed)

    1 year ago

    Hi @architabasandrai20

    I need some additional help with CSS. WP Rocket provided me with an incorrect piece of code.

    I have documented everything here: https://docs.google.com/document/d/1Jmbbk6kZOZtPEAI21kjKH-h8xmEY-pBouHaTXnJWyho/edit?usp=sharing

    I just want to know if a theme update from Kadence will fix any coding errors I may have made while editing the CSS.

    architalevelup

    (@architabasandrai20)

    1 year ago

    Hi @ripulahmed

    I saw you have already opened a support ticket. I have already forwarded your issue to the dev team.

    I will update you as soon as I hear back from them.

    Thanks.

    Thread Starter saeedashifahmed

    (@ripulahmed)

    1 year ago

    Alright. Looking forward!

    architalevelup

    (@architabasandrai20)

    1 year ago

    Hi @ripulahmed

    I’ve checked, and my colleague Victor has already replied to both your support ticket and the forum thread.

    To help keep everything organized and make the process smoother for you, we recommend continuing the conversation through your support ticket. That way, we can track everything in one place and assist you more efficiently.

    Thanks

    michael-levelup

    (@michaeltarongoy)

    1 year ago

    Hi @ripulahmed ,

    We just want to follow-up on this.

    I noticed that this topic has been inactive and I also saw that you haven’t replied to the support ticket yet.

    Were you able to get this sorted out already?

    If you haven’t and you still need assistance, please continue the conversation on the support ticket.

    We appreciate your continued patience and understanding regarding this matter.

    Kind Regards,
    Michael Taro

    Bonn

    (@bonnstellar)

    9 months, 2 weeks ago

    This topic has been inactive for more than 2 months. I’ll proceed to marking this as resolved.

    If you have further questions or need additional assistance, feel free to start a new topic or refer to our Kadence Theme documentation here.

    Thank you for your understanding!

Viewing 9 replies - 1 through 9 (of 9 total)

The topic ‘Kadence Theme Font Issues Due to Malformed CSS Variables – Need Help’ is closed to new replies.