Embedding images the Boomla way

2017-05-16

Preface

Boomla had one obvious usability quirk for a long time. If you wanted to embed an image into a block of text, like the one on the right here, you had to put the page in text editing mode via the Toolbar’s Edit tab, then upload the image into the text, resize it, float it to the right, and generally fight your way through the hacky nature of positioning the image inside the text, which is amazingly hard.

I have seen lots of people struggle with this, and I struggled explaining them about the invisible character that represents the image in the text; that removing this invisible character removes the image, and generally how positioning the image as an invisible character works. It was hard to learn, definitely not intuitive. In the end, it turns out very few people use it. After a couple of days, all they remember is to stay away from this feature, they rather add a gallery between text blocks.

Frankly, I don’t use this feature either.. =o

Eureka

One of you, Zoltán told me it would be really cool if he could embed anything in a text block. That request kept me thinking for a while. It wasn’t the first time I was asked for this, Tamás asked for this feature over 5 years ago, but at the time Boomla was definitely not ready for it. Now, it was, except I had no idea how to do it. The text editing mode of Boomla is a different world. You don’t see the file icons any more, thus you can’t drag-drop things around. And besides, I didn’t want to add functionality to a feature that never felt right in the first place.

In Boomla, the filesystem hierarchy is meant to contain all the relationships. A gallery is not referencing images. A gallery contains images. But a text, it has to know where the image has to be shown, the invisible character. In this case, the image is primarily referenced from within the text. And that causes all sorts of problems.

Realizing I have to get rid of this made it all click. The image must never be embedded in the text in the first place. Instead, there should be various layout apps with predefined places for the text and the image.

Solution

I released the app layout.boomla.net with exactly that feature.

Consequences

It works so well I’m going to completely wipe out the old image embedding mechanism. The old way never suited the Boomla philosophy.

Funnily, the best features may be those where I’m not adding, but removing code.


Cheers,

Zupa