Independent Publisher CSS caching / minify questions

  • Hi,

    I’m using W3TC (with minify mode set to auto) with the Independent Publisher theme, and I have two questions:

    1. The theme does an “Ajax call” (not really Ajax but more like linking to a dynamic stylesheet) to output theme customizer settings as CSS. I’ve noticed that this CSS isn’t minified or combined with the other stylesheets.

      It might not make sense to cache this, as it technically is dynamic, but since the customizer settings are not changed very often, it would be nice to be able to minify and cache this CSS. Is there anything I can do on my install or change in the theme to enable this?

    2. I would like to override some of the customizer CSS, so I have set up a child theme and made sure my child theme stylesheet is referenced after the customizer CSS in the output HTML. (Due to how the styles are enqueued in the parent theme, I ended up calling add_action('wp_enqueue_scripts', ...) with a larger priority value (lower priority) so that my child theme stylesheet is added last.)

      When I enable CSS minify though, my child theme stylesheet is minified/combined with the parent CSS and appears before the customizer CSS (the order of stylesheets is reversed), so now the customizer CSS is overriding my child theme styles. (As I mentioned in the previous question, the customizer CSS isn’t cached or minified/combined.)

      So with minify off, the ordering in the output HTML is:

    1. Parent stylesheets
    2. Customizer stylesheet
    3. Child stylesheet

    Then with minify on:

    1. Parent and child stylesheets (minified/combined)
    2. Customizer stylesheet

    I’ve adjusted my child theme stylesheet for this situation (adding !important where necessary), and I believe I can also work around this by switching the minify mode to manual and managing which stylesheets are minified/combined myself, but honestly neither work-around is very appealing to me.

    Is there something I can do in the child theme to avoid this situation? Or anything else I can do to help debug/fix this issue?

    Thanks!

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

  • 1. Add the url (can be partial, if i recall) to the external CSS in the Minify page — near the bottom of that page. It will then be minified and combined.

    2. Inside your action for wp_enqueue_scripts i assume you are using wp_enqueue_style for your css and so you can use the parameter to say your css depends on the customizer css so that it will force your css file to appear after the customizer one. For example: wp_enqueue_style( ... , ... , array( '<id of the customizer css goes here>' ) ); … this implies you would have to look into the parent theme to find the id of the customizer css id, which should be easy to find since it will be using wp_enqueue_style too ;P

    Thread Starter Jeffery To

    (@jefferyto)

    Thanks for your reply ??

    1. From the name of that field (“Include external files/libraries”) and the fact that it had “https://ajax.googleapis.com&#8221; by default, I originally thought it was only for JS files. (Also, as there are separate “never minify” fields for JS and CSS, I would have expected separate fields for “include external” as well.)

      Entering the entire stylesheet URL (https://example.com/wp-admin/admin-ajax.php?action=independent_publisher_customizer_css&ver=1.7) doesn’t appear to work, but entering the URL without the second query string parameter (https://example.com/wp-admin/admin-ajax.php?action=independent_publisher_customizer_css) or without the whole query string (https://example.com/wp-admin/admin-ajax.php) appears to work. (So I would guess this part of the code has issues dealing with the ampersand character.)

      But, looking at the minified stylesheet, the customizer CSS isn’t included ?? (Perhaps the plugin cannot access this URL, or maybe all wp-admin URLs? Maybe that’s why this stylesheet wasn’t automatically minified in the first place.)

    2. I did include the customizer CSS ID as a dependency, but because a) the parent theme doesn’t have dependencies set up between different stylesheets (instead relying on enqueue order only, probably because which stylesheets are enqueued is dynamic), and b) child theme functions.php is processed before the parent theme functions.php, what ended up happening was, the customizer CSS was output first, then my child theme stylesheet, then the parent theme stylesheets. So relying on dependency resolution was not enough to ensure the correct stylesheet order.

    Thanks again for the suggestion ??

    bgdstr

    (@bogdanstratulat)

    The field Include external files/libraries: also supports paths relative to DOCUMENT_ROOT. It only allows .js and .css files, so admin-ajax.php won’t work.

    Also it ignores the query string, so the plugins sees the URL as admin-ajax.php

    The child theme stylesheet should not only have a dependency to the customizer CSS, but also to the parent theme stylesheet. That way it will always be included last.

    Thread Starter Jeffery To

    (@jefferyto)

    The parent theme has multiple stylesheets that are dynamically enqueued (depending on site configuration), so I believe having the child theme depend on all of the parent theme’s stylesheets would be problematic… For now at least I can have my child theme stylesheet be included last by passing a lower priority to add_action(). (This isn’t my issue with W3TC though.)

    So is there any way I can have the customizer stylesheet minified and cached? Is it by design that (using auto mode at least) references to admin-ajax.php are excluded, or are there technical limitations that prevent this from being possible?

    Thanks again ??

Viewing 4 replies - 1 through 4 (of 4 total)
  • The topic ‘Independent Publisher CSS caching / minify questions’ is closed to new replies.