add config option 'feed_show_excerpt

skulshreshtha · Aug 30, 2020 · 7d784b3 · 7d784b3
1 parent fcddc9e
commit 7d784b3
Show file tree

Hide file tree

Showing 5 changed files with 93 additions and 64 deletions.
diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -11,6 +11,7 @@ One of the major changes in this version is that a lot of time was spent on reth
 - Added `before-content` and `after-content` YAML options that allow you to add some common HTML before the main content of a page (below the title) or after the main content (above the footer). Works in a similar way to `footer-extra`.
 - Added `head-extra` YAML option which i s similar to `footer-extra` but is used to include custom HTML code in a page's `<head>` tag
 - Added `full-width` YAML option to allow having full-width pages
+- Added `feed_show_excerpt` config option to show/hide the post excerpts on the feed page
 - Improved the `footer-extra` YAML option to support multiple files instead of only a single file
 - Upgraded jQuery to version 3.5.1 to fix a couple security vulnerabilities with the previous version
 - Added automatic navbar color detection (#702)

diff --git a/README.md b/README.md
@@ -89,9 +89,9 @@ Beautiful Jekyll is, and always will be, free. But if you want to remove the Bea
 
 # Add your own content
 
-To add pages to your site, you can either write a markdown file (`.md`) or you can write an HTML file. It's much easier to write markdown than HTML, so I suggest you do that ([here's a great tutorial](https://markdowntutorial.com/) if you need to learn markdown in 5 minutes). You can look at some files on this demo site to get an idea of how to write markdown.
+To add pages to your site, you can either write a markdown file (`.md`) or you can write an HTML file. It's much easier to write markdown than HTML, so I suggest you do that ([here's a great tutorial](https://markdowntutorial.com/) if you need to learn markdown in 5 minutes).
 
-To look at existing files, click on any file that ends in `.md`, for example [`aboutme.md`](./aboutme.md). On the next page you can see some nicely formatted text (there's a word in bold, a link, a few bullet points), and if you click on the pencil icon to edit the file, you'll see the markdown code that generated the pretty text. Very easy!
+To see an example of a markdown file, click on any file that ends in `.md`, for example [`aboutme.md`](./aboutme.md). On that page you can see some nicely formatted text (there's a word in bold, a link, a few bullet points), and if you click on the pencil icon to edit the file, you'll see the markdown code that generated the pretty text. Very easy!
 
 In contrast, look at [`tags.html`](./tags.html). That's how your write HTML - not as pretty. So stick with markdown if you don't know HTML.
 

diff --git a/_config.yml b/_config.yml
@@ -76,6 +76,9 @@ url-pretty: "MyWebsite.com"
 # Excerpt word length - Truncate the excerpt of each post on the feed page to the specified number of words
 excerpt_length: 50
 
+# Whether or not to show an excerpt for every blog post in the feed page
+feed_show_excerpt: true
+
 # The keywords to associate with your website, for SEO purposes
 #keywords: "my,list,of,keywords"
 
@@ -167,7 +170,6 @@ date_format: "%B %-d, %Y"
 # Facebook App ID
 #fb_app_id: ""
 
-
 # --- You don't need to touch anything below here (but you can if you want) --- #
 
 # Output options (more information on Jekyll's site)

diff --git a/_layouts/home.html b/_layouts/home.html
@@ -9,6 +9,31 @@
 <div class="posts-list">
   {% for post in posts %}
   <article class="post-preview">
+
+    {%- capture thumbnail -%}
+      {% if post.thumbnail-img %}
+        {{ post.thumbnail-img }}
+      {% elsif post.cover-img %}
+        {% if post.cover-img.first %}
+          {{ post.cover-img[0].first.first }}
+        {% else %}
+          {{ post.cover-img }}
+        {% endif %}
+      {% else %}
+      {% endif %}
+    {% endcapture %}
+    {% assign thumbnail=thumbnail | strip %}
+
+    {% if site.feed_show_excerpt == false %}
+    {% if thumbnail != "" %}
+    <div class="post-image post-image-normal">
+      <a href="{{ post.url | absolute_url }}" aria-label="Thumbnail">
+        <img src="{{ thumbnail | absolute_url }}" alt="Post thumbnail">
+      </a>
+    </div>
+    {% endif %}
+    {% endif %}
+
     <a href="{{ post.url | absolute_url }}">
       <h2 class="post-title">{{ post.title }}</h2>
 
@@ -24,36 +49,32 @@ <h3 class="post-subtitle">
       Posted on {{ post.date | date: date_format }}
     </p>
 
-    <div class="post-entry-container">
-      {%- capture thumbnail -%}
-        {% if post.thumbnail-img %}
-          {{ post.thumbnail-img }}
-        {% elsif post.cover-img %}
-          {% if post.cover-img.first %}
-            {{ post.cover-img[0].first.first }}
-          {% else %}
-            {{ post.cover-img }}
-          {% endif %}
-        {% else %}
-        {% endif %}
-      {% endcapture %}
-      {% assign thumbnail=thumbnail | strip %}
-      {% if thumbnail != "" %}
-      <div class="post-image">
-        <a href="{{ post.url | absolute_url }}" aria-label="Thumbnail">
-          <img src="{{ thumbnail | absolute_url }}" alt="Post thumbnail">
-        </a>
-      </div>
+    {% if thumbnail != "" %}
+    <div class="post-image post-image-small">
+      <a href="{{ post.url | absolute_url }}" aria-label="Thumbnail">
+        <img src="{{ thumbnail | absolute_url }}" alt="Post thumbnail">
+      </a>
+    </div>
+    {% endif %}
+
+    {% unless site.feed_show_excerpt == false %}
+    {% if thumbnail != "" %}
+    <div class="post-image post-image-short">
+      <a href="{{ post.url | absolute_url }}" aria-label="Thumbnail">
+        <img src="{{ thumbnail | absolute_url }}" alt="Post thumbnail">
+      </a>
+    </div>
+    {% endif %}
+
+    <div class="post-entry">
+      {% assign excerpt_length = site.excerpt_length | default: 50 %}
+      {{ post.excerpt | strip_html | xml_escape | truncatewords: excerpt_length }}
+      {% assign excerpt_word_count = post.excerpt | number_of_words %}
+      {% if post.content != post.excerpt or excerpt_word_count > excerpt_length %}
+        <a href="{{ post.url | absolute_url }}" class="post-read-more">[Read&nbsp;More]</a>
       {% endif %}
-      <div class="post-entry">
-        {% assign excerpt_length = site.excerpt_length | default: 50 %}
-        {{ post.excerpt | strip_html | xml_escape | truncatewords: excerpt_length }}
-        {% assign excerpt_word_count = post.excerpt | number_of_words %}
-        {% if post.content != post.excerpt or excerpt_word_count > excerpt_length %}
-          <a href="{{ post.url | absolute_url }}" class="post-read-more">[Read&nbsp;More]</a>
-        {% endif %}
-      </div>
     </div>
+    {% endunless %}
 
     {% if post.tags.size > 0 %}
     <div class="blog-tags">

diff --git a/assets/css/beautifuljekyll.css b/assets/css/beautifuljekyll.css
@@ -447,6 +447,7 @@ footer .footer-custom-content {
 
 .post-preview a {
   text-decoration: none;
+  font-family: 'Open Sans', 'Helvetica Neue', Helvetica, Arial, sans-serif;
   color: {{ site.text-col | default: "#404040" }};
 }
 
@@ -471,13 +472,7 @@ footer .footer-custom-content {
   font-size: 1.125rem;
   font-style: italic;
   margin: 0 0 0.625rem;
-}
-.post-preview .post-entry {
-  font-family: 'Open Sans', 'Helvetica Neue', Helvetica, Arial, sans-serif;
-}
-.post-entry-container {
-  display: inline-block;
-  width: 100%;
+  font-family: 'Lora', 'Times New Roman', serif;
 }
 .post-entry {
   width: 100%;
@@ -487,17 +482,49 @@ footer .footer-custom-content {
   margin-left: 0.625rem;
   height: 12rem;
   width: 12rem;
-  margin-top: -2.1875rem;
+}
+.post-image {
   filter: grayscale(90%);
 }
 .post-image:hover {
   filter: grayscale(0%);
 }
 .post-image img {
-  border-radius: 6.25rem;
-  height: 12rem;
-  width: 12rem;
+  border-radius: 6rem;
+  height: 100%;
+  width: 100%;
 }
+.post-image-short {
+  margin-top: -2.1875rem;
+}
+@media (max-width: 767px) {
+  .post-image {
+    height: 9rem;
+    width: 9rem;
+  }
+  .post-image-short {
+    margin-top: 0;
+  }
+}
+.post-image-small {
+  width: 100%;
+  height: 100%;
+  text-align: center;
+  display: none;
+}
+.post-image-small img {
+  width: 6.25rem;
+  height: 6.25rem;
+}
+@media (max-width: 500px) {
+  .post-image {
+    display: none;
+  }
+  .post-image-small {
+    display: block;
+  }
+}
+
 .post-preview .post-read-more {
   font-weight: 800;
 }
@@ -540,28 +567,6 @@ footer .footer-custom-content {
   }
 }
 
-@media (max-width: 767px) {
-  .post-image, .post-image img {
-    margin-top: 0;
-    height: 9rem;
-    width: 9rem;
-  }
-}
-
-@media (max-width: 500px) {
-  .post-image, .post-image img {
-    height: 6.25rem;
-    width: 6.25rem;
-  }
-
-  .post-image {
-    width: 100%;
-    text-align: center;
-    margin-top: 0;
-    margin-left: 0;
-    float: none;
-  }
-}
 /* --- Post and page headers --- */
 
 .intro-header {