I am trying to figure out how to get two or more images to appear side by side. Currently when I drag images into a post, their previews appear one below the other. I’ve tried bracketing the images I’d like to appear on the same row with p and using nobr between the image links to no avail. I’m assuming that Markdown is generating html to show each image as its own paragraph, and so the html I add to create a paragraph with multiple images is being stripped somehow. Is there a secret way I’m missing, or is this not possible?
TIA! New to Markdown and Discourse, techie but not very html or css fluent, so I apologize if this is a silly question.
You can target these images with CSS, either float or inline block. The problem you face is how to discriminate between images you want to have inline and those you don’t.
You could add a tag to the post, eg gallery and then target that, but I think you’d need jQuery to select the target for the style as the tag element is a sibling of the topic body, not a parent (from memory in any case).
You could also encode something in the img alt tag and target that. That works fine with CSS but it’s a bit messy.
Alternatively, I use a gallery plugin from Flickety in my test site:
It’s overkill for what you say you need, but does give good results. This carousel picks up on the carousel tag and renders a carousel - it also works with lightbox. I will post code at some stage, but not until I’ve managed to find out how to load the gallery script with require…