From 42fddb54164254e99160a624e9043ec65cacbaec Mon Sep 17 00:00:00 2001
From: Claudia Reynders <>
Date: Sat, 30 Apr 2022 18:25:07 +0200
Subject: [PATCH] Added excerpts - added configuration for excerpts - updated
 example articles with excerpts - added excerpt to render in the article
 previews

---
 .eleventy.js                             | 7 +++++++
 src/_includes/components/articleList.njk | 1 +
 src/blog/article1.md                     | 3 ++-
 src/blog/article2.md                     | 3 ++-
 src/blog/article3.md                     | 3 ++-
 5 files changed, 14 insertions(+), 3 deletions(-)

diff --git a/.eleventy.js b/.eleventy.js
index fdd1bc7..04888ec 100644
--- a/.eleventy.js
+++ b/.eleventy.js
@@ -23,6 +23,13 @@ module.exports = function(eleventyConfig) {
   eleventyConfig.addCollection('categoryList', require('./src/_11ty/getCategoryList'))
   eleventyConfig.addCollection('categories', require('./src/_11ty/createCategories'))
 
+
+  eleventyConfig.setFrontMatterParsingOptions({
+    excerpt: true,
+    excerpt_separator: "<!-- excerpt -->",
+    excerpt_alias: 'excerpt'
+  })
+
   return {
     dir: {
       input: 'src',
diff --git a/src/_includes/components/articleList.njk b/src/_includes/components/articleList.njk
index 83d8374..9adc7ca 100644
--- a/src/_includes/components/articleList.njk
+++ b/src/_includes/components/articleList.njk
@@ -3,6 +3,7 @@
   <li class="article__item">
     <article class="article__preview">
       <h2><a href="{{ article.url | url }}">{{ article.data.title }}</a></h2>
+      <p>{{ article.data.excerpt }}</p>
       <small>
         <time>{{ article.data.date | readableDate }}</time>
         <a class="category" href="/blog/{{ article.data.category }}">{{ article.data.category }}</a>
diff --git a/src/blog/article1.md b/src/blog/article1.md
index 2e2d84a..84f3fd0 100644
--- a/src/blog/article1.md
+++ b/src/blog/article1.md
@@ -6,6 +6,7 @@ category: "cat1"
 ---
 
 Having landed on this Eleventy starter, you probably are no stranger to Eleventy. But if you are, you should definitely check out its benefits. Getting started with Eleventy is quick and easy.
+<!-- excerpt -->
 
-{% image "https://images.unsplash.com/photo-1555066931-4365d14bab8c", "A laptop with some lines of code on the screen", null, [300, 600] %}
+{% image "https://images.unsplash.com/photo-1555066931-4365d14bab8c", "A laptop with some lines of code on the screen", "image", [300, 600] %}
 
diff --git a/src/blog/article2.md b/src/blog/article2.md
index a312664..ffc0a60 100644
--- a/src/blog/article2.md
+++ b/src/blog/article2.md
@@ -5,4 +5,5 @@ date: 2022-03-02
 category: "cat2"
 ---
 
-With Eleventy you can gradually expand your website and its complexity level.
\ No newline at end of file
+With Eleventy you can gradually expand your website and its complexity level.
+<!-- excerpt -->
\ No newline at end of file
diff --git a/src/blog/article3.md b/src/blog/article3.md
index fc427d9..ec0fd03 100644
--- a/src/blog/article3.md
+++ b/src/blog/article3.md
@@ -5,4 +5,5 @@ date: 2022-05-04
 category: "cat1"
 ---
 
-There are many different static site generators out there, but after having used middleman for such a long time, it just made sense to switch to Eleventy. I needed something simple that gave lots of control over how I build my website.
\ No newline at end of file
+There are many different static site generators out there, but after having used middleman for such a long time, it just made sense to switch to Eleventy. I needed something simple that gave lots of control over how I build my website.
+<!-- excerpt -->
\ No newline at end of file