Exclude a Single Page from Inline & Defer CSS

  • Resolved jsg442

    (@jsg442)


    5 years, 3 months ago

    Hello, relative CSS newbie here so apologies in advance if this is an easy question. I’m using the Divi theme along with Autoptimize’s Inline & Defer CSS option. Just on the blog posts page of my site (link included), this option is causing weird things to happen. It has something to do with the Salvatorre JS function that Divi runs in its Blog Module. At first, the content was not displaying at all on first page load, but I corrected that with the following CSS fix from a previous support post that I found (thank you Frank):

    .et_pb_blog_grid .et_pb_salvattore_content[data-columns] .et_pb_post{opacity:1 !important;}

    Although this solved the display issue, now there is another issue where on the first page load, the grid displays one single column instead of three, resulting in ugly oversized blog post blurbs. Although there may be another way to correct this using CSS, I’m thinking the easiest option in my case would be just to exclude this one page from the Inline & Defer CSS option. Is there a line I can add to the Critical CSS to accomplish this?

    I am aware of how to retrieve a page’s post-ID number in WP, which I assume would be necessary to target the page.

    Thank you in advance for any help.

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

Viewing 6 replies - 1 through 6 (of 6 total)
  • Plugin Author Optimizing Matters

    (@optimizingmatters)

    5 years, 3 months ago

    sure; create new manual rule to target that specific page and set the critical CSS for that rule to none.

    hope this helps,
    frank

    Thread Starter jsg442

    (@jsg442)

    5 years, 3 months ago

    Hi Frank, thank you for your fast response. I have to apologize because I just noticed a very recent post here that you answered already dealing with the same issue. As with that poster, I am actually not using the premium Critical CSS service. In that case you had offered a solution to adjust some PHP, but I’m afraid that is a bit beyond my level at the moment. Guess there is no easy way to do this otherwise? Thanks again very much for your help.

    Plugin Author Optimizing Matters

    (@optimizingmatters)

    5 years, 3 months ago

    in that case tweaking the CSS more might still help? check the full CSS for mentions of salvattore and copy/ paste those into your critical CSS until it works? 🙂

    Thread Starter jsg442

    (@jsg442)

    5 years, 3 months ago

    Sure, will give it a shot and update if there is any progress. Thanks again

    Thread Starter jsg442

    (@jsg442)

    5 years, 3 months ago

    Seems like that did the trick! I have not been able to reproduce the glitch after heeding your advice. In case it will help anyone in the future, below is what I found from the full CSS and pasted into critical CSS. Appreciate your assistance Frank.

    .et_pb_column_4_4 .et_pb_blog_grid .et_pb_salvattore_content[data-columns]:before{content:'3 .column.size-1of3'}.et_pb_column_3_4 .et_pb_blog_grid .et_pb_salvattore_content[data-columns]:before,.et_pb_column_2_3 .et_pb_blog_grid .et_pb_salvattore_content[data-columns]:before{content:'2 .column.size-1of2'}.et_pb_column_1_2 .et_pb_blog_grid .et_pb_salvattore_content[data-columns]:before,.et_pb_column_3_5 .et_pb_blog_grid .et_pb_salvattore_content[data-columns]:before,.et_pb_column_3_4 .et_pb_column_3_8 .et_pb_blog_grid .et_pb_salvattore_content[data-columns]:before,.et_pb_column_1_3 .et_pb_blog_grid .et_pb_salvattore_content[data-columns]:before,.et_pb_column_2_5 .et_pb_blog_grid .et_pb_salvattore_content[data-columns]:before,.et_pb_column_1_4 .et_pb_blog_grid .et_pb_salvattore_content[data-columns]:before,.et_pb_column_1_5 .et_pb_blog_grid .et_pb_salvattore_content[data-columns]:before,.et_pb_column_1_6 .et_pb_blog_grid .et_pb_salvattore_content[data-columns]:before{content:'1 .column.size-1of1'}

    • This reply was modified 5 years, 3 months ago by jsg442.
    Plugin Author Optimizing Matters

    (@optimizingmatters)

    5 years, 3 months ago

    great job jsg442 !

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

The topic ‘Exclude a Single Page from Inline & Defer CSS’ is closed to new replies.