Hello @lencw,
Thank you for reaching out. I’m Ravi from the Spectra support team, and I’m happy to assist you with your query.
Thank you for the detailed report, and we are sorry for the trouble this has caused.
We can confirm this is a known issue specific to the Spectra Info Box block, and you have diagnosed it correctly. With WordPress 7.0, the way custom CSS classes get added to blocks changed, and the class is now injected onto the outermost HTML element of each block at render time. After our recent move to the newer Gutenberg Block API, the Info Box block is not exposing that outer element the way WordPress expects, so the custom classes get dropped from the frontend output. This is why they still show in the editor but never appear when you inspect the page.
This has already been logged as a confirmed bug, and a fix has now been prepared. It is currently going through verification and QA on our end before it ships, as we want to be sure it is fully tested. We do not have an exact release date just yet, but resolving this is a priority, and we will keep you informed once the fix goes out in an upcoming version.
In the meantime, here is a workaround that should bring your styling back. Since your CSS targets those classes, placing them on a wrapper around the Info Box gives the same result.
- Select the Info Box block and remove the custom classes from its Advanced settings, under Additional CSS class(es).
- Wrap the Info Box inside a Container block.
- Select the Container block, open its Advanced settings, and add the same CSS classes in the Additional CSS class(es) field.
- Save the page and check the frontend.
Custom classes on the Container block render correctly, so your styling should apply just as it did before.
Please give that a try and let me know how it goes. We are here to help if you run into any issues.
Have a nice day ahead!
Thread Starter
lencw
(@lencw)
Hi Ravi, thanks for confirming. I found another workround before reading your reply. As these are the only info blocks on that page, I targeted using the page class and general infoblock class instead. Thats worked, and ensures just on that page. I note your solution for future reference, thanks. Will be back to being easier when the fix comes out – thanks for the update on that.
Please consider this closed.
Hi lencw,
Thank you for the update, and we are glad to hear you found a solution that works well for your setup.
Targeting the styling through the page class and the general info block class is a smart approach, and as you noted, it keeps everything scoped neatly to just that page. That works perfectly until the fix is out.
We will keep working on the proper fix for the custom CSS classes on the Info Box block, and we will share an update once it ships in an upcoming version. You are always welcome to switch back to using the per block classes once that is resolved.
Thank you again for your patience and for taking the time to share your findings. It really helps.
We hope you have a wonderful day ahead!
