Get images working

Gemfile

@@ -3,7 +3,6 @@ source 'https://rubygems.org'
 gem 'jekyll', '3.8.5'
 
 group :jekyll_plugins do
-  gem 'jekyll-feed', '0.11.0'
   gem 'jekyll-seo-tag', '2.5.0'
   gem 'jekyll-sitemap', '1.2.0'
 end

_config.yml

@@ -18,9 +18,62 @@ defaults:
       header: true
   - scope:
       path: "assets/images"
+    values:
+      image: true
+  - scope:
+        path: "assets/images/company"
+    values:
+      company-image: true
+  - scope:
+      path: "assets/images/*/*.png"
+    values:
+      png: true
+  - scope:
+      path: "assets/images/*/*.jpg"
+    values:
+      jpg: true
+      jpeg: true
+  - scope:
+      path: "assets/images/*/*.jpeg"
+    values:
+      jpg: true
+      jpeg: true
+  - scope:
+      path: "assets/images/*/*.gif"
+    values:
+      gif: true
+  - scope:
+      path: "assets/images/*/*.webp"
+    values:
+      webp: true
+  - scope:
+      path: "assets/images/*/*.ico"
+    values:
+      ico: true
+  - scope:
+      path: "assets/images/*/*.svg"
+    values:
+      svg: true
+  - scope:
+      path: "assets/images/*/favicon.*"
+    values:
+      favicon: true
+  - scope:
+      path: "assets/images/*/*header*.*"
     values:
       header: true
-
+  - scope:
+      path: "assets/images/*/*logo*.*"
+    values:
+      logo: true
+  - scope:
+      path: "assets/images/*/*screenshot*.*"
+    values:
+      screenshot: true
+  - scope:
+      path: "assets/images/*/*wallpaper*.*"
+    values:
+      wallpaper: true
 
 strict_front_matter: true
 

_data/company.yml

@@ -1,6 +1,6 @@
 # This data file is used to represent your company page. It should not focus on
 # a specific product, but present your whole company. The journalists won't,
-# most of the time, know you or your studio. 
+# most of the time, know you or your studio.
 #
 # With this page, you will have an opportunity to show your people, your work,
 # your history and your contributions in a standard format. This is not a
@@ -87,7 +87,7 @@ trailers:
     # In this case, only a sentence will be shown, along with a download link.
   - name: Interview with Damien Mayance and Matthieu Oger of Pixenest Studio
     download: https://example.com/presskit.mp4
-  
+
 
 ### Awards, quotes & links #####################################################
 ################################################################################
@@ -166,4 +166,10 @@ contacts:
     link: http://pizzaburger.studio
 
 # Well-done, it’s over for this one. ;)
-# It’s time to do the product pages.
+# It’s time to do the product pages.
+
+
+### Images #####################################################################
+################################################################################
+
+image-dir: assets/images/company

_includes/assets.html

@@ -1,104 +1,98 @@
-{% if presskit.trailers %}
 <section class="block">
-  <h2 id="videos">Videos</h2>
+    <h2 id="videos">Videos</h2>
+    {% if presskit.trailers %}
+    {% for trailer in presskit.trailers %}
+    <div>
+        {% if trailer.youtube %}
+        <p>
+            <strong>{{ trailer.name }}</strong> — <a
+                href="https://www.youtube.com/embed/{{ trailer.youtube | strip }}?rel=0">YouTube</a>
+            {% if trailer.download %}| <a href="{{ trailer.download }}" target="_blank">Download</a>{% endif %}
+        </p>
 
-  {% for trailer in presskit.trailers %}
-  <div>
-    {% if trailer.youtube %}
-    <p>
-      <strong>{{ trailer.name }}</strong> — <a href="https://www.youtube.com/embed/{{ trailer.youtube | strip }}?rel=0">YouTube</a> {% if trailer.download %}| <a href="{{ trailer.download }}" target="_blank">Download</a>{% endif %}
-    </p>
+        <div class="video-player">
+            <iframe class="video-player__frame" src="https://www.youtube.com/embed/{{ trailer.youtube | strip }}?rel=0"
+                    frameborder="0" allowfullscreen></iframe>
+        </div>
+        {% endif %}
 
-    <div class="video-player">
-      <iframe class="video-player__frame" src="https://www.youtube.com/embed/{{ trailer.youtube | strip }}?rel=0" frameborder="0" allowfullscreen></iframe>
-    </div>
-    {% endif %}
+        {% if trailer.vimeo %}
+        <p>
+            <strong>{{ trailer.name }}</strong> — <a href="https://player.vimeo.com/video/{{ trailer.vimeo | strip }}">Vimeo</a>
+            {% if trailer.download %}| <a href="{{ trailer.download }}" target="_blank">Download</a>{% endif %}
+        </p>
 
