Improve gallery include variable names

This commit is contained in:
Michael Rose 2016-03-05 21:29:08 -05:00
parent 7c77274567
commit 8e838e1062
2 changed files with 38 additions and 38 deletions

View file

@ -18,28 +18,28 @@
<figure class="{{ gallery-layout }}"> <figure class="{{ gallery-layout }}">
{% for img in gallery %} {% for img in gallery %}
{% if img.large %} {% if img.url %}
<a href= <a href=
{% if img.large contains "http" %} {% if img.url contains "http" %}
"{{ img.large }}" "{{ img.url }}"
{% else %} {% else %}
"{{ img.large | prepend: "/images/" | prepend: absurl }}" "{{ img.url | prepend: "/images/" | prepend: absurl }}"
{% endif %} {% endif %}
> >
<img src= <img src=
{% if img.thumb contains "http" %} {% if img.image_path contains "http" %}
"{{ img.thumb }}" "{{ img.image_path }}"
{% else %} {% else %}
"{{ img.thumb | prepend: "/images/" | prepend: absurl }}" "{{ img.image_path | prepend: "/images/" | prepend: absurl }}"
{% endif %} {% endif %}
alt="{% if img.alt %}{{ img.alt }}{% endif %}"> alt="{% if img.alt %}{{ img.alt }}{% endif %}">
</a> </a>
{% else %} {% else %}
<img src= <img src=
{% if img.thumb contains "http" %} {% if img.image_path contains "http" %}
"{{ img.thumb }}" "{{ img.image_path }}"
{% else %} {% else %}
"{{ img.thumb | prepend: "/images/" | prepend: absurl }}" "{{ img.image_path | prepend: "/images/" | prepend: absurl }}"
{% endif %} {% endif %}
alt="{% if img.alt %}{{ img.alt }}{% endif %}"> alt="{% if img.alt %}{{ img.alt }}{% endif %}">
{% endif %} {% endif %}

View file

@ -7,29 +7,29 @@ tags:
- Post Formats - Post Formats
- tiled - tiled
gallery: gallery:
- large: unsplash-gallery-image-1.jpg - url: unsplash-gallery-image-1.jpg
thumb: unsplash-gallery-image-1-th.jpg image_path: unsplash-gallery-image-1-th.jpg
alt: "placeholder image 1" alt: "placeholder image 1"
- large: unsplash-gallery-image-2.jpg - url: unsplash-gallery-image-2.jpg
thumb: unsplash-gallery-image-2-th.jpg image_path: unsplash-gallery-image-2-th.jpg
alt: "placeholder image 2" alt: "placeholder image 2"
- large: unsplash-gallery-image-3.jpg - url: unsplash-gallery-image-3.jpg
thumb: unsplash-gallery-image-3-th.jpg image_path: unsplash-gallery-image-3-th.jpg
alt: "placeholder image 3" alt: "placeholder image 3"
gallery2: gallery2:
- large: https://flic.kr/p/8a6Ven - url: https://flic.kr/p/8a6Ven
thumb: https://farm2.staticflickr.com/1272/4697500467_8294dac099_q.jpg image_path: https://farm2.staticflickr.com/1272/4697500467_8294dac099_q.jpg
alt: "Black and grays with a hint of green" alt: "Black and grays with a hint of green"
- large: https://flic.kr/p/8a738X - url: https://flic.kr/p/8a738X
thumb: https://farm5.staticflickr.com/4029/4697523701_249e93ba23_q.jpg image_path: https://farm5.staticflickr.com/4029/4697523701_249e93ba23_q.jpg
alt: "Made for open text placement" alt: "Made for open text placement"
- large: https://flic.kr/p/8a6VXP - url: https://flic.kr/p/8a6VXP
thumb: https://farm5.staticflickr.com/4046/4697502929_72c612c636_q.jpg image_path: https://farm5.staticflickr.com/4046/4697502929_72c612c636_q.jpg
alt: "Fog in the trees" alt: "Fog in the trees"
gallery3: gallery3:
- thumb: unsplash-gallery-image-2-th.jpg - image_path: unsplash-gallery-image-2-th.jpg
alt: "placeholder image 2" alt: "placeholder image 2"
- thumb: unsplash-gallery-image-4-th.jpg - image_path: unsplash-gallery-image-4-th.jpg
alt: "placeholder image 4" alt: "placeholder image 4"
--- ---
These are gallery tests for image wrapped in `<figure>` elements. These are gallery tests for image wrapped in `<figure>` elements.
@ -38,17 +38,17 @@ To place a gallery add the necessary YAML Front Matter:
```yaml ```yaml
gallery: gallery:
- large: unsplash-gallery-image-1.jpg - url: unsplash-gallery-image-1.jpg
thumb: unsplash-gallery-image-1-th.jpg image_path: unsplash-gallery-image-1-th.jpg
alt: "placeholder image 1" alt: "placeholder image 1"
- large: unsplash-gallery-image-2.jpg - url: unsplash-gallery-image-2.jpg
thumb: unsplash-gallery-image-2-th.jpg image_path: unsplash-gallery-image-2-th.jpg
alt: "placeholder image 2" alt: "placeholder image 2"
- large: unsplash-gallery-image-3.jpg - url: unsplash-gallery-image-3.jpg
thumb: unsplash-gallery-image-3-th.jpg image_path: unsplash-gallery-image-3-th.jpg
alt: "placeholder image 3" alt: "placeholder image 3"
- large: unsplash-gallery-image-4.jpg - url: unsplash-gallery-image-4.jpg
thumb: unsplash-gallery-image-4-th.jpg image_path: unsplash-gallery-image-4-th.jpg
alt: "placeholder image 4" alt: "placeholder image 4"
``` ```
@ -66,14 +66,14 @@ Here comes another gallery, this time set the `id` to match 2nd gallery hash in
```yaml ```yaml
gallery2: gallery2:
- large: https://flic.kr/p/8a6Ven - url: https://flic.kr/p/8a6Ven
thumb: https://farm2.staticflickr.com/1272/4697500467_8294dac099_q.jpg image_path: https://farm2.staticflickr.com/1272/4697500467_8294dac099_q.jpg
alt: "Black and grays with a hint of green" alt: "Black and grays with a hint of green"
- large: https://flic.kr/p/8a738X - url: https://flic.kr/p/8a738X
thumb: https://farm5.staticflickr.com/4029/4697523701_249e93ba23_q.jpg image_path: https://farm5.staticflickr.com/4029/4697523701_249e93ba23_q.jpg
alt: "Made for open text placement" alt: "Made for open text placement"
- large: https://flic.kr/p/8a6VXP - url: https://flic.kr/p/8a6VXP
thumb: https://farm5.staticflickr.com/4046/4697502929_72c612c636_q.jpg image_path: https://farm5.staticflickr.com/4046/4697502929_72c612c636_q.jpg
alt: "Fog in the trees" alt: "Fog in the trees"
``` ```