add YAML options before-content and after-content

skulshreshtha · Aug 24, 2020 · fcddc9e · fcddc9e
1 parent d88e046
commit fcddc9e
Show file tree

Hide file tree

Showing 7 changed files with 71 additions and 2 deletions.
diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -8,7 +8,8 @@ One of the major changes in this version is that a lot of time was spent on reth
 - **BREAKING CHANGE** Removed undocumented YAML options `meta-title` and `meta-description`
 - **BREAKING CHANGE** Removed `link-tags` config parameter because it wasn't necessary. If you use tags, there will be a tags page created; if you don't use tags there is no tags page.
 - Added `share-title` YAML option to give control over the search engine/social media title
-- Added `head-extra` YAML option which is similar to `footer-extra` but is used to include custom HTML code in a page's `<head>` tag
+- 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
 - 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

diff --git a/README.md b/README.md
@@ -172,7 +172,9 @@ These are advanced parameters that are only useful for people who need very fine
 Parameter   | Description
 ----------- | -----------
 footer-extra | If you want to include extra content below the social media icons in the footer, create an HTML file in the `_includes/` folder (for example `_includes/myinfo.html`) and set `footer-extra` to the name of the file (for example `footer-extra: myinfo.html`). Accepts a single file or a list of files.
-head-extra   | Works in a similar way to `footer-extra`, but used if you have any HTML code that needs to be included in the `<head>` tag of the page.
+before-content | Similar to `footer-extra`, but used for including HTML before the main content of the page (below the title).
+after-content | Similar to `footer-extra`, but used for including HTML after the main content of the page (above the footer).
+head-extra   | Similar to `footer-extra`, but used if you have any HTML code that needs to be included in the `<head>` tag of the page.
 language    | HTML language code to be set on the page's &lt;html&gt; element.
 full-width  | By default, page content is constrained to a standard width. Use `full-width: true` to allow the content to span the entire width of the window.
 js          | List of local JavaScript files to include in the page (eg. `/assets/js/mypage.js`)

diff --git a/_layouts/default.html b/_layouts/default.html
@@ -5,5 +5,21 @@
 <div class="intro-header"></div>
 
 <div role="main" class="{% if page.full-width %} container-fluid {% else %} container-md {% endif %}">
+  {% if page.before-content %}
+    <div class="before-content">
+      {% for file in page.before-content %}
+        {% include {{ file }} %}
+      {% endfor %}
+    </div>
+  {% endif %}
+
   {{ content }}
+
+  {% if page.after-content %}
+    <div class="after-content">
+      {% for file in page.after-content %}
+        {% include {{ file }} %}
+      {% endfor %}
+    </div>
+  {% endif %}
 </div>
diff --git a/_layouts/minimal.html b/_layouts/minimal.html
@@ -21,7 +21,23 @@
   <body>
 
     <div role="main" class="{% if page.full-width %} container-fluid {% else %} container-md {% endif %} main-content">
+      {% if page.before-content %}
+        <div class="before-content">
+          {% for file in page.before-content %}
+            {% include {{ file }} %}
+          {% endfor %}
+        </div>
+      {% endif %}
+
       {{ content }}
+
+      {% if page.after-content %}
+        <div class="after-content">
+          {% for file in page.after-content %}
+            {% include {{ file }} %}
+          {% endfor %}
+        </div>
+      {% endif %}
     </div>
 
     {% include footer-minimal.html %}

diff --git a/_layouts/page.html b/_layouts/page.html
@@ -7,7 +7,24 @@
 <div class="{% if page.full-width %} container-fluid {% else %} container-md {% endif %}" role="main">
   <div class="row">
     <div class="{% if page.full-width %} col {% else %} col-xl-8 offset-xl-2 col-lg-10 offset-lg-1 {% endif %}">
+      {% if page.before-content %}
+        <div class="before-content">
+          {% for file in page.before-content %}
+            {% include {{ file }} %}
+          {% endfor %}
+        </div>
+      {% endif %}
+
       {{ content }}
+
+      {% if page.after-content %}
+        <div class="after-content">
+          {% for file in page.after-content %}
+            {% include {{ file }} %}
+          {% endfor %}
+        </div>
+      {% endif %}
+
       {% include comments.html %}
     </div>
   </div>

diff --git a/_layouts/post.html b/_layouts/post.html
@@ -31,6 +31,14 @@
         </div>
       {% endif %}
 
+      {% if page.before-content %}
+        <div class="before-content">
+          {% for file in page.before-content %}
+            {% include {{ file }} %}
+          {% endfor %}
+        </div>
+      {% endif %}
+
       <article role="main" class="blog-post">
         {{ content }}
       </article>
@@ -44,6 +52,14 @@
         </div>
       {% endif %}
 
+      {% if page.after-content %}
+        <div class="after-content">
+          {% for file in page.after-content %}
+            {% include {{ file }} %}
+          {% endfor %}
+        </div>
+      {% endif %}
+
       {% if page.social-share %}
         {% include social-share.html %}
       {% endif %}

diff --git a/assets/css/beautifuljekyll.css b/assets/css/beautifuljekyll.css
@@ -862,6 +862,7 @@ pre {
 
 #social-share-section {
   margin-bottom: 1.875rem;
+  margin-top: 1.875rem;
 }
 
 /* --- Notification boxes --- */