Putting image side by side

support
1

What is the best way to put images side by side?

I tried this but it is still one after another

{{< figure src=“a.png” >}}
{{< figure src=“b.png” class=“pull-right”>}}

Thanks.

2

You can solve this with a shortcode.

Here is what I do in my blog:

Shortcode gallery.html:

`



{{ if len .Params | eq 9 }}









{{ end }}
{{ if len .Params | eq 6 }}






{{ end }}
{{ if len .Params | eq 3 }}



{{ end }}

`

And in a post you can insert images like this:

`{{< gallery
“/images/renovigo/IMG_3833.jpg”
“/images/renovigo/IMG_3834.jpg”
“/images/renovigo/IMG_3842.jpg”
“/images/renovigo/IMG_3844.jpg”
“/images/renovigo/IMG_3846.jpg”
“/images/renovigo/IMG_3847.jpg”
“/images/renovigo/IMG_3848.jpg”
“/images/renovigo/IMG_3849.jpg”
“/images/renovigo/IMG_3850.jpg”

}}`

This gives me a gallery with three pictures in a row and one, two or three rows.

It’s a hack. :wink:

1 Like
3

I found a couple of ways to do it

Using pure html

<img src="a.png">
<img src="b.png">

Or markdown

![](a.png)
![](b.png)

Notice there’s no empty line between the images. This will have the image side by side.

The HTML version is useful to specify styles, classes, width etc. Otherwise markdown version is cleaner.

1 Like