[Resolved] Reference customizer colors in custom CSS

Home Forums Support [Resolved] Reference customizer colors in custom CSS

Home Forums Support Reference customizer colors in custom CSS

  • This topic has 5 replies, 2 voices, and was last updated 3 years ago by Elvin.
Viewing 6 posts - 1 through 6 (of 6 total)
  • Author
    Posts
  • #1685811
    George

    Is there a way to reference Customizer colors in my custom CSS? Basically, I am looking for functionality that changes all references of a certain color found in the Customizer that is also used in my custom CSS. For example, when I use CSS to underline the menu link color with the color value of the primary menu hover color: I would like that color to change in my CSS when that color is changed in the Customizer.

    Does that tie in with the Global Colors currently in development or is there something I can do right now?

    #1686073
    Elvin
    Staff
    Customer Support

    Hi there,

    By custom CSS, do yo mean the one you’ve added on Additional CSS within the customizer?

    I’m not sure I fully understand what you mean. Do you mean to dynamically change the custom CSS you’ve added when you change something from options available within the customizer UI?

    If so, I believe that’s not doable with PHP as the custom CSS added there are not dynamic. The things you add there hardcoded and directly saved as a hidden post within the database.

    If you want variable CSS you may have to do something like this:
    https://css-tricks.com/css-variables-with-php/

    #1686368
    George

    By custom CSS, do yo mean the one you’ve added on Additional CSS within the customizer?

    No, when working with a Child theme and a separate CSS file.

    Do you mean to dynamically change the custom CSS you’ve added when you change something from options available within the customizer UI?

    Yes

    If so, I believe that’s not doable with PHP as the custom CSS added there are not dynamic. The things you add there hardcoded and directly saved as a hidden post within the database.

    How does GP store values from the Customizer?

    #1687381
    Elvin
    Staff
    Customer Support

    No, when working with a Child theme and a separate CSS file.

    You can try adding the values as PHP variable strings and set apply_filters() to their values.

    How does GP store values from the Customizer?

    While it differs on how its served depending on how you set it (inline vs. external CSS), they’re saved on the database’s wp_options table under the option name of generate_dynamic_css_output.

    https://share.getcloudapp.com/L1uNlbQq

    They’re all clumped into one string so this will be difficult to deal with.

    While you can attempt to pluck the values you need from the string using this filter, but I’m not exactly sure that’ll work.
    https://github.com/tomusborne/generatepress/blob/e030f57d2c26991074a6868265737424dac567d0/inc/css-output.php#L1156

    #1711771
    George

    Sounds messy. Thanks anyway!

    #1713307
    Elvin
    Staff
    Customer Support

    No problem. 😀

Viewing 6 posts - 1 through 6 (of 6 total)
  • You must be logged in to reply to this topic.