-    {% if trailer.vimeo %}
-    <p>
-      <strong>{{ trailer.name }}</strong> — <a href="https://player.vimeo.com/video/{{ trailer.vimeo | strip }}">Vimeo</a> {% if trailer.download %}| <a href="{{ trailer.download }}" target="_blank">Download</a>{% endif %}
-    </p>
+        <div class="video-player">
+            <iframe class="video-player__frame" src="https://player.vimeo.com/video/{{ trailer.vimeo | strip }}"
+                    frameborder="0" webkitallowfullscreen mozallowfullscreen allowfullscreen></iframe>
+        </div>
+        {% endif %}
 
-    <div class="video-player">
-      <iframe class="video-player__frame" src="https://player.vimeo.com/video/{{ trailer.vimeo | strip }}" frameborder="0" webkitallowfullscreen mozallowfullscreen allowfullscreen></iframe>
-    </div>
-    {% endif %}
-
-    {% unless trailer.youtube %}
-      {% unless trailer.vimeo %}
+        {% unless trailer.youtube %}
+        {% unless trailer.vimeo %}
         <p>
-          <strong>{{ trailer.name }}</strong> — <a href="{{ trailer.download }}" target="_blank">Download</a>
+            <strong>{{ trailer.name }}</strong> — <a href="{{ trailer.download }}" target="_blank">Download</a>
         </p>
-      {% endunless %}
-    {% endunless %}
-  </div>
-  {% endfor %}
-</section>
-{% else %}
-<section class="block">
-  <h2 id="videos">Videos</h2>
+        {% endunless %}
+        {% endunless %}
+    </div>
+    {% endfor %}
+    {% else %}
+    <p>There are currently no trailers available for {{ presskit.title }}. Check back later for more or <a
+            href="#contact">contact us</a> for specific requests!</p>
 
-  <p>There are currently no trailers available for {{ presskit.title }}. Check back later for more or <a href="#contact">contact us</a> for specific requests!</p>
+    {% endif %}
 </section>
-{% endif %}
 
-{% if hasScreenshots %}
 <section class="block">
-  <h2 id="images">Images</h2>
-
-  <aside class="block__notice">
-    <a href="images/images.zip">
-      download all screenshots & photos as .zip
-    </a>
-  </aside>
+    <h2 id="images">Images</h2>
 
-  <div class="gallery clearfix" id="gallery">
-    {% for screenshot in images.screenshots %}
-    <div class="gallery__item">
-      <a href="/assets/images/{{ screenshot }}">
-        <img src="{{ screenshot }}" alt="{{screenshot}}">
-      </a>
+    {% if images %}
+    <div class="gallery clearfix" id="gallery">
+        {% for image in images %}
+        {% unless image.favicon or image.header or image.logo %}
+        <div class="gallery__item">
+            <a href="{{ image.path }}">
+                <img src="{{ image.path }}" alt="{{ presskit.title }} Image">
+            </a>
+        </div>
+        {% endunless %}
+        {% endfor %}
     </div>
-    {% endfor %}
-  </div>
 
-  {% for screenshot in images.screenshotsWithCategory %}
-  <section>
-    <h3 class="capitalize" id="gallery-{{ screenshot.title }}">{{ screenshot.title }}</h3>
-    <div class="gallery clearfix">
-      {% for element in screenshot.elements %}
-      <div class="gallery__item">
-        <a href="/assets/images/{{ element }}">
-          <img src="{{ element }}" alt="{{ element }}">
-        </a>
-      </div>
-      {% endfor %}
-    </div>
-  </section>
-  {% endfor %}
+    {% for screenshot in images.screenshotsWithCategory %}
+    <section>
+        <h3 class="capitalize" id="gallery-{{ screenshot.title }}">{{ screenshot.title }}</h3>
+        <div class="gallery clearfix">
+            {% for element in screenshot.elements %}
+            <div class="gallery__item">
+                <a href="/assets/images/{{ element }}">
+                    <img src="{{ element }}" alt="{{ element }}">
+                </a>
+            </div>
+            {% endfor %}
+        </div>
+    </section>
+    {% endfor %}
+    {% else %}
+    <p>There are currently no images available for {{ presskit.title }}. Check back later for more or <a
+            href="#contact">contact us</a> for specific requests!</p>
+    {% endif %}
 </section>
-{% endif %}
 
-{% if images.logos %}
 <section class="block">
-  <h2 id="logo">Logo & Icon</h2>
-
-  <aside class="block__notice">
-    <a href="images/logo.zip">
-      download logo files as .zip
+    <h2 id="logo">Logo & Icon</h2>
+    {% assign logos = images | where: "logo", true %}
+    {% if logos %}
+    {% for logo in logos %}
+    <a href="images/{{ logo.path }}">
+        <img src="{{ site.baseurl }}{{ logo.path }}" alt="{{ presskit.title }} Logo" class="logo">
     </a>
-  </aside>
+    {% endfor %}
+    {% else %}
 
