diff options
Diffstat (limited to '_posts/2013-05-22-sample-post-images.md')
| -rw-r--r-- | _posts/2013-05-22-sample-post-images.md | 36 |
1 files changed, 35 insertions, 1 deletions
diff --git a/_posts/2013-05-22-sample-post-images.md b/_posts/2013-05-22-sample-post-images.md index 67c6f30..08700a5 100644 --- a/_posts/2013-05-22-sample-post-images.md +++ b/_posts/2013-05-22-sample-post-images.md @@ -61,4 +61,38 @@ And you'll get something that looks like this: <a href="http://placehold.it/1200x600.jpg"><img src="http://placehold.it/600x300.jpg" alt=""></a> <a href="http://placehold.it/1200x600.jpg"><img src="http://placehold.it/600x300.jpg" alt=""></a> <figcaption>Three images.</figcaption> -</figure>
\ No newline at end of file +</figure> + +### Alternative way + +Another way to achieve the same result is to include `gallery` Liquid template. In this case you +don't have to write any HTML tags – just copy a small block of code, adjust the parameters (see below) +and fill the block with any number of links to images. You can mix relative and external links. + +Here is the block you might want to use: + +{% highlight jinja %} +{% raw %} +{% capture images %} + /images/abstract-10.jpg + /images/abstract-11.jpg + http://upload.wikimedia.org/wikipedia/en/2/24/Lenna.png +{% endcapture %} +{% include gallery images=images caption="Test images" cols=3 %} +{% endraw %} +{% endhighlight %} + +Parameters: + +- `caption`: Sets the caption under the gallery (see `figcaption` HTML tag above); +- `cols`: Sets the number of columns of the gallery. +Available values: [1..3]. + +It will look something like this: + +{% capture images %} + /images/abstract-10.jpg + /images/abstract-11.jpg + http://upload.wikimedia.org/wikipedia/en/2/24/Lenna.png +{% endcapture %} +{% include gallery images=images caption="Test images" cols=3 %} |