settings customizer

  • Resolved andi0tx

    (@andi0tx)


    5 years, 5 months ago

    Hello,
    I noticed that whatever you set in the customizer, these settings are applied inline, which results in quite long inline styles if you change a lot of the default values. Also, it makes it difficult to add additional media query styles in the child theme css since the customizer settings are inline and can’t be overridden in the child theme.css…would it be possible to not have the customizer settings applied inline?

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

  • Hi @andi0tx

    Suki uses internal CSS (via <style> tag in the <head>) to apply the modified settings CSS. And yes, it could be quite long if you did a lot of modification on the Customizer.

    We have an idea to make all settings CSS saved in a static CSS file for faster rendering. But this feature is not yet in our near release roadmap, and we might include this functionality as a premium module along with other optimization features. Currently, we don’t have further details on this.

    About the Child Theme CSS, you should use our starter child theme. It already includes the right “hook” to enqueue the child theme CSS after the parent theme CSS and settings CSS.

    You can download our starter child theme on GitHub: https://github.com/sukiwp/suki-child

    Regards,
    David

    Thread Starter andi0tx

    (@andi0tx)

    Hello,
    thank you for your reply. It would be great if you could include the settings in an external file, I know several themes which do this by default.

    Regarding the child theme: I am using the child theme you are providing, but still, additional css does not get applied when you already hace settings in the customizer. For example: I set my h1-page title styles in the customizer. Now I want to specifically target my h1 above 1600px, so I use a media query but it does not get applied becuase the h1- inline styles from the customizer settings are used.

    Sure, we would implement this in the future.

    Regarding the Child Theme: you’re right. Looks like you have to use !important on your CSS. We would improve this in the future.

    Thread Starter andi0tx

    (@andi0tx)

    Yeah, and that’s definetely NOT how it should be…

    So would you currently suggest copying the inline styles from page source and moving them into the child theme’s css instead? It’s around 1200 lines…

    No, you can keep the internal CSS as it is.

    I meant the custom CSS in the Child Theme. You can use !important on each your custom CSS to make it in higher priority than the generated internal CSS.

    Thread Starter andi0tx

    (@andi0tx)

    Yeah, I understand, that’s what I meant: Using !important is not really the best way to write css…

    The thought of adding the inline css into the child theme and reseting the customizer was for performance reasons…do you think it would increase performance?

    By the way, I just noticed that changing h3 line height in the customizer does not get applied (I checked the h3 in the blog grid title) and it’s still the default 1.5 em. Also, when you change header, footer or content padding to em instead of px, and then later you come back to the customizer, the values arestill correct, but instead of em it displays px.

    The generated settings CSS is processed on every request. If you moved the generated inline CSS into the Child Theme’s style.css, it will be faster on the backend side, although it’s not really noticeable, just a few milliseconds.

    On the other hand, this means your page will have an additional request on the frontend which the Child Theme’s style CSS.

    I would check the h3 and unit issue.

    Theme Author sukiwp

    (@sukiwp)

    Hi @andi0tx

    Just checked the h3 line height, it works fine. Did you know that blog grid title can be separately configured in “Small Title”? Maybe you have configured the Small Title line height.

    About the unit issue, we will fix it in the next release.

    Regards

Viewing 8 replies - 1 through 8 (of 8 total)
  • The topic ‘settings customizer’ is closed to new replies.