Theme Options CSS changes do not reflect in the preview

Support
#1

Hi!

This was an old issue I have reported few months ago. It was fixed, then accidentally slipped into a newer update, and then fixed again.

Unfortunately, it happens again. At lest to me:

I go in a Blog post, then click “Theme Options”. When I edit the CSS, nothing happens. I can even Cut the whole CSS, and all will be the same.

The only way to work is to cut CSS, save, and paste it back. But at that time all site is unstyled. Not ideal.

Can this be fixed?

Thank you!

#2

Hi There,

I couldn’t replicate this issue on my end:

Could you please purge all the caches or temporarily disable it then check again?

Thanks.

#3

Hi, please excuse me for not being clear enough.

From your video, I don’t see the same issue.

To replicate, please do this:

  1. Go to the sample post. It has lot of styles, like the border under the slider. Go to Theme Options.
  2. Have CSS partly opened, so you can see the content preview.
  3. Now watch the content. Select all Global CSS and delete it. Content preview should instantly get unstyled, as a result of the deleting the CSS. Instead, it stays as is.

Thanks!

#4

Hello Misho,

Thanks for updating the thread. :slight_smile:

I checked the website and the blog page. I can see that you are not using content builder to create blog posts. I then opened the the sample post URL and theme options CSS panel. In CSS panel I see that most of the CSS code is related with blog, membership, etc. For ex, when I removed the code related with single blog post and saved the changes, upon reloading the page changes are getting related.

I also see code related with navigation menu. I changed the color code and changes are getting reflected. I have recorded a screencast. Please take a look. Please try clearing the cache and see how it goes.

Thanks.

#5

Hi!

I have just realized, when I do that change in the menu, it works!

But, if I do change to a blog posts, it doesn’t.

My video is in the Secure note: First I do your change, and I get same results. Then I am trying to remove the green bottom border from the featured image assigned to the “Nutrition” category. I comment out the rule, but the border doesn’t go away.

Then I remove the CSS, save the page, and paste the CSS back in. Now when I comment out the border, it does take effect.

When I have reported this back in Last November, this was Alexander’s reply:

Continuing the discussion from X 5.2.4 - Live preview of Cornerstone custom CSS changes gone:

Hi Misho,

Thanks for brining this up. I’ve been able to confirm it as a bug. It’s because in the preview window, the custom CSS from your previous revision is being added to the page at a point after the dynamic preview CSS is inserted. This results in the preview not updating. It works on brand new pages, but on existing pages the old CSS stays in place.

We’ll see about getting it fixed for the next release. I’m sorry, regretfully I don’t have a good workaround for this until it’s fixed officially. You could remove all the CSS and save, then paste it back in to work on it (before saving again) but this leaves your live page without the custom styles for that window of time while you’re editing. It’s also cumbersome.

Is it possible that the same issue is back?

Thanks

#6

Hey Misho,

I’m not sure if it’s related because updating the CSS property works. It only does not work if you comment it out or remove the declaration all together. See https://youtu.be/UuEbeKRzBjU

It’s the same thing happening in your site as you can see in the secure note. I also see that you use // to comment out a line in CSS. Just wanted to say that it should be avoided because that might cause syntax errors. Please use block /* */ commenting only.

Thanks for reporting.

#7

Hi Thanks!

That // was just a quick one to show that it doesn’t work. It is exact same problem I have reported a year ago, and @alexander replied to me then that it IS a bug.

You can see on my video that it is happening again. I cannot update the CSS and see the live preview of it. (Apparently only the one that affects blog posts).

The only way to get the preview is to delete all CSS and paste it back.

But ok, if it is just me, then I’ll try to isolate the issue.

Thanks!

#8

I’ve tested further and it looks like it depends on the environment. See https://youtu.be/38RIfEbAABA. I’ll add this to my report.

Thanks.

#10

Hi @Misho,

Quick heads up, we’ve pushed an update today that corrects this issue.

#11

That broke my site…

My site isn’t reading the global css in theme options.

see here:

Summary

heydayconsulting.com

the blog is now full width, even though I added css to theme options to make it narrower

about page is too wide. I added an id to that section, then called it in theme options css, and it’s no longer making the change.

#12

Hi @alexander!

I confirm the bug with the new update: All Global CSS is now not being applied on the front-end.

Thanks!

#13

I’m sorry everyone - please try the most recent update which corrects that issue.

1 Like
#14

Just tested on the Staging. 2.3.7. issue is solved.

And it seems that now CSS edits are also working. Great!

Thanks!

#15

Great! Thanks for confirming.

1 Like
#16

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.