Grid and Image Layout Toolbar Things

Updated Discourse to 3.2.beta so we get some new toys by default.

There is a new image grid that should work better than the last one, and has some center/left/right image placement that works nicely for articles and making things look fancier. The new toolbar below (you might need to refresh your browser/app page)

So a grid (first icon underlined in red on the left) would look like this:

If you don’t like pushing buttons you can just do this in text:

[grid]
piccy1
piccy2
[/grid]

The full docs are here

Image Alignment and Grid - theme-component - Discourse Meta

image

Although not sure how the left/right/center thing work, but someone will figure them out.

EDIT: Just looks like the image needs to be small enough for some text to be next to it.

9 Likes

quick question @fearlessfrog, how do you strike out text …
:smiley:

In Markdown it’s this, so that might work…

In Markdown it's [s]this[/s], so that might work..

Yep, matching [s] and [/s] around the text will do it.

3 Likes

This image grid will come in handy for the Christmas Flights! Thanks for the update!

2 Likes

A Centered Image Test

Here’s one set up to be in the center. Let’s see if that works.

If you put some text in within the image it also centers it like a caption. Cool.

Let’s Try a Right Hand Text Side One

Some sort of centered image as a text to see if that works. When uploading an image, in the preview side you can click the 100% / 75% / 50% overlay buttons to do a smaller ones as well.

This sort of shows how a 75% image can have the right hand side text, even if the image is a little too big for regular display. Not sure what more to say here, as I really want to just do enough text to get to the bottom the image but have run out of things to say. I could just keep typing I suppose as eventually the text will wrap around the image and let me continue on a whole new line. Is that really going to happen or not? The mystery is killing me. Well, not complete death but at least some mild anticipation.

Now I can do one on the right hand side, which is nice, although the image is still a bit too big. I'll set it to 50% now. There, much better. Ok, I've run out of things to test but still want the text to look like it belongs next to the image just to make sure it does actually go under? I mean it really should considering all I did was swap sides but there is some actual science going here.

Here is a 75% image with no left or right or center just to see if everything else is back to normal or not. So far it looks like the line will go under the image ok and it is all working like you’d expect the image layout to work.

Ok, all testing done.

7 Likes

That new grid layout tool is pretty great!

3 Likes

Yes, it’s awesome!

@tempusmurphy You can also strike out text with two “~~” around the text you want to strike, which is pretty easy to type.

3 Likes