Using UIKit in page/post content


I know, this may sound silly ... but I've been trying to do some experiments using UIkit's components to style content elements. The text on page, using grid to create columns, but it feels clumsy at best when doing it right within the editor in wp.

To give an example. Say you have the template structure, everything is in place, but on the actual post you have two addresses you need side by side underneath a descriptive text.

My instinct was to code that within code view. Creating a set of nested divs with responsive UIkit styles attached, using the UIkit grid, so that one div is full width holding the description, followed by two medium divs (one set to left, othr set to right) each containing an unordered list with icons.

After a few minutes, the page editing became unresponsive, and previewing was an art on its own.

I know, there probably is a way to use beans to create reusable content elements, but that is so far beyond me that for the time being it is probably best I keep things simple while being out of breath on the learning curve. And yes, I could probably snag a plugin for some live page editor, but I'm not very fond of vendor lock-in (I admit, I used Visual Composer once. Once. Still have nightmares).

Aside of dynamic methods I haven't figured out yet using beans straight up, are there any ways or tools or best (better) practices I am probably - being a novice - unaware of to approach such matters?


Hi J.C.

While adding some HTML within the editor is "ok", it should surely not be used to build complex layouts as it is not meant to do so. WordPress was initially a platform built for blogs before it became much much more, and Beans is exactly the same.

The correct approach if you need more advance layouts (not just a blog) is to build your backend and organise the content to feed the front end layouts. This is usually done using Custom Post Types and custom fields. You can use Beans Fields API or other plugins such as ACF which allows you to control fields via the admin so you don't need to code them. Once your content is organised properly, you can code your front end using the power of Beans and UIkit.

Unfortunately, there are some steps you can't skip if you want to build proper websites. Beans gives wings and all the tools to achieve it pretty quickly and effeciently. The truth is that building proper websites requires some work and education, no matter what people say!

For info, this discussion is related to this matter.

Cheers,

PS: kindly search the forum for similar discussions and add your say, instead of creating a "duplicate". This makes discussions more valuable and easier to find for other users.

Write a reply

Login or register to write a reply, it's free!