Templates

Responsive Galleries with Foundation

Wanna create a responsive gallery to showcase your portfolio, recent photos or images? It's quite easy thanks to Foundation and Clearing Lightbox.

You just need to choose a template like the page- or page-fullwidth-template and then just use {% include gallery %}.

  • Great images by Unsplash.com
  • Great images by Unsplash.com
  • Great images by Unsplash.com
  • Great images by Unsplash.com
  • Great images by Unsplash.com
  • Great images by Unsplash.com
  • Great images by Unsplash.com
  • Great images by Unsplash.com

{% include gallery %} lets you easily embed a gallery into your post. To use the gallery-include…

Step 1

  1. Make two images: a thumbnail and a big image.
  2. Name the thumbnail gallery-image-thumb.jpg and…
  3. …name the big gallery-image.jpg.
  4. Place them in the images-folder.

Step 2

Define the big version in frontmatter,

gallery:
    - image_url: gallery-image.jpg

If you like captions, give each image a caption:

gallery:
    - image_url: gallery-image.jpg
       caption: Starting Page with huge One Logo

Step 3

Add the include whereever you want in your content with {% include gallery %}.

Have a look at this example-entry. And have a look into the images-folder. :)

Other Post Formats

Realização

Logo da Universidade Regional de Blumenau
Logo do Centro Universitário SENAI Santa Catarina (UniSENAI)

Patrocínio Ouro

Logo da Senior Sistemas
Logo da AMcom
Logo da Megasul
Logo da Ambev Tech

Patrocínio Prata

Logo da Viacredi
Logo da FFM

Apoio

Logo do Blusoft
Logo da Software by Maringá