[Resolved] CSS class is not picked up by blocks advanced tab
This is the technical support forum for Toolset - a suite of plugins for developing WordPress sites without writing PHP.
Everyone can read this forum, but only Toolset clients can post in it. Toolset support works 6 days per week, 19 hours per day.
No supporters are available to work today on Toolset forum. Feel free to create tickets and we will handle it as soon as we are online. Thank you for your understanding.
Tell us what you are trying to do?
I'm trying to style an image to a css class that is in the content template but it does not work.
On the first screenshot ("First image"), you can see that the image is there without any style.
I have added the class "certificado" on "Second Image" and you can see it styles it but not with the right coordinates.
"Third image" I have the css code and on the forth is how it shows.
The example is in the actual page on the bottom but that view uses the classic view which I will not be using it anymore. I'm switching everything to blocks.
How can I make this image stay where it suppose to stay (like the example screenshot)?
As for your original question, I was able to add the class 'certificado' to image block, through its option in the 'Advanced' tab.
( screenshot: hidden link )
Note: On the front-end, it is added in the 'figure' tag that encloses the image.
As for following the older view's layout, the same CSS code won't work for this block view because the structure of the HTML/markup that is generated by this block is completely different from the one generated by the classic/legacy one, where you have full control over the exact HTML/markup.
This means that for this block view's output, you'll have to rewrite your CSS code according to the different HTML/markup.
Is there any specific reason for redesigning your already built views through the blocks editor? Also, we don't recommend mixing the blocks based views with the other page builder like Elementor. They are designed to work in the blocks-based (Gutenberg) environment and so for the content generated through the other page builders, it is safer to use the classic/legacy views.
As for the images not getting centered, it looks likes some CSS styles from the Elementor are interfering with this. To override them, you can include the following custom CSS code in your content template's CSS editor:
Is there any specific reason for redesigning your already built views through the blocks editor?
So when Toolset introduced Blocks, I was interested in maybe switching from Elementor to Toolset and Gutenberg so there would be less plugins, less code and faster response for the site. That is the reason I wanted to use blocks, but I needed to make sure that everything worked fine and similar to the ones I previously build using the classic view.
Now knowing that the structure mark up is different I might have to keep the classic view and continue using Elementor.
Btw, Elementor has a new widget which is Loop Builder. Is that similar to Views? Could I use that widget to style my custom post and show it like View does?
Yes, keeping the classic/legacy views would be better, as the newer blocks-based views are suitable for the websites using Gutenberg as the primary editor.
The concept of the Loop Builder feature from the Elementor seems similar to the views. You're welcome to consult its official documentation and support to know about the exact functionalities and styles it offers.