Adding captions to gallery pages

Added captions as on Nodebox.net

Author: lucasnijs

_layouts/default.html

@@ -13,10 +13,23 @@ <h1>{{ page.title }}</h1>
     {{ content }}
   </div>
 
-  {% if page.images %}
+  <!--{% if page.images %}
   <aside class="four columns">
     {% for image in page.images %}
       <a class="thumb" rel="images" href="/media/{{ image }}"><img src="/media/{{ image }}" alt="{{ page.title }}"></a>
     {% endfor %}
   </aside>
-  {% endif %}  
+  {% endif %}-->
+  
+{% if page.images %}
+  <aside class="four columns">
+    {% for image in page.images %}
+      {% if image.size == 2 %}
+        <a class="thumb" rel="images" href="/media/{{ image[0] }}" title="{{ image[1] }}"><img src="/media/{{ image[0] }}" alt="{{ image[1] }}"></a>
+		<div class="caption">{{ image[1] }}</div>
+      {% else %}
+        <a class="thumb" rel="images" href="/media/{{ image }}"><img src="/media/{{ image }}" alt="{{ page.title }}"></a>      
+      {% endif %}
+    {% endfor %}
+  </aside>
+  {% endif %}

_layouts/gallery.html

@@ -4,4 +4,4 @@
 ---
 <div class="ten columns">
 {{ content }}
-</div>
+</div>

_posts/2014-01-26-worskhop-helsinki.md

@@ -4,21 +4,21 @@ layout: gallery
 title: NodeBox 3 Helsinki Workshop
 thumb: masterclass-2014-helsinki-thumbmate.png
 images:
-  - gallery/workshop_helsinki_2014_Katju.png
-  - gallery/workshop_helsinki_2014_Eero_parts.png
-  - gallery/workshop_helsinki_2014_Eero_population.jpg
-  - gallery/workshop_helsinki_2014_Eero_inmates.jpg
-  - gallery/workshop_helsinki_2014_Eero_type.png
-  - gallery/workshop_helsinki_2014_Eero_ClairedeLune.png
-  - gallery/workshop_helsinki_2014_Tuomas.png
-  - gallery/workshop_helsinki_2014_Tuomas_detail.png
-  - gallery/workshop_helsinki_2014_Lea.png
-  - gallery/workshop_helsinki_2014_Lea_group.png
-  - gallery/workshop_helsinki_2014_Lisa.png
-  - gallery/workshop_helsinki_2014_Luyi.png
-  - gallery/workshop_helsinki_2014_Christopher.png
-  - gallery/workshop_helsinki_2014_Cristina.png
-  - gallery/workshop_helsinki_2014_Sulza.png
+  - [gallery/workshop_helsinki_2014_Katju.png, © 2104 Katju Aro - North Sea Fish]
+  - [gallery/workshop_helsinki_2014_Eero_parts.png, © 2014 Eero Pitkanen - Human Parts]
+  - [gallery/workshop_helsinki_2014_Eero_population.jpg, © 2014 Eero Pitkanen - Crowd Making]
+  - [gallery/workshop_helsinki_2014_Eero_inmates.jpg, © 2014 Eero Pitkanen - Guantanamo Style]
+  - [gallery/workshop_helsinki_2014_Eero_type.png, © 2014 Eero Pitkanen - Grid Font]
+  - [gallery/workshop_helsinki_2014_Eero_ClairedeLune.png, © 2014 Eero Pitkanen - Midi Viz]
+  - [gallery/workshop_helsinki_2014_Tuomas.png, © 2014 Tuomas Kärkkäinen - 6 years Afghan war]
+  - [gallery/workshop_helsinki_2014_Tuomas_detail.png, © 2014 Tuomas Kärkkäinen - Incident Detail]
+  - [gallery/workshop_helsinki_2014_Lea.png, © 2014 Lea Suijckerbuijk - Creatures]
+  - [gallery/workshop_helsinki_2014_Lea_group.png, © 2014 Lea Suijckerbuijk - More]
+  - [gallery/workshop_helsinki_2014_Lisa.png, © 2014 Lisa Lee - Killed over What?]
+  - [gallery/workshop_helsinki_2014_Luyi.png, © 2014 Ma Luyi - Rotating Art]
+  - [gallery/workshop_helsinki_2014_Christopher.png, © 2014 Christopher Andersen - Swedish and Sami]
+  - [gallery/workshop_helsinki_2014_Cristina.png, © 2014 Cristina Melcior Vendrell - 100 Types]
+  - [gallery/workshop_helsinki_2014_Sulza.png, © 2014 Alena Sulza - Water logo derivatives]
 ---
 
 We did a workshop at [Aalto University - Finland - Helsinki] (http://www.aalto.fi/en/) from January 27 till January 31 2014. Participants were a selection of students from graphic design and media arts. The focus was on data visualization and on generative design.

media/css/screen.css

@@ -680,3 +680,16 @@ footer .copyright a {
 
 /* Mobile Portrait Size to Mobile Landscape Size (devices and browsers) */
 @media only screen and (max-width: 479px) {}
+
+/* Aside */
+
+aside {
+    padding-bottom: 10px;
+}
+
+
+<!--aside div.caption {
+    font-size: 80%;
+    margin: -4px 0 7px 0;
+}-->
+