Page Builder 
Widgets Bundle 
SiteOrigin CSS 
Installer Setting animations to widget affects custom CSS
Hi there! I love Siteorigins and have used it to build close to 60 websites. So I want to start with a huge thank you!
This seems like a new issue.
– If I add a custom class to a SiteOrigin Editor widget, the styles all show up fine.
– If I add an animation to that widget (like fade in right), the animation works but the custom styles all disappear.
– If I turn off the animation, the custom styling comes back.
It’s not the end of the world because I don’t need animations, but every now and then I like to add one for effect.
Any thoughts?
This is our free support forum. Replies can take several days.
Need fast email support? Get SiteOrigin Premium
Replies
5Hi curio
Thanks for your support and kind message. I’m unable to replicate the issue at the moment. I’ve added a class name via the Attributes field; it seems to be in place even with a widget level animation added. Is there perhaps a page I can check to see the issue in action?
Thank you so much for your reply!
Sure! I can show you – Here's the site in progress:
https://1232757.us8.myftpupload.com/
I duplicated the row below the hero banner so you can see one with animation and one without. I'll try to leave those extra rows up until tomorrow (when I will need to clean them up to show the client their home page).
While doing that, I actually found a fix (!!), but I thought I'd show this to you in case you find it interesting!
– Widget class with no animation = fine
– Widget class with animation = custom styles ignored
– Switch class from widget to column = fine with animation!
Maybe this is why I've never seen this happen before. This client has a million side-by-side items, and I have the cells set to stretch — and I'm using the Siteorigins Column customizer interface to add background colors.
Thanks for the test page, that helped a lot.
Looking at the page source, I don’t think this is coming from Page Builder itself. The animation being applied, is that perhaps your theme’s built-in Page Builder animation feature — Ascend by Kadence Themes (you can see it adding kt-pb-animation kt-pb-fadeInRight classes to the widget).
What appears to be happening is that when Ascend adds its animation classes to the widget, it replaces the widget’s class attribute rather than adding to it, which wipes out your custom eyebrow class. That would explain everything you’re seeing: the class survives at the column level because the theme only touches widget classes, and disabling the animation brings the styling back.
Kadence seems to have fixed this exact issue in their Virtue theme. Perhaps reporting the issue to Kadence might help?
In the meantime, adding the class at the column or row level, as you’ve been doing, is a solid workaround.
Hope that helps. If anything doesn’t match what you’re seeing, let us know and we’ll take another look.
Cheers, Andrew
Ah ye, that makes sense!
Thank you again for your help and insight.
We love siteorigins over here. Please never go anywhere!
Glad we could take a look. Thanks again for your support and replies; it’s most appreciated! Cheers for now. Andrew