-  {% for logo in images.logos %}
-  <a href="images/{{ logo }}">
-    <img src="images/{{ logo }}" alt="{{ logo }}" class="logo">
-  </a>
-  {% endfor %}
+    <p>There are currently no logos or icons available for {{ presskit.title }}. Check back later for more or <a
+            href="#contact">contact us</a> for specific requests!</p>
+    {% endif %}
 </section>
-{% else %}
-<section class="block">
-  <h2 id="logo">Logo & Icon</h2>
 
-  <p>There are currently no logos or icons available for {{ presskit.title }}. Check back later for more or <a href="#contact">contact us</a> for specific requests!</p>
-</section>
-{% endif %}

_includes/find_file.html

@@ -0,0 +1,8 @@
+{% assign _exts = include.extensions | split: "," %}
+{%- for extension in _exts -%}
+    {%- assign _file = site.static_files | where: "basename", include.name | where: "extname", extension | first  -%}
+    {%- if _file -%}
+    {{- _file.path -}}
+    {%- break -%}
+    {%- endif -%}
+{%- endfor -%}

_includes/head.html

@@ -7,14 +7,8 @@
 <title>{{presskit.title}}</title>
 {% endif %}
 
-{% assign favicon_ico = site.static_files | where: "name", "favicon.ico" %}
-{% assign favicon_png = site.static_files | where: "name", "favicon.png" %}
-
-{% if favicon_png %}
-<link rel="shortcut icon" href="{{ site.url }}{{ favicon_png[0].path }}">
-{% elsif favicon_ico %}
-<link rel="shortcut icon" href="{{ site.url }}{{ favicon_ico[0].path }}">
-{% endif %}
+{% assign favicon = images | where: "favicon", true | first %}
+<link rel="shortcut icon" href="{{ site.url }}{{ favicon.path }}">
 
 <link rel="stylesheet" href="{{ site.url }}/assets/css/normalize.css">
 <link rel="stylesheet" href="{{ site.url }}/assets/css/master.css">

_includes/nav.html

@@ -67,13 +67,13 @@ <h1 class="nav__title">
     </li>
     {% endif %}
 
-    {% if images.screenshots %}
+    {% if images %}
     <li>
       <a class="nav__item" href="#images">Images</a>
     </li>
     {% endif %}
 
-    {% if images.logos %}
+    {% if images %}
     <li>
       <a class="nav__item" href="#logo">Logo & Icon</a>
     </li>
@@ -125,4 +125,4 @@ <h1 class="nav__title">
     </li>
     {% endif %}
   </ul>
-</nav>
+</nav>

_layouts/company.html

@@ -4,8 +4,9 @@
 <html>
   <head>
     {% assign presskit = site.data.company %}
-    {% assign images = site.static_files | where: "image", true %}
     {% assign company = site.data.company %}
+    {% assign images = site.static_files | where_exp: "i", "i.path contains company.image-dir" %}
+    {% assign header = images | where: "header", true | first %}
     {% include head.html %}
   </head>
   <body>
@@ -14,8 +15,8 @@
 
       <div class="page-wrapper grid__item">
         <header class="page-header">
-          {% if company.header %}
-          <img src="{{ site.baseurl }}/assets/images/{{ company.header }}" alt="{{presskit.title}}" title="{{presskit.title}}">
+          {% if header %}
+          <img src="{{ site.baseurl }}{{ header.path }}" alt="{{presskit.title}}" title="{{presskit.title}}">
           {% endif %}
         </header>
 

_layouts/product.html

@@ -4,8 +4,10 @@
 <html>
   <head>
 
+    {% assign product = page.id | remove: "/" %}
     {% assign presskit = page %}
-    {% assign images = site.static_files | where: "image", true %}
+    {% assign images = site.static_files | where_exp: "i", "i.path contains page.image-dir" %}
+    {% assign header = images | where: "header", true | first %}
     {% assign company = site.data.company %}
     {% include head.html %}
   </head>
@@ -15,8 +17,8 @@
 
       <div class="page-wrapper grid__item">
         <header class="page-header">
-          {% if presskit.header %}
-          <img src="{{ site.baseurl }}/assets/images/{{ presskit.header }}" alt="{{presskit.title}}" title="{{presskit.title}}">
+          {% if header %}
+          <img src="{{ site.baseurl }}{{ header.path }}" alt="{{presskit.title}}" title="{{presskit.title}}">
           {% endif %}
         </header>
 

_products/mysupergame.md

@@ -10,7 +10,6 @@
 
 title: My Super Game
 website: https://pizzaburger.studio/mysupergame
-header: products/mysupergame/header.jpg
 
 # You can also add an URL to a request page for this product.
 # A button will be displayed on the page.
@@ -244,5 +243,8 @@ contacts:
   - name: Web
     link: http://mysupergame.pizzaburger.studio
 
+
+image-dir: assets/images/mysupergame
+
 # All done!
----
+---