Image Alignment

(Christoph) #21

I figured out that even a theme component can access the plugin api, so I’m guessing it could br done with api.decorateCooked?

(Christoph) #22

This is not working for me and I can’t figure out why. When I follow the instructions, only one line of text moves next to the image, everything else stays beneath it. It’s as if the image is rendered as part of a text line.

Like this:

And this is the code:

Update: I checked the page source and found that the data-theme-image="left" bit doesn’t make it into the rendered post. Does that mean that the whitelisting of data-theme-* attributes is not working? If so, how to turn it on?

In fact, isn’t it just DIV[data-theme-*] that is whitelisted?

I also wonder how to use the image code that discourse creates by default when pasting an image, like
![image|200x200](upload://hOBZ8Ar3ig1hNyZMDnaCgEgqrmA.jpg) in combination with the img tag.


I’ve done a plugin with some formatting options, center, align right, float element, color. You can activate/deactivate any option

It’s using bbcodes tho, it may not be as clean as other options

(Kris) #24

Oh yes, totally right - you’d need to wrap the image in a div with the data attribute first, then it should work. I updated my previous post to reflect that.

Yes, I believe so because the [floatl] tag would need to be whitelisted. As you mentioned, with a theme component you’d be able to include the relevant CSS, and a toolbar button to enter the div.

(Samuel Leuenberger) #25

Given last update was 6 month ago, are there been some standardization in Discourse’s supported markdown for a float tag ?
Or is @Steven’s proposal above the most achieved thing available to an admin that want to provide proper image alignment to its forum’s users?


Welcome to the community!

I didn’t see any major update in the markdown engine regarding this kind of feature. You still need the plugin.

Maybe there are other options available, what I can say is that the plugin still works with the new versions of Discourse