[Resolved] Visual Editor / Unsemantic Framework

[Andy]

Hi,

I have used the Unsemantic Framework in the WordPress Text editor to create 3 columns. However I notice if you switch to the WordPress Visual Editor and start a new line by pressing enter it breaks the columns, this is because by switching back to the text editor I can see it adds a new container element.

Is there anyway around this issue other than using a drag & drop page builder as I will need my clients to be able to use the visual editor.

Cheers.

[Tom]

You can try out my lightweight grid columns plugin: https://wordpress.org/plugins/lightweight-grid-columns/

It uses the Unsemantic Framework to create columns using shortcodes so WP can’t mess with the markup.

Let me know 🙂

Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/
Ongoing Development: https://generatepress.com/ongoing-development

[Andy]

Looks great, I will see how we get on with the current setup, but for future builds I think I will use your plugin.

[Tom]

Awesome.

HTML in the WordPress editor can definitely be a pain – hopefully you get it working right 🙂

Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/
Ongoing Development: https://generatepress.com/ongoing-development

[donnacavalier]

I know this is an old thread, but I’m just now dealing with converting an old Microsoft Front Page site with table layout into GP/WP, and I’ll be converting the tables to use Unsemantic grid divs instead. I can’t use the Lightweight Grid plugin, because it will be too difficult to convert the original code mess into shortcodes. So the result will just be divs with the Unsemantic grid classes.

I’m wondering if anyone has been thinking about what it would take to convert Unsemantic grid divs to Gutenberg blocks. I imagine it’s probably not possible right now, since Gutenberg doesn’t yet have column ability, but in the future, it would be sweet to be able to automagically convert GP’s Unsemantic grid code, so that users could use the editor to manage it all without using text/html editor/block.

Not sure anyone will even understand what I just said, LOL. Not sure I understand what I just said. 🙂

[Tom]

I would personally look into CSS Grid – it’s the future of columns. Unsemantic uses floats, which still work great. However, you might as well use the newer stuff straight off the bat 🙂

Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/
Ongoing Development: https://generatepress.com/ongoing-development

[Author]

Posts