From 08f406c44c861a914c8b63fab454250f8a4c4b36 Mon Sep 17 00:00:00 2001
From: Jieiku
Date: Wed, 20 Sep 2023 00:25:21 -0700
Subject: refactor nav, blocks, macros, templates. fix image shortcodes

---
 templates/404.html                 |   2 +-
 templates/archive.html             |   8 +-
 templates/base.html                | 122 ++++++-----
 templates/categories/list.html     |   2 +-
 templates/categories/single.html   |   2 +-
 templates/contact.fr.html          |  49 -----
 templates/contact.html             |  49 -----
 templates/index.html               |  14 +-
 templates/macros/head.html         | 406 -------------------------------------
 templates/macros/macros.html       |  33 ++-
 templates/macros/page.html         |   7 -
 templates/macros/seo.html          | 140 +++++++++++++
 templates/macros/social.html       |  58 ------
 templates/page.html                |  62 +++---
 templates/pages.html               |  19 +-
 templates/partials/head.html       | 131 ++++++++++++
 templates/partials/head_js.html    | 165 +++++++++++++++
 templates/partials/social.html     |  63 ++++++
 templates/shortcodes/img.html      |   9 +-
 templates/shortcodes/imgswap.html  |  17 +-
 templates/shortcodes/showdata.html |  10 +
 templates/tags/list.html           |   2 +-
 templates/tags/single.html         |   2 +-
 23 files changed, 675 insertions(+), 697 deletions(-)
 delete mode 100644 templates/contact.fr.html
 delete mode 100644 templates/contact.html
 delete mode 100644 templates/macros/head.html
 delete mode 100644 templates/macros/page.html
 create mode 100644 templates/macros/seo.html
 delete mode 100644 templates/macros/social.html
 create mode 100644 templates/partials/head.html
 create mode 100644 templates/partials/head_js.html
 create mode 100644 templates/partials/social.html

(limited to 'templates')

diff --git a/templates/404.html b/templates/404.html
index 7b7c325..07f32b3 100644
--- a/templates/404.html
+++ b/templates/404.html
@@ -14,7 +14,7 @@
 
   {%- set description = config.description %}
 
-  {{- macros_head::seo(config=config, title=title, title_addition=title_addition, description=description, is_404=true) }}
+  {{- macros_seo::seo(config=config, title=title, title_addition=title_addition, description=description, is_404=true) }}
 {%- endblock seo %}
 
 {%- block content %}
diff --git a/templates/archive.html b/templates/archive.html
index 8ac3cfc..e4f7e06 100644
--- a/templates/archive.html
+++ b/templates/archive.html
@@ -19,13 +19,17 @@ This Template can also be used as the rendering template for Sections, eg: examp
 
   {%- set description = config.description %}
 
-  {{- macros_head::seo(config=config, title=title, title_addition=title_addition, description=description, is_home=true) }}
+  {{- macros_seo::seo(config=config, title=title, title_addition=title_addition, description=description, is_home=true) }}
 {%- endblock seo %}
 
 {%- block content %}
     {#- The following line is checking if the template is being used for the archive page or a section #}
     {%- if current_path is matching("^(/[[:alpha:]][[:alpha:]])?/archive/$") %}
-      {%- set sec = "" %}
+      {%- if section.extra.sec %}
+        {%- set sec = section.extra.sec ~ "/" %}
+      {%- else %}
+        {%- set sec = "" %}
+      {%- endif %}
     {%- else %}
       {%- set langpath = "/" %}
       {%- if lang != config.default_language %}
diff --git a/templates/base.html b/templates/base.html
index 8d85516..b3dfec8 100644
--- a/templates/base.html
+++ b/templates/base.html
@@ -1,21 +1,13 @@
-{%- import 'macros/head.html' as macros_head %}
-{%- import "macros/social.html" as social_macros %}
-{%- import "macros/page.html" as page_macros %}
+{%- import 'macros/seo.html' as macros_seo %}
 {%- import "macros/macros.html" as macros %}
 {%- set uglyurls = config.extra.uglyurls | default(value=false) -%}
 {%- if config.extra.offline %}{% set uglyurls = true %}{% endif %}
 <!DOCTYPE html>
 <html lang="{%- if lang != config.default_language %}{{ lang }}{% else %}{{ config.extra.language_code | default(value=lang) }}{% endif %}">
 <head>
-  {{- macros_head::theme(config=config) }}
-  {{- macros_head::stylesheets(config=config) }}
-  <meta charset="utf-8" />
-  <meta http-equiv="x-ua-compatible" content="ie=edge" />
-  <meta name="viewport" content="width=device-width, initial-scale=1" />
-  {{- macros_head::stylesheets_preload(config=config) }}
-  {{- macros_head::js(config=config) }}
-  <meta name="base" content="{{ config.base_url | safe }}" />
-  {{- macros_head::feed(config=config) }}
+  {%- include "partials/head.html" %}
+
+  {#- SEO: title, description, etc #}
   {%- block seo %}
     {%- if config.extra.title_separator %}
       {%- set title_separator = " " ~ config.extra.title_separator ~ " " -%}
@@ -23,15 +15,11 @@
       {%- set title_separator = " | " -%}
     {%- endif %}
   {%- endblock seo %}
-  <meta name="HandheldFriendly" content="True" />
-  <meta name="mobile-web-app-capable" content="yes" />
-  <meta name="apple-mobile-web-app-capable" content="yes" />
-  <meta name="apple-mobile-web-app-status-bar-style" content="default" />
-  {{- macros_head::security(config=config) }}
-  {{- macros_head::favicons(config=config) }}
+
   {%- block comments_init %}
   {%- endblock comments_init %}
-  <noscript><link rel="stylesheet" href="{{ get_url(path='nojs.css', trailing_slash=false) | safe }}" /></noscript>
+
+  {%- include "partials/head_js.html" %}
 </head>
 <body>
 {%- block header %}
@@ -39,7 +27,7 @@
     <nav>
       <div>
         {%- if config.extra.logo -%}
-        <h1><a href="{{ get_url(path="/", lang=lang) }}{%- if uglyurls %}/index.html{%- endif %}">
+        <h1><a href="{{ get_url(path="/", lang=lang) }}{%- if uglyurls %}/index.html{%- endif %}" title="{{config.title}}">
         {%- if config.extra.logo.file -%}
         <img src="{{ config.base_url | safe }}/{{ config.extra.logo.file | safe }}"{%- if config.extra.logo.alt %} alt="{{ config.extra.logo.alt | safe }}"{%- endif %}{%- if config.extra.logo.width %} width="{{ config.extra.logo.width | safe }}"{%- endif %}{%- if config.extra.logo.height %} height="{{ config.extra.logo.height | safe }}"{%- endif %} />
         {%- endif -%}
@@ -48,56 +36,65 @@
         {%- elif config.extra.textlogo -%}
         <h1><a href="{{ get_url(path="/", lang=lang) }}{%- if uglyurls -%}
         {%- if lang == config.default_language -%}/{%- endif -%}
-        index.html{%- endif -%}">{{ config.extra.textlogo | safe }}</a></h1>
+        index.html{%- endif -%}" title="{{config.title}}">{{ config.extra.textlogo | safe }}</a></h1>
         {%- elif config.title -%}
-        <h1><a href="{{ get_url(path="/", lang=lang) }}{%- if uglyurls %}/index.html{%- endif %}">{{ config.title | safe }}</a></h1>
+        <h1><a href="{{ get_url(path="/", lang=lang) }}{%- if uglyurls %}/index.html{%- endif %}" title="{{config.title}}">{{ config.title | safe }}</a></h1>
         {%- endif -%}
       </div>
       <div>
-        {% set js_switcher=config.extra.js_switcher | default(value=true) %}
-        {%- if config.extra.menu or js_switcher %}
-        {%- if config.extra.menu %}
-        {%- for i in config.extra.menu -%}
-        <a href="{{ get_url(path=i.url, lang=lang, trailing_slash=i.slash) }}{%- if i.slash and uglyurls %}index.html{%- endif %}"{% if i.blank %} target="_blank"{% endif %}>
-        {%- if lang != config.default_language %} {{ trans(key=i.name | safe, lang=lang) }} {% else %} {{ i.name | safe }} {% endif -%}
-        </a>
-        {%- endfor -%}
-        {%- endif -%}
-        {%- if js_switcher -%}
-        {%- set icon_adjust=config.extra.icon_adjust | default(value="svgs adjust") -%}
-        {%- if icon_adjust -%}<i type="reset" id="mode" class="js {{ icon_adjust }}"></i>{%- else -%}<i type="reset" id="mode" class="js mode">&#9728;</i>{%- endif -%}
-        {%- endif -%}
-        {%- endif -%}
-        {%- if config.languages | length > 0 %}
-        <div class="dropdown" type="Button"> {%- if lang != config.default_language %}{{ trans(key="flag" | safe, lang=lang) }}{% else %}{{ config.extra.flag.en }}{% endif %}
-          {%- if current_url %}
-          <div class="dropdown-content">
-          {%- for lcode,flag in config.extra.flag -%}
-          {%- if lang != lcode -%}
-          {%- if lcode == config.default_language -%}
-          <a type="Button" href="{{ current_url | replace(from=current_path | truncate(length=4, end=""), to="/") | safe }}{%- if uglyurls %}index.html{%- endif %}">{{ flag }}</a><br />
-          {%- else -%}
-          <a type="Button" href="{{ current_url | replace(from=config.base_url, to=config.base_url ~ "/" ~ lcode) | safe }}{%- if uglyurls %}index.html{%- endif %}">{{ flag }}</a><br />
-          {%- endif -%}
-          {%- endif -%}
-          {%- endfor -%}
+        <div>
+          <span>
+            {% set js_switcher=config.extra.js_switcher | default(value=true) %}
+            {%- if config.extra.menu or js_switcher %}
+            {%- if config.extra.menu %}
+            {%- for i in config.extra.menu -%}
+
+
+
+            <a{%- if i.size %} class="{{ i.size }}"{% endif %} href="{%- if i.url is matching("^http[s]?://") %}{{ i.url }}{%- else -%}{{ get_url(path=i.url, lang=lang, trailing_slash=i.slash) }}{%- if i.slash and uglyurls %}index.html{%- endif %}{%- endif %}"{% if i.blank %} target="_blank"{% endif %}>
+            {%- if lang != config.default_language %} {{ trans(key=i.name | safe, lang=lang) }} {% else %} {{ i.name | safe }} {% endif -%}
+            </a>
+            {%- endfor -%}
+            {%- endif -%}
+            {%- if js_switcher -%}
+            {%- set icon_adjust=config.extra.icon_adjust | default(value="svgs adjust") -%}
+            {%- if icon_adjust -%}<i type="reset" id="mode" class="js {{ icon_adjust }}"></i>{%- else -%}<i type="reset" id="mode" class="js mode">&#9728;</i>{%- endif -%}
+            {%- endif -%}
+            {%- endif -%}
+            {%- if config.languages | length > 0 %}
+            <div class="dropdown" type="Button"> {%- if lang != config.default_language %}{{ trans(key="flag" | safe, lang=lang) }}{% else %}{{ config.extra.flag.en }}{% endif %}
+              {%- if current_url %}
+              <div class="dropdown-content">
+              {%- for lcode,flag in config.extra.flag -%}
+              {%- if lang != lcode -%}
+              {%- if lcode == config.default_language -%}
+              <a type="Button" href="{{ current_url | replace(from=current_path | truncate(length=4, end=""), to="/") | safe }}{%- if uglyurls %}index.html{%- endif %}">{{ flag }}</a><br />
+              {%- else -%}
+              <a type="Button" href="{{ current_url | replace(from=config.base_url, to=config.base_url ~ "/" ~ lcode) | safe }}{%- if uglyurls %}index.html{%- endif %}">{{ flag }}</a><br />
+              {%- endif -%}
+              {%- endif -%}
+              {%- endfor -%}
+              </div>
+              {%- endif %}
+            </span>
           </div>
           {%- endif %}
         </div>
-        {%- endif %}
-      </div>
-      {%- if config.build_search_index %}
-      {%- set icon_search=config.extra.icon_search | default(value="svgs search") %}
-      <div>
-        <form autocomplete=off class="js" name="goSearch" id="searchbox">
-          <div class="searchd">
-            <input id="searchinput" type="text" placeholder="{%- if lang != config.default_language %}{{ trans(key="Search" | safe, lang=lang) }}{% else %}Search{% endif %}" title="Search"{% if config.extra.search_library %}{% if config.extra.search_library == "stork" %} data-stork="stork" {% endif %}{% endif %} />
-            <button type="submit" title="Search" class="{%- if icon_search -%}{{ icon_search }}{%- else -%}si{%- endif -%}">{%- if not icon_search -%}&#8981;{%- endif -%}</button>
+        <div>
+          {%- if config.build_search_index %}
+          {%- set icon_search=config.extra.icon_search | default(value="svgs search") %}
+          <div>
+            <form autocomplete=off class="js" name="goSearch" id="searchbox">
+              <div class="searchd">
+                <input id="searchinput" type="text" placeholder="{%- if lang != config.default_language %}{{ trans(key="Search" | safe, lang=lang) }}{% else %}Search{% endif %}" title="Search"{% if config.extra.search_library %}{% if config.extra.search_library == "stork" %} data-stork="stork" {% endif %}{% endif %} />
+                <button type="submit" title="Search" class="{%- if icon_search -%}{{ icon_search }}{%- else -%}si{%- endif -%}">{%- if not icon_search -%}&#8981;{%- endif -%}</button>
+              </div>
+              <div class="results"><div id="suggestions"{% if config.extra.search_library %}{% if config.extra.search_library == "stork" %} data-stork="stork-output" {% endif %}{% endif %}></div></div>
+            </form>
           </div>
-          <div class="results"><div id="suggestions"{% if config.extra.search_library %}{% if config.extra.search_library == "stork" %} data-stork="stork-output" {% endif %}{% endif %}></div></div>
-        </form>
+          {%- endif %}
+        </div>
       </div>
-      {%- endif %}
     </nav>
     {%- if config.extra.sitedesc %}
     {%- if config.description %}
@@ -119,11 +116,12 @@
     <hr />
     {%- endif %}
     <div class="c">
-      {{- social_macros::social_links(config=config) }}
+      {%- include "partials/social.html" %}
 
       {#- Copyright START #}
       {%- if config.extra.copyright | default(value=true) -%}
       {%- set current_year = now() | date(format="%Y") %}
+      {%- set current_year = '<span id="year">' ~ current_year ~ '</span>' %}
 
         {%- if config.extra.copyright_override -%}
           {%- if lang != config.default_language %}
diff --git a/templates/categories/list.html b/templates/categories/list.html
index bbfb6dc..641fcc4 100644
--- a/templates/categories/list.html
+++ b/templates/categories/list.html
@@ -14,7 +14,7 @@
 
   {%- set description = config.description %}
 
-  {{- macros_head::seo(config=config, title=title, title_addition=title_addition, description=description, is_home=true) }}
+  {{- macros_seo::seo(config=config, title=title, title_addition=title_addition, description=description, is_home=true) }}
 {%- endblock seo %}
 
 {%- block content %}
diff --git a/templates/categories/single.html b/templates/categories/single.html
index 7e85232..be219aa 100644
--- a/templates/categories/single.html
+++ b/templates/categories/single.html
@@ -14,7 +14,7 @@
 
   {%- set description = config.description %}
 
-  {{- macros_head::seo(config=config, title=title, title_addition=title_addition, description=description, is_home=true) }}
+  {{- macros_seo::seo(config=config, title=title, title_addition=title_addition, description=description, is_home=true) }}
 {%- endblock seo %}
 
 {%- block content %}
diff --git a/templates/contact.fr.html b/templates/contact.fr.html
deleted file mode 100644
index d23569d..0000000
--- a/templates/contact.fr.html
+++ /dev/null
@@ -1,49 +0,0 @@
-{# Cette page affiche la page de contact, par exemple: example.com/contact/ #}
-
-{% extends "base.html" %}
-
-{%- block seo %}
-  {{- super() }}
-  {%- set title_addition = "" %}
-
-  {%- if page.title and config.title %}
-    {%- set title = page.title %}
-    {%- set title_addition = title_separator ~ config.title %}
-  {%- elif page.title %}
-    {%- set title = page.title %}
-  {%- else %}
-    {%- set title = config.title %}
-  {%- endif %}
-
-  {%- if page.description %}
-    {%- set description = page.description %}
-  {%- else %}
-    {%- set description = config.description %}
-  {%- endif %}
-
-  {{- macros_head::seo(config=config, title=title, title_addition=title_addition, description=description) }}
-{%- endblock seo %}
-
-{%- block content %}
-  <div>
-    <p>Vous voulez entrer en contact ? Remplissez le formulaire ci-dessous pour m'envoyer un message et je vous répondrai dans les plus brefs délais !</p>
-    <form name="contact" method="POST">
-      <p>
-        <label for="name">Nom</label>
-        <input type="text" placeholder="Nom" id="name" required data-validation-required-message="S'il vous plaît entrez votre nom." />
-      </p>
-      <p>
-        <label for="email">Adresse e-mail</label>
-        <input type="email" placeholder="nom@example.com" id="email" required data-validation-required-message="Veuillez saisir votre adresse e-mail." />
-      </p>
-      <p>
-        <label for="message">Message</label>
-        <textarea rows="5" placeholder="Message" id="message" required data-validation-required-message="Veuillez entrer un message."></textarea>
-      </p>
-      <div id="success"></div>
-      <p>
-        <button type="submit" id="sendMessageButton">Envoyer</button>
-      </p>
-    </form>
-  </div>
-{%- endblock content %}
diff --git a/templates/contact.html b/templates/contact.html
deleted file mode 100644
index 526bb61..0000000
--- a/templates/contact.html
+++ /dev/null
@@ -1,49 +0,0 @@
-{# This Page Shows the contact page eg: example.com/contact/ #}
-
-{% extends "base.html" %}
-
-{%- block seo %}
-  {{- super() }}
-  {%- set title_addition = "" %}
-
-  {%- if page.title and config.title %}
-    {%- set title = page.title %}
-    {%- set title_addition = title_separator ~ config.title %}
-  {%- elif page.title %}
-    {%- set title = page.title %}
-  {%- else %}
-    {%- set title = config.title %}
-  {%- endif %}
-
-  {%- if page.description %}
-    {%- set description = page.description %}
-  {%- else %}
-    {%- set description = config.description %}
-  {%- endif %}
-
-  {{- macros_head::seo(config=config, title=title, title_addition=title_addition, description=description) }}
-{%- endblock seo %}
-
-{%- block content %}
-  <div>
-    <p>Want to get in touch? Fill out the form below to send me a message and I will get back to you as soon as possible!</p>
-    <form name="contact" method="POST">
-      <p>
-        <label for="name">Name</label>
-        <input type="text" placeholder="Name" id="name" required data-validation-required-message="Please enter your name." />
-      </p>
-      <p>
-        <label for="email">Email Address</label>
-        <input type="email" placeholder="name@example.com" id="email" required data-validation-required-message="Please enter your email address." />
-      </p>
-      <p>
-        <label for="message">Message</label>
-        <textarea rows="5" placeholder="Message" id="message" required data-validation-required-message="Please enter a message."></textarea>
-      </p>
-      <div id="success"></div>
-      <p>
-        <button type="submit" id="sendMessageButton">Send</button>
-      </p>
-    </form>
-  </div>
-{%- endblock content %}
diff --git a/templates/index.html b/templates/index.html
index a364912..705c630 100644
--- a/templates/index.html
+++ b/templates/index.html
@@ -1,6 +1,6 @@
 {#
-This Page Shows the Posts with a short summary on the index: example.com/
-This Template can also be used as the rendering template for Sections, eg: example.com/blog/  example.com/software/
+This Tempalte Shows a paginated page of the Posts of a section with a short summary.
+This Template can also be used directly for the index eg: example.com/ or as the rendering template for Sections, eg: example.com/blog/  example.com/software/
 #}
 
 {%- extends "base.html" %}
@@ -26,7 +26,7 @@ This Template can also be used as the rendering template for Sections, eg: examp
 
   {%- set description = config.description %}
 
-  {{- macros_head::seo(config=config, title=title, title_addition=title_addition, description=description, is_home=true) }}
+  {{- macros_seo::seo(config=config, title=title, title_addition=title_addition, description=description, is_home=true) }}
 {%- endblock seo %}
 
 
@@ -80,12 +80,12 @@ This Template can also be used as the rendering template for Sections, eg: examp
     {%- else %}
     {%- set section_item = get_section(path=sec ~ "_index." ~ lang ~ ".md") %}
     {%- endif %}
-    <div class="toc">
-      <div class="toc-sticky">
-        <h1><span class="s70">{%- if lang != config.default_language %}{{ trans(key="Recent_Posts" | safe, lang=lang) }}{% else %}Recent Posts{% endif %}</span></h1>
+    <div class="sblock">
+      <div class="blockdiv sticky">
+        <span class="b s150">{%- if lang != config.default_language %}{{ trans(key="Recent_Posts" | safe, lang=lang) }}{% else %}Recent Posts{% endif %}</span>
         {%- set recent_items=config.extra.recent_items | default(value=9) -%}
         {%- for page in section_item.pages | slice(end=recent_items) %}
-          {{- page_macros::page_listing(page=page, config=config) }}
+          {{- macros::page_listing(page=page, config=config) }}
         {%- endfor %}
       </div>
     </div>
diff --git a/templates/macros/head.html b/templates/macros/head.html
deleted file mode 100644
index 3ed3af0..0000000
--- a/templates/macros/head.html
+++ /dev/null
@@ -1,406 +0,0 @@
-{#- Theme Switcher Button to toggle between dark/light #}
-{%- macro theme(config) %}
-  {%- set integrity = config.extra.integrity | default(value=true) -%}
-  {%- if config.extra.offline %}{% set integrity = false %}{% endif %}
-
-  {%- if config.extra.js_switcher | default(value=true) %}
-  {%- set js_theme="js/theme.min.js" %}
-  {%- if config.extra.js_switcher_default %}
-    {%- if config.extra.js_switcher_default == "light" %}{% set js_theme="js/theme_light.min.js" %}{% endif %}
-  {%- endif %}
-  <script src="{{                     get_url(path=js_theme                        , trailing_slash=false) | safe }}"{%- if integrity %} integrity="sha384-{{ get_hash(path=js_theme, sha_type=384, base64=true) | safe }}"{%- endif %}></script>
-  {%- endif %}
-{%- endmacro %}
-
-{%- macro stylesheets(config) %}
-  {%- set stylesheets=config.extra.stylesheets | default(value=[ "abridge.css" ]) -%}
-  {%- if stylesheets %}{%- for i in stylesheets %}
-  <link rel="stylesheet" href="{{     get_url(path=i                               , trailing_slash=false, cachebust=true) | safe }}" />
-  {%- endfor %}{%- endif %}
-{%- endmacro %}
-
-
-
-{%- macro stylesheets_preload(config) %}
-  {%- set integrity = config.extra.integrity | default(value=true) -%}
-  {%- if config.extra.offline %}{% set integrity = false %}{% endif %}
-
-{%- if config.extra.fonts %}{%- for i in config.extra.fonts %}
-  {%- if i.url is matching("^http[s]?://") %}
-  <link rel="preload" as="style" class="preStyle" href="{{ i.url | safe }}" crossorigin="anonymous" />
-  {%- else %}
-  <link rel="preload" as="font" href="{{ get_url(path=i.url, trailing_slash=false) | safe }}" type="font/woff2" />
-  {%- endif %}
-{%- endfor %}{%- endif %}
-
-{%- if config.extra.fontawesome %}
-  <link rel="preload" as="style" class="preStyle" href="{{ config.extra.fontawesome | safe }}" crossorigin="anonymous" />
-{%- endif %}
-
-{%- if config.extra.math or page.extra.math %}
-
-  {%- set katex_css=config.extra.katex_css | default(value="katex.min.css") -%}
-  {%- if katex_css %}{%- if katex_css is matching("^http[s]?://") %}
-  <link rel="preload" as="style" class="preStyle" href="{{ katex_css | safe }}"{%- if integrity and config.extra.katex_css_integrity %} integrity="{{ config.extra.katex_css_integrity | safe }}"{%- endif %} crossorigin="anonymous" />
-  {%- else %}
-  <link rel="preload" as="style" class="preStyle" href="{{ get_url(path=katex_css, trailing_slash=false) }}"{%- if integrity %} integrity="sha384-{{ get_hash(path=katex_css, sha_type=384, base64=true) | safe }}"{%- endif %} />
-  {%- endif %}{%- endif %}
-
-{%- endif %}
-
-{%- endmacro %}
-
-
-
-{%- macro feed(config) %}
-  {%- if config.generate_feed %}
-  <link rel="alternate" type="{% if config.feed_filename is containing('atom') %}application/atom+xml{% else %}application/rss+xml{% endif %}" title="{{ config.title }} Atom/RSS Feed" href="{{ get_url(path=config.feed_filename, trailing_slash=false, lang=lang) | safe }}" />
-  {%- endif %}
-{%- endmacro %}
-
-
-
-{%- macro js(config) %}
-  {%- set integrity = config.extra.integrity | default(value=true) -%}
-  {%- if config.extra.offline %}{% set integrity = false %}{% endif %}
-  {%- set search_library=config.extra.search_library | default(value="elasticlunr") -%}
-
-  {%- set preStyle = false %}
-
-  {%- if config.extra.fonts %}{%- for i in config.extra.fonts %}
-    {%- if i.url is matching("^http[s]?://") %}
-      {%- set preStyle = true %}
-    {%- endif %}
-  {%- endfor %}{%- endif %}
-
-  {%- if config.extra.fontawesome %}
-    {%- set preStyle = true %}
-  {%- endif %}
-
-  {%- if config.extra.math or page.extra.math %}
-    {%- set katex_css=config.extra.katex_css | default(value="katex.min.css") -%}
-    {%- if katex_css %}
-      {%- set preStyle = true %}
-    {%- endif %}
-  {%- endif %}
-
-
-{%- if config.extra.js_bundle %}
-  {%- if config.build_search_index %}
-  {%- if config.extra.pwa | default(value=false) %}
-  <script defer src="{{               get_url(path='js/abridge.min.js'             , trailing_slash=false, cachebust=true) | safe }}"{%- if integrity %} integrity="sha384-{{ get_hash(path='js/abridge.min.js', sha_type=384, base64=true) | safe }}"{%- endif %}></script>
-  {%- else %}
-  <script defer src="{{               get_url(path='js/abridge_nopwa.min.js'             , trailing_slash=false, cachebust=true) | safe }}"{%- if integrity %} integrity="sha384-{{ get_hash(path='js/abridge_nopwa.min.js', sha_type=384, base64=true) | safe }}"{%- endif %}></script>
-  {%- endif %}
-
-  {%- else %}
-  {%- if config.extra.pwa | default(value=false) %}
-  <script defer src="{{               get_url(path='js/abridge_nosearch.min.js'    , trailing_slash=false, cachebust=true) | safe }}"{%- if integrity %} integrity="sha384-{{ get_hash(path='js/abridge_nosearch.min.js', sha_type=384, base64=true) | safe }}"{%- endif %}></script>
-  {%- else %}
-  <script defer src="{{               get_url(path='js/abridge_nosearch_nopwa.min.js'    , trailing_slash=false, cachebust=true) | safe }}"{%- if integrity %} integrity="sha384-{{ get_hash(path='js/abridge_nosearch_nopwa.min.js', sha_type=384, base64=true) | safe }}"{%- endif %}></script>
-  {%- endif %}
-  {%- endif %}
-
-  {%- if config.build_search_index %}
-  {%- if search_library == "elasticlunr" %}
-  {%- if lang != "en" %}
-  <script defer src="{{               get_url(path='js/lunr.stemmer.support.min.js', trailing_slash=false) | safe }}"{%- if integrity %} integrity="sha384-{{ get_hash(path='js/lunr.stemmer.support.min.js', sha_type=384, base64=true) | safe }}"{%- endif %}></script>
-  <script defer src="{{               get_url(path='js/lunr.' ~ lang ~ '.min.js'   , trailing_slash=false) | safe }}"{%- if integrity %} integrity="sha384-{{ get_hash(path='js/lunr.' ~ lang ~ '.min.js', sha_type=384, base64=true) | safe }}"{%- endif %}></script>
-  {%- endif %}
-  {%- endif %}
-  {%- endif %}
-
-{%- else %}{#- Not js_bundle #}
-
-  {%- if preStyle == true %}
-  {%- if config.extra.js_prestyle | default(value=true) %}
-  <script defer src="{{               get_url(path='js/prestyle.js'                , trailing_slash=false, cachebust=true) | safe }}"{%- if integrity %} integrity="sha384-{{ get_hash(path='js/prestyle.js', sha_type=384, base64=true) | safe }}"{%- endif %}></script>
-  {%- endif %}
-  {%- endif %}
-
-  {%- if config.extra.js_switcher | default(value=true) %}
-  <script defer src="{{               get_url(path='js/theme_button.js'            , trailing_slash=false, cachebust=true) | safe }}"{%- if integrity %} integrity="sha384-{{ get_hash(path='js/theme_button.js', sha_type=384, base64=true) | safe }}"{%- endif %}></script>
-  {%- endif %}
-
-  {%- if config.extra.js_email_encode | default(value=true) %}
-  <script defer src="{{               get_url(path='js/email.js'                   , trailing_slash=false, cachebust=true) | safe }}"{%- if integrity %} integrity="sha384-{{ get_hash(path='js/email.js', sha_type=384, base64=true) | safe }}"{%- endif %}></script>
-  {%- endif %}
-
-  {%- if config.extra.js_copycode | default(value=true) %}
-  <script defer src="{{               get_url(path='js/codecopy.js'                , trailing_slash=false, cachebust=true) | safe }}"{%- if integrity %} integrity="sha384-{{ get_hash(path='js/codecopy.js', sha_type=384, base64=true) | safe }}"{%- endif %}></script>
-  {%- endif %}
-
-  {%- if config.extra.pwa | default(value=false) %}
-  <script defer src="{{               get_url(path='js/sw_load.js'             , trailing_slash=false, cachebust=true) | safe }}"{%- if integrity %} integrity="sha384-{{ get_hash(path='js/sw_load.js', sha_type=384, base64=true) | safe }}"{%- endif %}></script>
-  {%- endif %}
-
-  {%-   if search_library == "tinysearch" %}
-  <script defer type="module" src="{{ get_url(path='js/tinysearch.js'   , trailing_slash=false, cachebust=true) | safe }}"{%- if integrity %} integrity="sha384-{{ get_hash(path='js/tinysearch.js'   , sha_type=384, base64=true) | safe }}"{%- endif %}></script>
-  {%- elif search_library == "stork"      %}
-  <script defer type="module" src="{{ get_url(path='js/search_stork.min.js'        , trailing_slash=false, cachebust=true) | safe }}"{%- if integrity %} integrity="sha384-{{ get_hash(path='js/search_stork.min.js'        , sha_type=384, base64=true) | safe }}"{%- endif %}></script>
-  {%- elif config.build_search_index %}
-
-  {%- set search_index_format="elasticlunr_json" -%}
-  {%- if config.search.index_format %}
-    {%- if config.search.index_format == "elasticlunr_javascript" %}
-      {%- set search_index_format="elasticlunr_javascript" -%}
-    {%- endif %}
-  {%- endif %}
-
-  {%- set uglyurls = config.extra.uglyurls | default(value=false) -%}
-  {%- if config.extra.offline %}{% set uglyurls = true %}{% endif %}
-  {%- if search_index_format == "elasticlunr_javascript" %}{#- Javascript index format #}
-  <script defer src="{{               get_url(path='js/elasticlunr.min.js'         , trailing_slash=false, cachebust=true) | safe }}"{%- if integrity %} integrity="sha384-{{ get_hash(path='js/elasticlunr.min.js'         , sha_type=384, base64=true) | safe }}"{%- endif %}></script>
-  <script defer src="{{               get_url(path='search_index.' ~ lang ~ '.js'  , trailing_slash=false, cachebust=true) | safe }}"{%- if integrity %} integrity="sha384-{{ get_hash(path='search_index.' ~ lang ~ '.js'  , sha_type=384, base64=true) | safe }}"{%- endif %}></script>
-
-  {%- if uglyurls %}
-  <script defer src="{{               get_url(path='js/searchjavaugly.js'          , trailing_slash=false, cachebust=true) | safe }}"{%- if integrity %} integrity="sha384-{{ get_hash(path='js/searchjavaugly.js'          , sha_type=384, base64=true) | safe }}"{%- endif %}></script>
-  {%- else %}
-  <script defer src="{{               get_url(path='js/searchjava.js'              , trailing_slash=false, cachebust=true) | safe }}"{%- if integrity %} integrity="sha384-{{ get_hash(path='js/searchjava.js'              , sha_type=384, base64=true) | safe }}"{%- endif %}></script>
-  {%- endif %}
-
-  {%- else %}
-  <script defer src="{{               get_url(path='js/search_elasticlunr.min.js'  , trailing_slash=false, cachebust=true) | safe }}"{%- if integrity %} integrity="sha384-{{ get_hash(path='js/search_elasticlunr.min.js'  , sha_type=384, base64=true) | safe }}"{%- endif %}></script>
-  {%- endif %}
-
-  {%- if lang != "en" %}
-  <script defer src="{{               get_url(path='js/lunr.stemmer.support.min.js', trailing_slash=false) | safe }}"{%- if integrity %} integrity="sha384-{{ get_hash(path='js/lunr.stemmer.support.min.js', sha_type=384, base64=true) | safe }}"{%- endif %}></script>
-  <script defer src="{{               get_url(path='js/lunr.' ~ lang ~ '.min.js'   , trailing_slash=false) | safe }}"{%- if integrity %} integrity="sha384-{{ get_hash(path='js/lunr.' ~ lang ~ '.min.js'   , sha_type=384, base64=true) | safe }}"{%- endif %}></script>
-  {%- endif %}
-
-  {%- endif %}
-
-{%- endif %}
-
-
-{#- https://katex.org/docs/autorender.html #}
-{#- https://github.com/KaTeX/KaTeX/ #}
-{#- https://github.com/KaTeX/KaTeX/tree/main/contrib/mathtex-script-type/ #}
-{%- if config.extra.math or page.extra.math %}
-
-{%- set katex_bundle=config.extra.katex_bundle | default(value="js/katexbundle.min.js") -%}
-{%- if katex_bundle %}
-  <script defer src="{{               get_url(path=katex_bundle                    , trailing_slash=false, cachebust=true) }}"{%- if integrity %} integrity="sha384-{{ get_hash(path=katex_bundle, sha_type=384, base64=true) | safe }}"{%- endif %}></script>
-{%- else %}
-
-  {%- set katex_js=config.extra.katex_js | default(value="js/katex.min.js") -%}
-  {%- if katex_js %}{%- if katex_js is matching("^http[s]?://") %}
-  <script defer src="{{               katex_js | safe }}"{%- if integrity and config.extra.katex_js_integrity %} integrity="{{ config.extra.katex_js_integrity | safe }}"{%- endif %} crossorigin="anonymous"></script>
-  {%- else %}
-  <script defer src="{{               get_url(path=katex_js                        , trailing_slash=false, cachebust=true) }}"{%- if integrity %} integrity="sha384-{{ get_hash(path=katex_js, sha_type=384, base64=true) | safe }}"{%- endif %}></script>
-  {%- endif %}{%- endif %}
-
-  {%- set mathtex_js=config.extra.mathtex_js | default(value="js/mathtex-script-type.min.js") -%}
-  {%- if mathtex_js %}{%- if mathtex_js is matching("^http[s]?://") %}
-  <script defer src="{{ mathtex_js | safe }}"{%- if integrity and config.extra.mathtex_js_integrity %} integrity="{{ config.extra.mathtex_js_integrity | safe }}"{%- endif %} crossorigin="anonymous"></script>
-  {%- else %}
-  <script defer src="{{               get_url(path=mathtex_js                      , trailing_slash=false, cachebust=true) }}"{%- if integrity %} integrity="sha384-{{ get_hash(path=mathtex_js, sha_type=384, base64=true) | safe }}"{%- endif %}></script>
-  {%- endif %}{%- endif %}
-
- {%- if config.extra.math_auto_render or page.extra.math_auto_render %}
-  {%- set katex_autorender_js=config.extra.katex_autorender_js | default(value="js/katex-auto-render.min.js") -%}
-  {%- if katex_autorender_js %}
-  {%- if katex_autorender_js is matching("^http[s]?://") %}
-  <script defer src="{{               katex_autorender_js | safe }}"{%- if integrity and config.extra.katex_autorender_js_integrity %} integrity="{{ config.extra.katex_autorender_js_integrity | safe }}"{%- endif %} crossorigin="anonymous"></script>
-  {%- else %}
-  <script defer src="{{               get_url(path=katex_autorender_js             , trailing_slash=false, cachebust=true) }}"{%- if integrity %} integrity="sha384-{{ get_hash(path=katex_autorender_js, sha_type=384, base64=true) | safe }}"{%- endif %}></script>
-  {%- endif %}
-  {%- endif %}
-  {%- set katex_options=config.extra.katex_options | default(value="js/katexoptions.js") -%}
-  {%- if katex_options %}
-  <script defer src="{{               get_url(path=katex_options                   , trailing_slash=false, cachebust=true) }}"{%- if integrity %} integrity="sha384-{{ get_hash(path=katex_options, sha_type=384, base64=true) | safe }}"{%- endif %}></script>
-  {%- endif %}
- {%- endif %}
-{%- endif %}
-
-{%- endif %}
-
-{%- endmacro %}
-
-
-
-{%- macro favicons(config) %}
-  {%- if config.extra.favicon_theme_color %}
-  <meta name="theme-color" content="{{ config.extra.favicon_theme_color }}" />
-  {%- endif %}
-
-  {%- if config.extra.favicon_ms_color %}
-  <meta name="msapplication-TileColor" content="{{ config.extra.favicon_ms_color }}" />
-  {%- endif %}
-
-  {%- if config.extra.webmanifest %}
-  <link rel="manifest" href="{{ get_url(path=config.extra.webmanifest, trailing_slash=false) | safe }}" />
-  {%- endif %}
-
-  {%- if config.extra.favicon_mask and config.extra.favicon_mask_color %}
-  <link rel="mask-icon" href="{{ get_url(path=config.extra.favicon_mask, trailing_slash=false) | safe }}" color="{{ config.extra.favicon_mask_color }}" />
-  {%- endif %}
-
-  {%- if config.extra.favicon_svg %}
-  <link rel="icon" type="image/svg+xml" href="{{ get_url(path=config.extra.favicon_svg, trailing_slash=false) | safe }}" />
-  {%- endif %}
-
-  {%- if config.extra.favicon180 %}
-  <link rel="apple-touch-icon" sizes="180x180" href="{{ get_url(path=config.extra.favicon180, trailing_slash=false) | safe }}" />
-  {%- endif %}
-
-  {%- if config.extra.favicon32 %}
-  <link rel="icon" type="image/png" sizes="32x32" href="{{ get_url(path=config.extra.favicon32, trailing_slash=false) | safe }}" />
-  {%- endif %}
-
-  {%- if config.extra.favicon16 %}
-  <link rel="icon" type="image/png" sizes="16x16" href="{{ get_url(path=config.extra.favicon16, trailing_slash=false) | safe }}" />
-  {%- endif %}
-{%- endmacro %}
-
-
-
-{%- macro security(config) %}
-  {%- if config.extra.security_header_referrer %}
-  <meta name="referrer" content="{{ config.extra.security_header_referrer | safe }}" />
-  {%- endif %}
-  {%- if config.extra.security_header_csp %}
-  <meta http-equiv="Content-Security-Policy" content="{{ config.extra.security_header_csp | safe }}" />
-  {%- endif %}
-{%- endmacro %}
-
-
-
-{#- type:          website or article, generally setting article for blog articles -#}
-{#- page_images:   using for the blog single template page -#}
-{#- page_section:  the blog single template page have to pass the parameter -#}
-{#- is_404:        using for the 404.html template -#}
-{%- macro seo( config, title="", title_addition="", description="", type="website", is_home=false, is_404=false, is_page=false, page_images="", page_section="", created_time="2023-05-15T07:07:00-07:00", updated_time="2023-05-15T07:07:00-07:00" ) %}
-{%- if is_404 -%}
-  <meta name="robots" content="noindex, follow" />
-{%- else -%}
-  <meta name="robots" content="index, follow" />
-  <meta name="googlebot" content="index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1" />
-  <meta name="bingbot" content="index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1" />
-{%- endif -%}
-
-{%- if current_url %}
-  {%- set page_url = current_url %}
-{%- else %}
-  {%- set page_url = get_url(path="404.html", trailing_slash=true) %}
-{%- endif %}
-  <title>{{ title ~ title_addition }}</title>
-
-{%- if config.extra.author %}
-  <meta name="author" content="{{ config.extra.author }}" />
-{%- endif %}
-{%- if config.extra.facebook_publisher %}
-  <meta property="article:publisher" content="https://www.facebook.com/{{ config.extra.facebook_publisher }}" />
-{%- endif %}
-  <meta name="copyright" content="{{ config.title }}" />
-{%- if config.extra.facebook_author %}
-  <meta property="article:author" content="https://www.facebook.com/{{ config.extra.facebook_author }}" />
-{%- endif %}
-{%- if page.description %}
-  <meta name="description" content="{{ page.description }}" />
-{%- else %}
-  <meta name="description" content="{{ config.description }}" />
-{%- endif %}
-  <link rel="canonical" href="{{ page_url | safe }}" />
-{%- if page.extra.keywords and config.extra.keywords %}
-  <meta name="keywords" content="{{ page.extra.keywords }}, {{ config.extra.keywords }}" />
-{%- elif page.extra.keywords %}
-  <meta name="keywords" content="{{ page.extra.keywords }}" />
-{%- elif config.extra.keywords %}
-  <meta name="keywords" content="{{ config.extra.keywords }}" />
-{%- endif %}
-
-{#- Extra SEO START #}
-{%- if config.extra.seo | default(value=true) %}
-{%- if not is_404 %}
-
-{%- if config.extra.google %}
-  <meta name="google-site-verification" content="{{ config.extra.google | safe }}" />
-{%- endif %}
-
-{%- if config.extra.bing %}
-  <meta name="msvalidate.01" content="{{ config.extra.bing | safe}}" />
-{%- endif %}
-  <meta property="og:url" content="{{ page_url | safe }}" />
-  <meta name="twitter:url" content="{{ page_url | safe }}" />
-
-{%- if page.description %}
-  <meta property="og:description" content="{{ page.description }}" />
-  <meta name="twitter:description" content="{{ page.description }}" />
-{%- else %}
-  <meta property="og:description" content="{{ config.description }}" />
-  <meta name="twitter:description" content="{{ config.description}}" />
-{%- endif %}
-
-{%- if page.title %}
-  <meta property="og:title" content="{{ page.title }} | {{ config.title }}" />
-  <meta name="twitter:title" content="{{ page.title }} | {{ config.title }}" />
-{%- else %}
-  <meta property="og:title" content="{{ config.title }}" />
-  <meta name="twitter:title" content="{{ config.title }}" />
-{%- endif %}
-
-
-{#- SEO MEDIA START #}
-{%- if page.extra.thumbnail %}
-  <meta name="twitter:card" content="summary_large_image" />
-  <meta name="twitter:image" content="{{ get_url(path=page.path ~ page.extra.thumbnail, trailing_slash=false) }}" />
-  <meta property="og:image" content="{{ get_url(path=page.path ~ page.extra.thumbnail, trailing_slash=false) }}" />
-
-{%- elif page.extra.static_thumbnail %}
-  <meta name="twitter:card" content="summary_large_image" />
-  {%- if page.extra.static_thumbnail is matching("^http[s]?://") %}
-  <meta name="twitter:image" content="{{ page.extra.static_thumbnail }}" />
-  <meta property="og:image" content="{{ page.extra.static_thumbnail }}" />
-  {%- else %}
-  <meta name="twitter:image" content="{{ get_url(path=page.extra.static_thumbnail, trailing_slash=false) }}" />
-  <meta property="og:image" content="{{ get_url(path=page.extra.static_thumbnail, trailing_slash=false) }}" />
-  {%- endif %}
-
-{%- elif config.extra.banner %}
-  <meta name="twitter:card" content="summary_large_image" />
-  <meta name="twitter:image" content="{{ get_url(path=config.extra.banner, trailing_slash=false) }}" />
-  <meta property="og:image" content="{{ get_url(path=config.extra.banner, trailing_slash=false) }}" />
-
-{%- else %}
-  <meta name="twitter:card" content="summary" />
-
-{%- endif %}
-
-{%- if config.extra.open.audio %}
-  <meta property="og:audio" content="{{ config.extra.open.audio }}" />
-{%- endif %}
-
-{%- if config.extra.open.locale %}
-  <meta property="og:locale" content="{{ config.extra.open.locale }}" />
-{%- endif %}
-
-{%- if config.extra.open.videos %}
-  {%- for video in config.extra.open.videos %}
-  <meta property="og:video" content="{{ get_url(path=video) }}" />
-  {%- endfor %}
-{%- endif %}
-
-{#- SEO MEDIA END #}
-  <meta property="og:site_name" content="{{ config.title }}" />
-  <meta property="og:locale" content="en_US" />
-  <meta property="og:type" content="website" />
-{%- if page.updated %}
-  <meta property="og:updated_time" content="{{ page.updated | date(format='%F') }}" />
-{%- elif page.date %}
-  <meta property="og:updated_time" content="{{ page.date | date(format='%F') }}" />
-{%- else %}
-  <meta property="og:updated_time" content="{{ updated_time }}" />
-{%- endif %}
-
-{%- if config.extra.twitter_meta %}
-  <meta name="twitter:site" content="@{{ config.extra.twitter_meta }}" />
-  <meta name="twitter:creator" content="@{{ config.extra.twitter_meta }}" />
-{%- endif %}
-
-
-
-{%- endif %}
-{%- endif %}
-{#- Extra SEO END #}
-{%- endmacro %}
diff --git a/templates/macros/macros.html b/templates/macros/macros.html
index 000130a..66673d1 100644
--- a/templates/macros/macros.html
+++ b/templates/macros/macros.html
@@ -1,9 +1,21 @@
+{%- macro page_listing(page, config) %}
+{%- set uglyurls = config.extra.uglyurls | default(value=false) -%}
+{%- if config.extra.offline %}{% set uglyurls = true %}{% endif %}
+        <div class="tpad">
+          <a href="{{ page.permalink | safe}}{%- if uglyurls %}index.html{%- endif %}">{{ page.title }}</a>
+        </div>
+{%- endmacro page_listing %}
+
+
+
 {%- macro title_post(page, config) %}
 {%- set uglyurls = config.extra.uglyurls | default(value=false) -%}
 {%- if config.extra.offline %}{% set uglyurls = true %}{% endif %}
       <h1><a href="{{ page.permalink | safe }}{%- if uglyurls %}index.html{%- endif %}">{{ page.title }}</a></h1>
 {%- endmacro title_post %}
 
+
+
 {%- macro meta_post(page, config) %}
 {%- set uglyurls = config.extra.uglyurls | default(value=false) -%}
 {%- if config.extra.offline %}{% set uglyurls = true %}{% endif %}
@@ -29,7 +41,7 @@
           {#- divider #}
           {%- if config.extra.meta_post.author %}
           {%- if config.extra.meta_post.readtime or config.extra.meta_post.date or config.extra.meta_post.updated or config.extra.meta_post.categories_tags %}
-          {%- if config.extra.meta_post.divider %}<span class="hpad">{{ config.extra.meta_post.divider | safe }}</span>{%- else %} &nbsp; {%- endif %}
+          {%- if config.extra.meta_post.divider %}<span class="hpad">{{ config.extra.meta_post.divider | safe }}</span>{%- else %} <span class="rpad"></span> {%- endif %}
           {%- endif %}
           {%- endif %}
 
@@ -37,7 +49,7 @@
           {%- if config.extra.meta_post.readtime %} {%- if config.extra.icon_read %}<i class="{{ config.extra.icon_read }}"></i> {% endif %} {{ page.reading_time }} {{ config.extra.meta_post.readstring | default(value="min") }}
           {#- divider #}
           {%- if config.extra.meta_post.date or config.extra.meta_post.updated or config.extra.meta_post.categories_tags %}
-          {%- if config.extra.meta_post.divider %}<span class="hpad">{{ config.extra.meta_post.divider | safe }}</span>{%- else %} &nbsp; {%- endif %}{%- endif %}{%- endif %}
+          {%- if config.extra.meta_post.divider %}<span class="hpad">{{ config.extra.meta_post.divider | safe }}</span>{%- else %} <span class="rpad"></span> {%- endif %}{%- endif %}{%- endif %}
 
         {#- Date #}
           {%- if config.extra.meta_post.date %} {%- if config.extra.icon_date %}<i class="{{ config.extra.icon_date }}"></i> {% endif %}
@@ -51,7 +63,7 @@
           {%- else %} {{ page.date | date(format="%B %d, %Y") }} {%- endif %}
           {#- divider #}
           {%- if config.extra.meta_post.updated or config.extra.meta_post.categories_tags %}
-          {%- if config.extra.meta_post.divider %}<span class="hpad">{{ config.extra.meta_post.divider | safe }}</span>{%- else %} &nbsp; {%- endif %}{%- endif %}{% endif %}
+          {%- if config.extra.meta_post.divider %}<span class="hpad">{{ config.extra.meta_post.divider | safe }}</span>{%- else %} <span class="rpad"></span> {%- endif %}{%- endif %}{% endif %}
 
         {#- Updated #}
           {%- if config.extra.meta_post.updated and page.updated %} {%- if config.extra.icon_date %}<i class="{{ config.extra.icon_date }}"></i> {% endif -%}
@@ -65,7 +77,7 @@
           {%- else %} {{ page.updated | date(format="%B %d, %Y") }} {%- endif %}
           {#- divider #}
           {%- if config.extra.meta_post.categories_tags %}
-          {%- if config.extra.meta_post.divider %}<span class="hpad">{{ config.extra.meta_post.divider | safe }}</span>{%- else %} &nbsp; {%- endif %}{%- endif %}{% endif %}
+          {%- if config.extra.meta_post.divider %}<span class="hpad">{{ config.extra.meta_post.divider | safe }}</span>{%- else %} <span class="rpad"></span> {%- endif %}{%- endif %}{% endif %}
 
         {#- Categories #}
           {%- if page.taxonomies.categories %} {%- if config.extra.icon_info %}<i class="{{ config.extra.icon_info }}"></i> {% endif %} [{% for cat in page.taxonomies.categories %}<a href="{{ get_taxonomy_url(kind='categories', name=cat, lang=lang) | safe }}{%- if uglyurls %}index.html{%- endif %}">{{ cat }}</a>{% endfor %}]{% endif %}
@@ -74,6 +86,8 @@
           {%- if page.taxonomies.tags %} {%- for tag in page.taxonomies.tags %} #<a href="{{ get_taxonomy_url(kind='tags', name=tag, lang=lang) | safe }}{%- if uglyurls %}index.html{%- endif %}">{{ tag }}</a> {% endfor -%}{%- endif %}</span>
 {%- endmacro meta_post %}
 
+
+
 {%- macro title_index(page, config) %}
 {%- set uglyurls = config.extra.uglyurls | default(value=false) -%}
 {%- if config.extra.offline %}{% set uglyurls = true %}{% endif %}
@@ -81,6 +95,7 @@
 {%- endmacro title_index %}
 
 
+
 {%- macro meta_index(page, config) %}
 {%- set uglyurls = config.extra.uglyurls | default(value=false) -%}
 {%- if config.extra.offline %}{% set uglyurls = true %}{% endif %}
@@ -106,7 +121,7 @@
           {#- divider #}
           {%- if config.extra.meta_index.author %}
           {%- if config.extra.meta_index.readtime or config.extra.meta_index.date or config.extra.meta_index.updated or config.extra.meta_index.categories_tags %}
-          {%- if config.extra.meta_index.divider %}<span class="hpad">{{ config.extra.meta_index.divider | safe }}</span>{%- else %} &nbsp; {%- endif %}
+          {%- if config.extra.meta_index.divider %}<span class="hpad">{{ config.extra.meta_index.divider | safe }}</span>{%- else %} <span class="rpad"></span> {%- endif %}
           {%- endif %}
           {%- endif %}
 
@@ -114,7 +129,7 @@
           {%- if config.extra.meta_index.readtime %} {%- if config.extra.icon_read %}<i class="{{ config.extra.icon_read }}"></i> {% endif %} {{ page.reading_time }} {{ config.extra.meta_index.readstring | default(value="min") }}
           {#- divider #}
           {%- if config.extra.meta_index.date or config.extra.meta_index.updated or config.extra.meta_index.categories_tags %}
-          {%- if config.extra.meta_index.divider %}<span class="hpad">{{ config.extra.meta_index.divider | safe }}</span>{%- else %} &nbsp; {%- endif %}{%- endif %}{%- endif %}
+          {%- if config.extra.meta_index.divider %}<span class="hpad">{{ config.extra.meta_index.divider | safe }}</span>{%- else %} <span class="rpad"></span> {%- endif %}{%- endif %}{%- endif %}
 
         {#- Date #}
           {%- if config.extra.meta_index.date %} {%- if config.extra.icon_date %}<i class="{{ config.extra.icon_date }}"></i> {% endif %}
@@ -128,7 +143,7 @@
           {%- else %} {{ page.date | date(format="%B %d, %Y") }} {%- endif %}
           {#- divider #}
           {%- if config.extra.meta_index.updated or config.extra.meta_index.categories_tags %}
-          {%- if config.extra.meta_index.divider %}<span class="hpad">{{ config.extra.meta_index.divider | safe }}</span>{%- else %} &nbsp; {%- endif %}{%- endif %}{% endif %}
+          {%- if config.extra.meta_index.divider %}<span class="hpad">{{ config.extra.meta_index.divider | safe }}</span>{%- else %} <span class="rpad"></span> {%- endif %}{%- endif %}{% endif %}
 
         {#- Updated #}
           {%- if config.extra.meta_index.updated and page.updated %} {%- if config.extra.icon_date %}<i class="{{ config.extra.icon_date }}"></i> {% endif -%}
@@ -143,7 +158,7 @@
 
           {#- divider #}
           {%- if config.extra.meta_index.categories_tags %}
-          {%- if config.extra.meta_index.divider %}<span class="hpad">{{ config.extra.meta_index.divider | safe }}</span>{%- else %} &nbsp; {%- endif %}{%- endif %}{% endif %}
+          {%- if config.extra.meta_index.divider %}<span class="hpad">{{ config.extra.meta_index.divider | safe }}</span>{%- else %} <span class="rpad"></span> {%- endif %}{%- endif %}{% endif %}
 
         {#- Categories #}
           {%- if page.taxonomies.categories %} {%- if config.extra.icon_info %}<i class="{{ config.extra.icon_info }}"></i> {% endif %} [{% for cat in page.taxonomies.categories %}<a href="{{ get_taxonomy_url(kind='categories', name=cat, lang=lang) | safe }}{%- if uglyurls %}index.html{%- endif %}">{{ cat }}</a>{% endfor %}]{% endif %}
@@ -154,7 +169,6 @@
 
 
 
-
 {%- macro footer(page, config) %}
 {%- set uglyurls = config.extra.uglyurls | default(value=false) -%}
 {%- if config.extra.offline %}{% set uglyurls = true %}{% endif %}
@@ -178,6 +192,7 @@
 {%- endmacro footer %}
 
 
+
 {%- macro pagination(paginator, config)%}
 {%- set uglyurls = config.extra.uglyurls | default(value=false) -%}
 {%- if config.extra.offline %}{% set uglyurls = true %}{% endif %}
diff --git a/templates/macros/page.html b/templates/macros/page.html
deleted file mode 100644
index 23b9e09..0000000
--- a/templates/macros/page.html
+++ /dev/null
@@ -1,7 +0,0 @@
-{%- macro page_listing(page, config) %}
-{%- set uglyurls = config.extra.uglyurls | default(value=false) -%}
-{%- if config.extra.offline %}{% set uglyurls = true %}{% endif %}
-        <div class="toc-item">
-          <a href="{{ page.permalink | safe}}{%- if uglyurls %}index.html{%- endif %}">{{ page.title }}</a>
-        </div>
-{%- endmacro page_listing %}
diff --git a/templates/macros/seo.html b/templates/macros/seo.html
new file mode 100644
index 0000000..8d2ada1
--- /dev/null
+++ b/templates/macros/seo.html
@@ -0,0 +1,140 @@
+{#- type:          website or article, generally setting article for blog articles -#}
+{#- page_images:   using for the blog single template page -#}
+{#- page_section:  the blog single template page have to pass the parameter -#}
+{#- is_404:        using for the 404.html template -#}
+
+{%- macro seo( config, title="", title_addition="", description="", type="website", is_home=false, is_404=false, is_page=false, page_images="", page_section="", created_time="2023-05-15T07:07:00-07:00", updated_time="2023-05-15T07:07:00-07:00" ) %}
+
+{%- if is_404 -%}
+  <meta name="robots" content="noindex, follow" />
+{%- else -%}
+  <meta name="robots" content="index, follow" />
+  <meta name="googlebot" content="index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1" />
+  <meta name="bingbot" content="index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1" />
+{%- endif -%}
+
+{%- if current_url %}
+  {%- set page_url = current_url %}
+{%- else %}
+  {%- set page_url = get_url(path="404.html", trailing_slash=true) %}
+{%- endif %}
+  <title>{{ title ~ title_addition }}</title>
+
+{%- if config.extra.author %}
+  <meta name="author" content="{{ config.extra.author }}" />
+{%- endif %}
+{%- if config.extra.facebook_publisher %}
+  <meta property="article:publisher" content="https://www.facebook.com/{{ config.extra.facebook_publisher }}" />
+{%- endif %}
+  <meta name="copyright" content="{{ config.title }}" />
+{%- if config.extra.facebook_author %}
+  <meta property="article:author" content="https://www.facebook.com/{{ config.extra.facebook_author }}" />
+{%- endif %}
+{%- if page.description %}
+  <meta name="description" content="{{ page.description }}" />
+{%- else %}
+  <meta name="description" content="{{ config.description }}" />
+{%- endif %}
+  <link rel="canonical" href="{{ page_url | safe }}" />
+{%- if page.extra.keywords and config.extra.keywords %}
+  <meta name="keywords" content="{{ page.extra.keywords }}, {{ config.extra.keywords }}" />
+{%- elif page.extra.keywords %}
+  <meta name="keywords" content="{{ page.extra.keywords }}" />
+{%- elif config.extra.keywords %}
+  <meta name="keywords" content="{{ config.extra.keywords }}" />
+{%- endif %}
+
+{#- Extra SEO START #}
+{%- if config.extra.seo | default(value=true) %}
+{%- if not is_404 %}
+
+{%- if config.extra.google %}
+  <meta name="google-site-verification" content="{{ config.extra.google | safe }}" />
+{%- endif %}
+
+{%- if config.extra.bing %}
+  <meta name="msvalidate.01" content="{{ config.extra.bing | safe}}" />
+{%- endif %}
+  <meta property="og:url" content="{{ page_url | safe }}" />
+  <meta name="twitter:url" content="{{ page_url | safe }}" />
+
+{%- if page.description %}
+  <meta property="og:description" content="{{ page.description }}" />
+  <meta name="twitter:description" content="{{ page.description }}" />
+{%- else %}
+  <meta property="og:description" content="{{ config.description }}" />
+  <meta name="twitter:description" content="{{ config.description}}" />
+{%- endif %}
+
+{%- if page.title %}
+  <meta property="og:title" content="{{ page.title }} | {{ config.title }}" />
+  <meta name="twitter:title" content="{{ page.title }} | {{ config.title }}" />
+{%- else %}
+  <meta property="og:title" content="{{ config.title }}" />
+  <meta name="twitter:title" content="{{ config.title }}" />
+{%- endif %}
+
+
+{#- SEO MEDIA START #}
+{%- if page.extra.thumbnail %}
+  <meta name="twitter:card" content="summary_large_image" />
+  <meta name="twitter:image" content="{{ get_url(path=page.path ~ page.extra.thumbnail, trailing_slash=false) }}" />
+  <meta property="og:image" content="{{ get_url(path=page.path ~ page.extra.thumbnail, trailing_slash=false) }}" />
+
+{%- elif page.extra.static_thumbnail %}
+  <meta name="twitter:card" content="summary_large_image" />
+  {%- if page.extra.static_thumbnail is matching("^http[s]?://") %}
+  <meta name="twitter:image" content="{{ page.extra.static_thumbnail }}" />
+  <meta property="og:image" content="{{ page.extra.static_thumbnail }}" />
+  {%- else %}
+  <meta name="twitter:image" content="{{ get_url(path=page.extra.static_thumbnail, trailing_slash=false) }}" />
+  <meta property="og:image" content="{{ get_url(path=page.extra.static_thumbnail, trailing_slash=false) }}" />
+  {%- endif %}
+
+{%- elif config.extra.banner %}
+  <meta name="twitter:card" content="summary_large_image" />
+  <meta name="twitter:image" content="{{ get_url(path=config.extra.banner, trailing_slash=false) }}" />
+  <meta property="og:image" content="{{ get_url(path=config.extra.banner, trailing_slash=false) }}" />
+
+{%- else %}
+  <meta name="twitter:card" content="summary" />
+
+{%- endif %}
+
+{%- if config.extra.open.audio %}
+  <meta property="og:audio" content="{{ config.extra.open.audio }}" />
+{%- endif %}
+
+{%- if config.extra.open.locale %}
+  <meta property="og:locale" content="{{ config.extra.open.locale }}" />
+{%- endif %}
+
+{%- if config.extra.open.videos %}
+  {%- for video in config.extra.open.videos %}
+  <meta property="og:video" content="{{ get_url(path=video) }}" />
+  {%- endfor %}
+{%- endif %}
+
+{#- SEO MEDIA END #}
+  <meta property="og:site_name" content="{{ config.title }}" />
+  <meta property="og:locale" content="en_US" />
+  <meta property="og:type" content="website" />
+{%- if page.updated %}
+  <meta property="og:updated_time" content="{{ page.updated | date(format='%F') }}" />
+{%- elif page.date %}
+  <meta property="og:updated_time" content="{{ page.date | date(format='%F') }}" />
+{%- else %}
+  <meta property="og:updated_time" content="{{ updated_time }}" />
+{%- endif %}
+
+{%- if config.extra.twitter_meta %}
+  <meta name="twitter:site" content="@{{ config.extra.twitter_meta }}" />
+  <meta name="twitter:creator" content="@{{ config.extra.twitter_meta }}" />
+{%- endif %}
+
+
+
+{%- endif %}
+{%- endif %}
+{#- Extra SEO END #}
+{%- endmacro %}
diff --git a/templates/macros/social.html b/templates/macros/social.html
deleted file mode 100644
index 8661976..0000000
--- a/templates/macros/social.html
+++ /dev/null
@@ -1,58 +0,0 @@
-{%- macro social_links(config) %}
-      <nav><div>
-          {%- if config.generate_feed and config.extra.feed -%}
-          <a type="{% if config.feed_filename is containing('atom') %}application/atom+xml{% else %}application/rss+xml{% endif %}" href="{{ get_url(path=config.feed_filename, trailing_slash=false, lang=lang) | safe }}" target="_blank" title="{{ config.title }} Atom/RSS Feed"><i type="Button" class="svg rss" title="{{ config.title }} Atom/RSS Feed"></i></a>{% endif -%}
-          {%- if config.extra.mail -%}
-          {%- if config.extra.mail_encode | default(value=true) -%}
-          {%- set base64_email = config.extra.mail -%}
-          <a class="js m-protected" href="#{{ base64_email | base64_encode }}" target="_blank" title="Mail"><i type="Button" class="svg mail" title="Mail"></i></a>
-          {%- else -%}
-          <a href="mailto:{{ config.extra.mail }}" target="_blank" title="Mail"><i type="Button" class="svg mail" title="Mail"></i></a>
-          {%- endif -%}
-          {% endif -%}
-          {%- if config.extra.mastodon -%}
-          <a href="{{ config.extra.mastodon | safe }}" target="_blank" title="Mastodon" rel="me"><i type="Button" class="svg mastodon" title="Mastodon"></i></a>{% endif -%}
-          {%- if config.extra.element -%}
-          <a href="https://{{ config.extra.element }}/" target="_blank" title="Element"><i type="Button" class="svg element" title="Element"></i></a>{% endif -%}
-          {%- if config.extra.matrix -%}
-          <a href="https://{{ config.extra.matrix }}/" target="_blank" title="Matrix"><i type="Button" class="svg matrix" title="Matrix"></i></a>{% endif -%}
-          {%- if config.extra.twitter -%}
-          <a href="https://twitter.com/{{ config.extra.twitter }}/" target="_blank" title="Twitter"><i type="Button" class="svg twitter" title="Twitter"></i></a>{% endif -%}
-          {%- if config.extra.facebook -%}
-          <a href="https://www.facebook.com/{{ config.extra.facebook }}/" target="_blank" title="Facebook"><i type="Button" class="svg facebook" title="Facebook"></i></a>{% endif -%}
-          {%- if config.extra.linkedin -%}
-          <a href="https://www.linkedin.com/in/{{ config.extra.linkedin }}/" target="_blank" title="LinkedIn"><i type="Button" class="svg linkedin" title="LinkedIn"></i></a>{% endif -%}
-          {%- if config.extra.researchgate -%}
-          <a href="https://www.researchgate.net/profile/{{ config.extra.researchgate }}/" target="_blank" title="ResearchGate"><i type="Button" class="svg researchgate" title="ResearchGate"></i></a>{% endif -%}
-          {%- if config.extra.codeberg -%}
-          <a href="https://codeberg.org/{{ config.extra.codeberg }}/" target="_blank" title="Codeberg"><i type="Button" class="svg codeberg" title="Codeberg"></i></a>{% endif -%}
-          {%- if config.extra.gitlab -%}
-          <a href="https://gitlab.com/{{ config.extra.gitlab }}/" target="_blank" title="Gitlab"><i type="Button" class="svg gitlab" title="Gitlab"></i></a>{% endif -%}
-          {%- if config.extra.github -%}
-          <a href="https://github.com/{{ config.extra.github }}/" target="_blank" title="Github"><i type="Button" class="svg github" title="Github"></i></a>{% endif -%}
-          {%- if config.extra.bitbucket -%}
-          <a href="https://bitbucket.org/{{ config.extra.bitbucket }}/" target="_blank" title="Bitbucket"><i type="Button" class="svg bitbucket" title="Bitbucket"></i></a>{% endif -%}
-          {%- if config.extra.python -%}
-          <a href="https://pypi.org/user/{{ config.extra.python }}/" target="_blank" title="Python"><i type="Button" class="svg python" title="Python"></i></a>{% endif -%}
-          {%- if config.extra.docker -%}
-          <a href="https://hub.docker.com/u/{{ config.extra.docker }}/" target="_blank" title="Docker"><i type="Button" class="svg docker" title="Docker"></i></a>{% endif -%}
-          {%- if config.extra.stack -%}
-          <a href="https://stackoverflow.com/users/{{ config.extra.stack }}/" target="_blank" title="Stack"><i type="Button" class="svg stack" title="Stack"></i></a>{% endif -%}
-          {%- if config.extra.instagram -%}
-          <a href="https://www.instagram.com/{{ config.extra.instagram }}/" target="_blank" title="Instagram"><i type="Button" class="svg instagram" title="Instagram"></i></a>{% endif -%}
-          {%- if config.extra.pinterest -%}
-          <a href="https://www.pinterest.com/{{ config.extra.pinterest }}/" target="_blank" title="Pinterest"><i type="Button" class="svg pinterest" title="Pinterest"></i></a>{% endif -%}
-          {%- if config.extra.twitch -%}
-          <a href="https://www.twitch.tv/{{ config.extra.twitch }}/" target="_blank" title="Twitch"><i type="Button" class="svg twitch" title="Twitch"></i></a>{% endif -%}
-          {%- if config.extra.discord -%}
-          <a href="https://discord.com/{{ config.extra.discord }}/" target="_blank" title="Discord"><i type="Button" class="svg discord" title="Discord"></i></a>{% endif -%}
-          {%- if config.extra.youtube -%}
-          <a href="https://www.youtube.com/{{ config.extra.youtube }}" target="_blank" title="YouTube"><i type="Button" class="svg youtube" title="YouTube"></i></a>{% endif -%}
-          {%- if config.extra.kofi -%}
-          <a href="https://www.ko-fi.com/{{ config.extra.kofi }}/" target="_blank" title="Support me on Ko-fi"><i type="Button" class="svg kofi" title="Support me on Ko-fi"></i></a>{% endif -%}
-          {%- if config.extra.buymeacoffee -%}
-          <a href="https://www.buymeacoffee.com/{{ config.extra.buymeacoffee }}/" target="_blank" title="Buy Me A Coffee"><i type="Button" class="svg buymeacoffee" title="Buy Me A Coffee"></i></a>{% endif -%}
-          {%- if config.extra.github_sponsor -%}
-          <a href="https://github.com/sponsors/{{ config.extra.github_sponsor }}/" target="_blank" title="GitHub Sponsor"><i type="Button" class="svg github-sponsor" title="GitHub Sponsor"></i></a>{% endif -%}
-      </div></nav>
-{%- endmacro %}
diff --git a/templates/page.html b/templates/page.html
index 253b0d9..198e190 100644
--- a/templates/page.html
+++ b/templates/page.html
@@ -1,4 +1,4 @@
-{# This Page Shows the Individual Blog Posts#}
+{# This Template Shows the Individual Blog Posts#}
 
 {% extends "base.html" %}
 
@@ -27,7 +27,7 @@
     {%- set page_section = "" %}
   {%- endif %}
 
-  {{- macros_head::seo(config=config, title=title, title_addition=title_addition, description=description, type="article", is_page=true, created_time=created_time, updated_time=updated_time, page_section=page_section) }}
+  {{- macros_seo::seo(config=config, title=title, title_addition=title_addition, description=description, type="article", is_page=true, created_time=created_time, updated_time=updated_time, page_section=page_section) }}
 {%- endblock seo %}
 
 {%- block comments_init %}
@@ -45,33 +45,35 @@
     {{- macros::meta_post(page=page, config=config) }}
     {%- endif %}{%- endif %}
 
-
+    {# In Page Series Navigation #}
+    {%- if config.extra.series | default(value=true) %}
     {%- if page.extra.section %}
-    
+
       {%- set tag = get_taxonomy_term(kind="tags", term=page.extra.section, lang=lang) %}
       {%- set page_num = tag.page_count | as_str %}
 
         {%- if lang != config.default_language %}
           {%- set parts_string = trans(key="Series_parts", lang=lang) | replace(from="$NUMBER_OF_PARTS", to=page_num) %}
         {% else %}
-          {%- set parts_string = page_num ~ " part Series" %}
+          {%- set parts_string = config.extra.Series_parts | default(value="Series") | replace(from="$NUMBER_OF_PARTS", to=page_num) %}
         {% endif -%}
 
-
-
-    <div class="series-mobile series">
-      <a class="si" href="{{ tag.permalink | safe }}{%- if uglyurls %}index.html{%- endif %}">{{ tag.name }} ({{ parts_string }})</a>
-      <ol>
-      {%- for inner in tag.pages | sort(attribute="year") %}
-      {%- if inner.content == page.content %}
-      <li><a href="{{ inner.permalink | safe }}{%- if uglyurls %}index.html{%- endif %}"><b>{{ inner.title }}</b></a></li>
-      {% else %}
-      <li><a href="{{ inner.permalink | safe }}{%- if uglyurls %}index.html{%- endif %}">{{ inner.title }}</a></li>
-      {%- endif %}
-      {%- endfor %}
-      </ol>
+    <div class="block">
+      <div class="blockdiv">
+        <a class="b s150" href="{{ tag.permalink | safe }}{%- if uglyurls %}index.html{%- endif %}">{{ tag.name }} ({{ parts_string }})</a>
+        <ol>
+        {%- for inner in tag.pages | sort(attribute="year") %}
+        {%- if inner.content == page.content %}
+        <li><a href="{{ inner.permalink | safe }}{%- if uglyurls %}index.html{%- endif %}"><b>{{ inner.title }}</b></a></li>
+        {% else %}
+        <li><a href="{{ inner.permalink | safe }}{%- if uglyurls %}index.html{%- endif %}">{{ inner.title }}</a></li>
+        {%- endif %}
+        {%- endfor %}
+        </ol>
+      </div>
     </div>
     {%- endif %}
+    {%- endif %}
 
 
 {{ page.content | safe }}
@@ -92,15 +94,16 @@
     {%- endblock comments_body %}
     </article>
     {%- block toc %}
-    {%- if page.extra.toc and config.extra.recent %}
+    {%- if config.extra.toc | default(value=true) %}
+    {%- if page.extra.toc %}
     {%- set toc = page.toc %}
     {%- endif %}
     {%- if toc %}
-    
-    <div class="toc">
+
+    <div class="sblock">
       {%- if page.extra.section %}
-      <div class="series-toc series">
-        <a class="si" href="{{ tag.permalink | safe }}{%- if uglyurls %}index.html{%- endif %}">{{ parts_string }}</a>
+      <div class="blockdiv">
+        <a class="b s150" href="{{ tag.permalink | safe }}{%- if uglyurls %}index.html{%- endif %}">{{ parts_string }}</a>
         <ol>
         {%- for inner in tag.pages | sort(attribute="year") %}
         {%- if inner.content == page.content %}
@@ -113,16 +116,16 @@
       </div>
       {%- endif %}
 
-      <div class="toc-sticky">
-        <a class="si" href="#">{%- if lang != config.default_language %}{{ trans(key="Index" | safe, lang=lang) }}{% else %}Index{% endif %}</a>
+      <div class="blockdiv sticky">
+        <a class="b s150" href="#">{%- if lang != config.default_language %}{{ trans(key="Index" | safe, lang=lang) }}{% else %}Index{% endif %}</a>
         {%- for h in toc %}
-        <div class="toc-item">
-          <a class="subtext" href="#{{h.id | safe}}">{{ h.title }}</a>
+        <div>
+          <a href="#{{h.id | safe}}">{{ h.title }}</a>
         </div>
         {%- if h.children %}
         {%- for h2 in h.children %}
-        <div class="toc-item-child">
-          <a class="subtext" href="#{{h2.id | safe}}"><small>- {{ h2.title }}</small></a>
+        <div class="hpad">
+          <a href="#{{h2.id | safe}}"><small>- {{ h2.title }}</small></a>
         </div>
         {%- endfor %}
         {%- endif %}
@@ -130,6 +133,7 @@
       </div>
     </div>
     {%- endif %}
+    {%- endif %}
     {%- endblock toc %}
 
 {%- endblock content %}
diff --git a/templates/pages.html b/templates/pages.html
index 4ef44f5..72f4071 100644
--- a/templates/pages.html
+++ b/templates/pages.html
@@ -1,4 +1,8 @@
-{# This Page Shows the 'Pages' (abridge/content/pages) eg: example.com/about/  example.com/privacy/ #}
+{#
+This Template is for the 'Pages' (abridge/content/pages) eg: example.com/about/  example.com/privacy/
+This Template can also be used as a home page for the index, eg: example.com/
+Some people prefer a landing page for the index, and then use a separate paginated page for their blog.
+#}
 
 {% extends "base.html" %}
 
@@ -9,24 +13,35 @@
   {%- if page.title and config.title %}
     {%- set title = page.title %}
     {%- set title_addition = title_separator ~ config.title %}
+  {%- elif section.title and config.title %}
+    {%- set title = section.title %}
+    {%- set title_addition = title_separator ~ config.title %}
   {%- elif page.title %}
     {%- set title = page.title %}
+  {%- elif section.title %}
+    {%- set title = section.title %}
   {%- else %}
     {%- set title = config.title %}
   {%- endif %}
 
   {%- if page.description %}
     {%- set description = page.description %}
+  {%- elif section.description %}
+    {%- set description = section.description %}
   {%- else %}
     {%- set description = config.description %}
   {%- endif %}
 
-  {{- macros_head::seo(config=config, title=title, title_addition=title_addition, description=description) }}
+  {{- macros_seo::seo(config=config, title=title, title_addition=title_addition, description=description) }}
 {%- endblock seo %}
 
 {%- block content %}
     <div>
 
+{%- if page.content %}
 {{ page.content | safe }}
+{%- elif section.content %}
+{{ section.content | safe }}
+{%- endif %}
     </div>
 {%- endblock content %}
diff --git a/templates/partials/head.html b/templates/partials/head.html
new file mode 100644
index 0000000..4e6b713
--- /dev/null
+++ b/templates/partials/head.html
@@ -0,0 +1,131 @@
+
+{#- Theme Switcher Button to toggle between dark/light #}
+  {%- set integrity = config.extra.integrity | default(value=true) -%}
+  {%- if config.extra.offline %}{% set integrity = false %}{% endif %}
+
+  {%- if config.extra.js_switcher | default(value=true) %}
+  {%- set js_theme="js/theme.min.js" %}
+  {%- if config.extra.js_switcher_default %}
+    {%- if config.extra.js_switcher_default == "light" %}{% set js_theme="js/theme_light.min.js" %}{% endif %}
+  {%- endif %}
+  <script src="{{                     get_url(path=js_theme                        , trailing_slash=false) | safe }}"{%- if integrity %} integrity="sha384-{{ get_hash(path=js_theme, sha_type=384, base64=true) | safe }}"{%- endif %}></script>
+  {%- endif %}
+
+
+
+
+
+{#- Style Sheets #}
+  {%- set stylesheets=config.extra.stylesheets | default(value=[ "abridge.css" ]) -%}
+  {%- if stylesheets %}{%- for i in stylesheets %}
+  <link rel="stylesheet" href="{{     get_url(path=i                               , trailing_slash=false, cachebust=true) | safe }}" />
+  {%- endfor %}{%- endif %}
+
+
+
+
+
+{#- meta tags #}
+  <meta charset="utf-8" />
+  <meta http-equiv="x-ua-compatible" content="ie=edge" />
+  <meta name="viewport" content="width=device-width, initial-scale=1" />
+  <meta name="base" content="{{ config.base_url | safe }}" />
+  <meta name="HandheldFriendly" content="True" />
+  <meta name="mobile-web-app-capable" content="yes" />
+  <meta name="apple-mobile-web-app-capable" content="yes" />
+  <meta name="apple-mobile-web-app-status-bar-style" content="default" />
+
+
+
+
+
+{#- Security: CSP, referrer #}
+  {%- if config.extra.security_header_referrer %}
+  <meta name="referrer" content="{{ config.extra.security_header_referrer | safe }}" />
+  {%- endif %}
+  {%- if config.extra.security_header_csp %}
+  <meta http-equiv="Content-Security-Policy" content="{{ config.extra.security_header_csp | safe }}" />
+  {%- endif %}
+
+
+
+
+
+{#- Favicons #}
+  {%- if config.extra.favicon_theme_color %}
+  <meta name="theme-color" content="{{ config.extra.favicon_theme_color }}" />
+  {%- endif %}
+
+  {%- if config.extra.favicon_ms_color %}
+  <meta name="msapplication-TileColor" content="{{ config.extra.favicon_ms_color }}" />
+  {%- endif %}
+
+  {%- if config.extra.webmanifest %}
+  <link rel="manifest" href="{{ get_url(path=config.extra.webmanifest, trailing_slash=false) | safe }}" />
+  {%- endif %}
+
+  {%- if config.extra.favicon_mask and config.extra.favicon_mask_color %}
+  <link rel="mask-icon" href="{{ get_url(path=config.extra.favicon_mask, trailing_slash=false) | safe }}" color="{{ config.extra.favicon_mask_color }}" />
+  {%- endif %}
+
+  {%- if config.extra.favicon_svg %}
+  <link rel="icon" type="image/svg+xml" href="{{ get_url(path=config.extra.favicon_svg, trailing_slash=false) | safe }}" />
+  {%- endif %}
+
+  {%- if config.extra.favicon180 %}
+  <link rel="apple-touch-icon" sizes="180x180" href="{{ get_url(path=config.extra.favicon180, trailing_slash=false) | safe }}" />
+  {%- endif %}
+
+  {%- if config.extra.favicon32 %}
+  <link rel="icon" type="image/png" sizes="32x32" href="{{ get_url(path=config.extra.favicon32, trailing_slash=false) | safe }}" />
+  {%- endif %}
+
+  {%- if config.extra.favicon16 %}
+  <link rel="icon" type="image/png" sizes="16x16" href="{{ get_url(path=config.extra.favicon16, trailing_slash=false) | safe }}" />
+  {%- endif %}
+
+
+
+
+
+{#- Style Sheets Preload #}
+  {%- set integrity = config.extra.integrity | default(value=true) -%}
+  {%- if config.extra.offline %}{% set integrity = false %}{% endif %}
+
+{%- if config.extra.fonts %}{%- for i in config.extra.fonts %}
+  {%- if i.url is matching("^http[s]?://") %}
+  <link rel="preload" as="style" class="preStyle" href="{{ i.url | safe }}" crossorigin="anonymous" />
+  {%- else %}
+  <link rel="preload" as="font" href="{{ get_url(path=i.url, trailing_slash=false) | safe }}" type="font/woff2" />
+  {%- endif %}
+{%- endfor %}{%- endif %}
+
+{%- if config.extra.fontawesome %}
+  <link rel="preload" as="style" class="preStyle" href="{{ config.extra.fontawesome | safe }}" crossorigin="anonymous" />
+{%- endif %}
+
+{%- if config.extra.math or page.extra.math %}
+
+  {%- set katex_css=config.extra.katex_css | default(value="katex.min.css") -%}
+  {%- if katex_css %}{%- if katex_css is matching("^http[s]?://") %}
+  <link rel="preload" as="style" class="preStyle" href="{{ katex_css | safe }}"{%- if integrity and config.extra.katex_css_integrity %} integrity="{{ config.extra.katex_css_integrity | safe }}"{%- endif %} crossorigin="anonymous" />
+  {%- else %}
+  <link rel="preload" as="style" class="preStyle" href="{{ get_url(path=katex_css, trailing_slash=false) }}"{%- if integrity %} integrity="sha384-{{ get_hash(path=katex_css, sha_type=384, base64=true) | safe }}"{%- endif %} />
+  {%- endif %}{%- endif %}
+
+{%- endif %}
+
+
+
+
+
+{#- Rss / Atom Feed #}
+  {%- if config.generate_feed %}
+  <link rel="alternate" type="{% if config.feed_filename is containing('atom') %}application/atom+xml{% else %}application/rss+xml{% endif %}" title="{{ config.title }} Atom/RSS Feed" href="{{ get_url(path=config.feed_filename, trailing_slash=false, lang=lang) | safe }}" />
+  {%- endif %}
+
+
+
+
+
+{#- End of head partial -#}
diff --git a/templates/partials/head_js.html b/templates/partials/head_js.html
new file mode 100644
index 0000000..9a5604a
--- /dev/null
+++ b/templates/partials/head_js.html
@@ -0,0 +1,165 @@
+{#- JAVASCRIPT #}
+  {%- set integrity = config.extra.integrity | default(value=true) -%}
+  {%- if config.extra.offline %}{% set integrity = false %}{% endif %}
+  {%- set search_library=config.extra.search_library | default(value="elasticlunr") -%}
+
+  {%- set preStyle = false %}
+
+  {%- if config.extra.fonts %}{%- for i in config.extra.fonts %}
+    {%- if i.url is matching("^http[s]?://") %}
+      {%- set preStyle = true %}
+    {%- endif %}
+  {%- endfor %}{%- endif %}
+
+  {%- if config.extra.fontawesome %}
+    {%- set preStyle = true %}
+  {%- endif %}
+
+  {%- if config.extra.math or page.extra.math %}
+    {%- set katex_css=config.extra.katex_css | default(value="katex.min.css") -%}
+    {%- if katex_css %}
+      {%- set preStyle = true %}
+    {%- endif %}
+  {%- endif %}
+
+
+{%- if config.extra.js_bundle %}
+  {%- if config.build_search_index %}
+  {%- if config.extra.pwa | default(value=false) %}
+  <script defer src="{{               get_url(path='js/abridge.min.js'             , trailing_slash=false, cachebust=true) | safe }}"{%- if integrity %} integrity="sha384-{{ get_hash(path='js/abridge.min.js', sha_type=384, base64=true) | safe }}"{%- endif %}></script>
+  {%- else %}
+  <script defer src="{{               get_url(path='js/abridge_nopwa.min.js'             , trailing_slash=false, cachebust=true) | safe }}"{%- if integrity %} integrity="sha384-{{ get_hash(path='js/abridge_nopwa.min.js', sha_type=384, base64=true) | safe }}"{%- endif %}></script>
+  {%- endif %}
+
+  {%- else %}
+  {%- if config.extra.pwa | default(value=false) %}
+  <script defer src="{{               get_url(path='js/abridge_nosearch.min.js'    , trailing_slash=false, cachebust=true) | safe }}"{%- if integrity %} integrity="sha384-{{ get_hash(path='js/abridge_nosearch.min.js', sha_type=384, base64=true) | safe }}"{%- endif %}></script>
+  {%- else %}
+  <script defer src="{{               get_url(path='js/abridge_nosearch_nopwa.min.js'    , trailing_slash=false, cachebust=true) | safe }}"{%- if integrity %} integrity="sha384-{{ get_hash(path='js/abridge_nosearch_nopwa.min.js', sha_type=384, base64=true) | safe }}"{%- endif %}></script>
+  {%- endif %}
+  {%- endif %}
+
+  {%- if config.build_search_index %}
+  {%- if search_library == "elasticlunr" %}
+  {%- if lang != "en" %}
+  <script defer src="{{               get_url(path='js/lunr.stemmer.support.min.js', trailing_slash=false) | safe }}"{%- if integrity %} integrity="sha384-{{ get_hash(path='js/lunr.stemmer.support.min.js', sha_type=384, base64=true) | safe }}"{%- endif %}></script>
+  <script defer src="{{               get_url(path='js/lunr.' ~ lang ~ '.min.js'   , trailing_slash=false) | safe }}"{%- if integrity %} integrity="sha384-{{ get_hash(path='js/lunr.' ~ lang ~ '.min.js', sha_type=384, base64=true) | safe }}"{%- endif %}></script>
+  {%- endif %}
+  {%- endif %}
+  {%- endif %}
+
+{%- else %}{#- Not js_bundle #}
+
+  {%- if preStyle == true %}
+  {%- if config.extra.js_prestyle | default(value=true) %}
+  <script defer src="{{               get_url(path='js/prestyle.js'                , trailing_slash=false, cachebust=true) | safe }}"{%- if integrity %} integrity="sha384-{{ get_hash(path='js/prestyle.js', sha_type=384, base64=true) | safe }}"{%- endif %}></script>
+  {%- endif %}
+  {%- endif %}
+
+  {%- if config.extra.js_switcher | default(value=true) %}
+  <script defer src="{{               get_url(path='js/theme_button.js'            , trailing_slash=false, cachebust=true) | safe }}"{%- if integrity %} integrity="sha384-{{ get_hash(path='js/theme_button.js', sha_type=384, base64=true) | safe }}"{%- endif %}></script>
+  {%- endif %}
+
+  {%- if config.extra.js_email_encode | default(value=true) %}
+  <script defer src="{{               get_url(path='js/email.js'                   , trailing_slash=false, cachebust=true) | safe }}"{%- if integrity %} integrity="sha384-{{ get_hash(path='js/email.js', sha_type=384, base64=true) | safe }}"{%- endif %}></script>
+  {%- endif %}
+
+  {%- if config.extra.js_copycode | default(value=true) %}
+  <script defer src="{{               get_url(path='js/codecopy.js'                , trailing_slash=false, cachebust=true) | safe }}"{%- if integrity %} integrity="sha384-{{ get_hash(path='js/codecopy.js', sha_type=384, base64=true) | safe }}"{%- endif %}></script>
+  {%- endif %}
+
+  {%- if config.extra.pwa | default(value=false) %}
+  <script defer src="{{               get_url(path='js/sw_load.js'             , trailing_slash=false, cachebust=true) | safe }}"{%- if integrity %} integrity="sha384-{{ get_hash(path='js/sw_load.js', sha_type=384, base64=true) | safe }}"{%- endif %}></script>
+  {%- endif %}
+
+  {%-   if search_library == "tinysearch" %}
+  <script defer type="module" src="{{ get_url(path='js/tinysearch.js'   , trailing_slash=false, cachebust=true) | safe }}"{%- if integrity %} integrity="sha384-{{ get_hash(path='js/tinysearch.js'   , sha_type=384, base64=true) | safe }}"{%- endif %}></script>
+  {%- elif search_library == "stork"      %}
+  <script defer type="module" src="{{ get_url(path='js/search_stork.min.js'        , trailing_slash=false, cachebust=true) | safe }}"{%- if integrity %} integrity="sha384-{{ get_hash(path='js/search_stork.min.js'        , sha_type=384, base64=true) | safe }}"{%- endif %}></script>
+  {%- elif config.build_search_index %}
+
+  {%- set search_index_format="elasticlunr_json" -%}
+  {%- if config.search.index_format %}
+    {%- if config.search.index_format == "elasticlunr_javascript" %}
+      {%- set search_index_format="elasticlunr_javascript" -%}
+    {%- endif %}
+  {%- endif %}
+
+  {%- set uglyurls = config.extra.uglyurls | default(value=false) -%}
+  {%- if config.extra.offline %}{% set uglyurls = true %}{% endif %}
+  {%- if search_index_format == "elasticlunr_javascript" %}{#- Javascript index format #}
+  <script defer src="{{               get_url(path='js/elasticlunr.min.js'         , trailing_slash=false, cachebust=true) | safe }}"{%- if integrity %} integrity="sha384-{{ get_hash(path='js/elasticlunr.min.js'         , sha_type=384, base64=true) | safe }}"{%- endif %}></script>
+  <script defer src="{{               get_url(path='search_index.' ~ lang ~ '.js'  , trailing_slash=false, cachebust=true) | safe }}"{%- if integrity %} integrity="sha384-{{ get_hash(path='search_index.' ~ lang ~ '.js'  , sha_type=384, base64=true) | safe }}"{%- endif %}></script>
+
+  {%- if uglyurls %}
+  <script defer src="{{               get_url(path='js/searchjavaugly.js'          , trailing_slash=false, cachebust=true) | safe }}"{%- if integrity %} integrity="sha384-{{ get_hash(path='js/searchjavaugly.js'          , sha_type=384, base64=true) | safe }}"{%- endif %}></script>
+  {%- else %}
+  <script defer src="{{               get_url(path='js/searchjava.js'              , trailing_slash=false, cachebust=true) | safe }}"{%- if integrity %} integrity="sha384-{{ get_hash(path='js/searchjava.js'              , sha_type=384, base64=true) | safe }}"{%- endif %}></script>
+  {%- endif %}
+
+  {%- else %}
+  <script defer src="{{               get_url(path='js/search_elasticlunr.min.js'  , trailing_slash=false, cachebust=true) | safe }}"{%- if integrity %} integrity="sha384-{{ get_hash(path='js/search_elasticlunr.min.js'  , sha_type=384, base64=true) | safe }}"{%- endif %}></script>
+  {%- endif %}
+
+  {%- if lang != "en" %}
+  <script defer src="{{               get_url(path='js/lunr.stemmer.support.min.js', trailing_slash=false) | safe }}"{%- if integrity %} integrity="sha384-{{ get_hash(path='js/lunr.stemmer.support.min.js', sha_type=384, base64=true) | safe }}"{%- endif %}></script>
+  <script defer src="{{               get_url(path='js/lunr.' ~ lang ~ '.min.js'   , trailing_slash=false) | safe }}"{%- if integrity %} integrity="sha384-{{ get_hash(path='js/lunr.' ~ lang ~ '.min.js'   , sha_type=384, base64=true) | safe }}"{%- endif %}></script>
+  {%- endif %}
+
+  {%- endif %}
+
+{%- endif %}
+
+
+
+
+
+{#- Katex #}
+{#- https://katex.org/docs/autorender.html #}
+{#- https://github.com/KaTeX/KaTeX/ #}
+{#- https://github.com/KaTeX/KaTeX/tree/main/contrib/mathtex-script-type/ #}
+{%- if config.extra.math or page.extra.math %}
+
+{%- set katex_bundle=config.extra.katex_bundle | default(value="js/katexbundle.min.js") -%}
+{%- if katex_bundle %}
+  <script defer src="{{               get_url(path=katex_bundle                    , trailing_slash=false, cachebust=true) }}"{%- if integrity %} integrity="sha384-{{ get_hash(path=katex_bundle, sha_type=384, base64=true) | safe }}"{%- endif %}></script>
+{%- else %}
+
+  {%- set katex_js=config.extra.katex_js | default(value="js/katex.min.js") -%}
+  {%- if katex_js %}{%- if katex_js is matching("^http[s]?://") %}
+  <script defer src="{{               katex_js | safe }}"{%- if integrity and config.extra.katex_js_integrity %} integrity="{{ config.extra.katex_js_integrity | safe }}"{%- endif %} crossorigin="anonymous"></script>
+  {%- else %}
+  <script defer src="{{               get_url(path=katex_js                        , trailing_slash=false, cachebust=true) }}"{%- if integrity %} integrity="sha384-{{ get_hash(path=katex_js, sha_type=384, base64=true) | safe }}"{%- endif %}></script>
+  {%- endif %}{%- endif %}
+
+  {%- set mathtex_js=config.extra.mathtex_js | default(value="js/mathtex-script-type.min.js") -%}
+  {%- if mathtex_js %}{%- if mathtex_js is matching("^http[s]?://") %}
+  <script defer src="{{ mathtex_js | safe }}"{%- if integrity and config.extra.mathtex_js_integrity %} integrity="{{ config.extra.mathtex_js_integrity | safe }}"{%- endif %} crossorigin="anonymous"></script>
+  {%- else %}
+  <script defer src="{{               get_url(path=mathtex_js                      , trailing_slash=false, cachebust=true) }}"{%- if integrity %} integrity="sha384-{{ get_hash(path=mathtex_js, sha_type=384, base64=true) | safe }}"{%- endif %}></script>
+  {%- endif %}{%- endif %}
+
+ {%- if config.extra.math_auto_render or page.extra.math_auto_render %}
+  {%- set katex_autorender_js=config.extra.katex_autorender_js | default(value="js/katex-auto-render.min.js") -%}
+  {%- if katex_autorender_js %}
+  {%- if katex_autorender_js is matching("^http[s]?://") %}
+  <script defer src="{{               katex_autorender_js | safe }}"{%- if integrity and config.extra.katex_autorender_js_integrity %} integrity="{{ config.extra.katex_autorender_js_integrity | safe }}"{%- endif %} crossorigin="anonymous"></script>
+  {%- else %}
+  <script defer src="{{               get_url(path=katex_autorender_js             , trailing_slash=false, cachebust=true) }}"{%- if integrity %} integrity="sha384-{{ get_hash(path=katex_autorender_js, sha_type=384, base64=true) | safe }}"{%- endif %}></script>
+  {%- endif %}
+  {%- endif %}
+  {%- set katex_options=config.extra.katex_options | default(value="js/katexoptions.js") -%}
+  {%- if katex_options %}
+  <script defer src="{{               get_url(path=katex_options                   , trailing_slash=false, cachebust=true) }}"{%- if integrity %} integrity="sha384-{{ get_hash(path=katex_options, sha_type=384, base64=true) | safe }}"{%- endif %}></script>
+  {%- endif %}
+ {%- endif %}
+{%- endif %}
+
+{%- endif %}
+  <noscript><link rel="stylesheet" href="{{ get_url(path='nojs.css', trailing_slash=false) | safe }}" /></noscript>
+
+
+
+
+
+{#- End of head_js partial -#}
diff --git a/templates/partials/social.html b/templates/partials/social.html
new file mode 100644
index 0000000..aaca83d
--- /dev/null
+++ b/templates/partials/social.html
@@ -0,0 +1,63 @@
+{#- Social Footer Icons #}
+      <nav><div>
+          {%- if config.generate_feed and config.extra.feed -%}
+          <a type="{% if config.feed_filename is containing('atom') %}application/atom+xml{% else %}application/rss+xml{% endif %}" href="{{ get_url(path=config.feed_filename, trailing_slash=false, lang=lang) | safe }}" target="_blank" title="{{ config.title }} Atom/RSS Feed"><i type="Button" class="svg rss" title="{{ config.title }} Atom/RSS Feed"></i></a>{% endif -%}
+          {%- if config.extra.mail -%}
+          {%- if config.extra.mail_encode | default(value=true) -%}
+          {%- set base64_email = config.extra.mail -%}
+          <a class="js m-protected" href="#{{ base64_email | base64_encode }}" target="_blank" title="Mail"><i type="Button" class="svg mail" title="Mail"></i></a>
+          {%- else -%}
+          <a href="mailto:{{ config.extra.mail }}" target="_blank" title="Mail"><i type="Button" class="svg mail" title="Mail"></i></a>
+          {%- endif -%}
+          {% endif -%}
+          {%- if config.extra.mastodon -%}
+          <a href="{{ config.extra.mastodon | safe }}" target="_blank" title="Mastodon" rel="me"><i type="Button" class="svg mastodon" title="Mastodon"></i></a>{% endif -%}
+          {%- if config.extra.element -%}
+          <a href="https://{{ config.extra.element }}/" target="_blank" title="Element"><i type="Button" class="svg element" title="Element"></i></a>{% endif -%}
+          {%- if config.extra.matrix -%}
+          <a href="https://{{ config.extra.matrix }}/" target="_blank" title="Matrix"><i type="Button" class="svg matrix" title="Matrix"></i></a>{% endif -%}
+          {%- if config.extra.twitter -%}
+          <a href="https://twitter.com/{{ config.extra.twitter }}/" target="_blank" title="Twitter"><i type="Button" class="svg twitter" title="Twitter"></i></a>{% endif -%}
+          {%- if config.extra.facebook -%}
+          <a href="https://www.facebook.com/{{ config.extra.facebook }}/" target="_blank" title="Facebook"><i type="Button" class="svg facebook" title="Facebook"></i></a>{% endif -%}
+          {%- if config.extra.linkedin -%}
+          <a href="https://www.linkedin.com/in/{{ config.extra.linkedin }}/" target="_blank" title="LinkedIn"><i type="Button" class="svg linkedin" title="LinkedIn"></i></a>{% endif -%}
+          {%- if config.extra.researchgate -%}
+          <a href="https://www.researchgate.net/profile/{{ config.extra.researchgate }}/" target="_blank" title="ResearchGate"><i type="Button" class="svg researchgate" title="ResearchGate"></i></a>{% endif -%}
+          {%- if config.extra.codeberg -%}
+          <a href="https://codeberg.org/{{ config.extra.codeberg }}/" target="_blank" title="Codeberg"><i type="Button" class="svg codeberg" title="Codeberg"></i></a>{% endif -%}
+          {%- if config.extra.gitlab -%}
+          <a href="https://gitlab.com/{{ config.extra.gitlab }}/" target="_blank" title="Gitlab"><i type="Button" class="svg gitlab" title="Gitlab"></i></a>{% endif -%}
+          {%- if config.extra.github -%}
+          <a href="https://github.com/{{ config.extra.github }}/" target="_blank" title="Github"><i type="Button" class="svg github" title="Github"></i></a>{% endif -%}
+          {%- if config.extra.bitbucket -%}
+          <a href="https://bitbucket.org/{{ config.extra.bitbucket }}/" target="_blank" title="Bitbucket"><i type="Button" class="svg bitbucket" title="Bitbucket"></i></a>{% endif -%}
+          {%- if config.extra.python -%}
+          <a href="https://pypi.org/user/{{ config.extra.python }}/" target="_blank" title="Python"><i type="Button" class="svg python" title="Python"></i></a>{% endif -%}
+          {%- if config.extra.docker -%}
+          <a href="https://hub.docker.com/u/{{ config.extra.docker }}/" target="_blank" title="Docker"><i type="Button" class="svg docker" title="Docker"></i></a>{% endif -%}
+          {%- if config.extra.stack -%}
+          <a href="https://stackoverflow.com/users/{{ config.extra.stack }}/" target="_blank" title="Stack"><i type="Button" class="svg stack" title="Stack"></i></a>{% endif -%}
+          {%- if config.extra.instagram -%}
+          <a href="https://www.instagram.com/{{ config.extra.instagram }}/" target="_blank" title="Instagram"><i type="Button" class="svg instagram" title="Instagram"></i></a>{% endif -%}
+          {%- if config.extra.pinterest -%}
+          <a href="https://www.pinterest.com/{{ config.extra.pinterest }}/" target="_blank" title="Pinterest"><i type="Button" class="svg pinterest" title="Pinterest"></i></a>{% endif -%}
+          {%- if config.extra.twitch -%}
+          <a href="https://www.twitch.tv/{{ config.extra.twitch }}/" target="_blank" title="Twitch"><i type="Button" class="svg twitch" title="Twitch"></i></a>{% endif -%}
+          {%- if config.extra.discord -%}
+          <a href="https://discord.com/{{ config.extra.discord }}/" target="_blank" title="Discord"><i type="Button" class="svg discord" title="Discord"></i></a>{% endif -%}
+          {%- if config.extra.youtube -%}
+          <a href="https://www.youtube.com/{{ config.extra.youtube }}" target="_blank" title="YouTube"><i type="Button" class="svg youtube" title="YouTube"></i></a>{% endif -%}
+          {%- if config.extra.kofi -%}
+          <a href="https://www.ko-fi.com/{{ config.extra.kofi }}/" target="_blank" title="Support me on Ko-fi"><i type="Button" class="svg kofi" title="Support me on Ko-fi"></i></a>{% endif -%}
+          {%- if config.extra.buymeacoffee -%}
+          <a href="https://www.buymeacoffee.com/{{ config.extra.buymeacoffee }}/" target="_blank" title="Buy Me A Coffee"><i type="Button" class="svg buymeacoffee" title="Buy Me A Coffee"></i></a>{% endif -%}
+          {%- if config.extra.github_sponsor -%}
+          <a href="https://github.com/sponsors/{{ config.extra.github_sponsor }}/" target="_blank" title="GitHub Sponsor"><i type="Button" class="svg github-sponsor" title="GitHub Sponsor"></i></a>{% endif -%}
+      </div></nav>
+
+
+
+
+
+{#- End of social partial -#}
diff --git a/templates/shortcodes/img.html b/templates/shortcodes/img.html
index f5754ce..ac3ba6b 100644
--- a/templates/shortcodes/img.html
+++ b/templates/shortcodes/img.html
@@ -1,15 +1,16 @@
 {%- set img = src | split(pat="/") | last %}
 {%- set dirtest = src | trim_start_matches(pat="./") %}
 {%- if dirtest is containing("/") %} {%- set reldir = true %} {%- endif %}
+{%- if page.path %}{%- set pagepath = page.path %}{%- elif section.path %}{%- set pagepath = section.path %}{%- endif %}
 
 {%- if src is starting_with("./") and reldir %} {# Relative Path #}
   {%- set path = src | trim_start_matches(pat="./") | split(pat="/") | slice(end=-1) | join(sep="/") | trim_start_matches(pat="/") %}
   {%- set path = path ~ "/" %}
   {%- if not w or not h %}
     {%- if lang != config.default_language %}
-      {%- set metapath = page.path ~ path ~ img | replace(from=page.path | truncate(length=4, end=""), to="/") %}
+      {%- set metapath = pagepath ~ path ~ img | replace(from=pagepath | truncate(length=4, end=""), to="/") %}
     {%- else %}
-      {%- set metapath = page.path ~ path ~ img %}
+      {%- set metapath = pagepath ~ path ~ img %}
     {%- endif %}
     {%- set meta = get_image_metadata(path=metapath) %}
     {%- set w = meta.width %}
@@ -30,9 +31,9 @@
   {%- set path = "" %}
   {%- if not w or not h %}
     {%- if lang != config.default_language %}
-      {%- set metapath = page.path ~ img | replace(from=page.path | truncate(length=4, end=""), to="/") %}
+      {%- set metapath = pagepath ~ img | replace(from=pagepath | truncate(length=4, end=""), to="/") %}
     {%- else %}
-      {%- set metapath = page.path ~ img %}
+      {%- set metapath = pagepath ~ img %}
     {%- endif %}
     {%- set meta = get_image_metadata(path=metapath) %}
     {%- set w = meta.width %}
diff --git a/templates/shortcodes/imgswap.html b/templates/shortcodes/imgswap.html
index efcf6e7..80a3b74 100644
--- a/templates/shortcodes/imgswap.html
+++ b/templates/shortcodes/imgswap.html
@@ -2,15 +2,16 @@
   {%- set img = main_src | split(pat="/") | last %}
   {%- set dirtest = main_src | trim_start_matches(pat="./") %}
   {%- if dirtest is containing("/") %} {%- set reldir = true %} {%- endif %}
+  {%- if page.path %}{%- set pagepath = page.path %}{%- elif section.path %}{%- set pagepath = section.path %}{%- endif %}
 
   {%- if main_src is starting_with("./") and reldir %} {# Relative Path #}
     {%- set path = main_src | trim_start_matches(pat="./") | split(pat="/") | slice(end=-1) | join(sep="/") | trim_start_matches(pat="/") %}
     {%- set path = path ~ "/" %}
     {%- if not w or not h %}
       {%- if lang != config.default_language %}
-        {%- set metapath = page.path ~ path ~ img | replace(from=page.path | truncate(length=4, end=""), to="/") %}
+        {%- set metapath = pagepath ~ path ~ img | replace(from=pagepath | truncate(length=4, end=""), to="/") %}
       {%- else %}
-        {%- set metapath = page.path ~ path ~ img %}
+        {%- set metapath = pagepath ~ path ~ img %}
       {%- endif %}
       {%- set meta = get_image_metadata(path=metapath) %}
       {%- set w = meta.width %}
@@ -31,9 +32,9 @@
     {%- set path = "" %}
     {%- if not w or not h %}
       {%- if lang != config.default_language %}
-        {%- set metapath = page.path ~ img | replace(from=page.path | truncate(length=4, end=""), to="/") %}
+        {%- set metapath = pagepath ~ img | replace(from=pagepath | truncate(length=4, end=""), to="/") %}
       {%- else %}
-        {%- set metapath = page.path ~ img %}
+        {%- set metapath = pagepath ~ img %}
       {%- endif %}
       {%- set meta = get_image_metadata(path=metapath) %}
       {%- set w = meta.width %}
@@ -55,9 +56,9 @@
     {%- set path = path ~ "/" %}
     {%- if not w or not h %}
       {%- if lang != config.default_language %}
-        {%- set metapath = page.path ~ path ~ img | replace(from=page.path | truncate(length=4, end=""), to="/") %}
+        {%- set metapath = pagepath ~ path ~ img | replace(from=pagepath | truncate(length=4, end=""), to="/") %}
       {%- else %}
-        {%- set metapath = page.path ~ path ~ img %}
+        {%- set metapath = pagepath ~ path ~ img %}
       {%- endif %}
       {%- set meta = get_image_metadata(path=metapath) %}
       {%- set w = meta.width %}
@@ -78,9 +79,9 @@
     {%- set path = "" %}
     {%- if not w or not h %}
       {%- if lang != config.default_language %}
-        {%- set metapath = page.path ~ img | replace(from=page.path | truncate(length=4, end=""), to="/") %}
+        {%- set metapath = pagepath ~ img | replace(from=pagepath | truncate(length=4, end=""), to="/") %}
       {%- else %}
-        {%- set metapath = page.path ~ img %}
+        {%- set metapath = pagepath ~ img %}
       {%- endif %}
       {%- set meta = get_image_metadata(path=metapath) %}
       {%- set w = meta.width %}
diff --git a/templates/shortcodes/showdata.html b/templates/shortcodes/showdata.html
index 9c14444..7f3d3bc 100644
--- a/templates/shortcodes/showdata.html
+++ b/templates/shortcodes/showdata.html
@@ -1,3 +1,5 @@
+{# showdata(src="../theme.toml" type="toml" key="min_version") #}
+
 {%- if src and key and type %}
   {%- if src is matching("^http[s]?://") %}
     {% set data = load_data(url=src, format=type) %}
@@ -5,4 +7,12 @@
     {% set data = load_data(path=src, format=type) %}
   {%- endif %}
   {{ data[key] }}
+{%- else %}
+  {# Load other file types as plain text #}
+  {%- if src is matching("^http[s]?://") %}
+    {% set data = load_data(url=src) %}
+  {%- else %}
+    {% set data = load_data(path=src) %}
+  {%- endif %}
+  {{ data }}
 {%- endif %}
diff --git a/templates/tags/list.html b/templates/tags/list.html
index 2124b02..4f53a58 100644
--- a/templates/tags/list.html
+++ b/templates/tags/list.html
@@ -14,7 +14,7 @@
 
   {%- set description = config.description %}
 
-  {{- macros_head::seo(config=config, title=title, title_addition=title_addition, description=description, is_home=true) }}
+  {{- macros_seo::seo(config=config, title=title, title_addition=title_addition, description=description, is_home=true) }}
 {%- endblock seo %}
 
 {%- block content %}
diff --git a/templates/tags/single.html b/templates/tags/single.html
index d21d9b0..a57b1f7 100644
--- a/templates/tags/single.html
+++ b/templates/tags/single.html
@@ -14,7 +14,7 @@
 
   {%- set description = config.description %}
 
-  {{- macros_head::seo(config=config, title=title, title_addition=title_addition, description=description, is_home=true) }}
+  {{- macros_seo::seo(config=config, title=title, title_addition=title_addition, description=description, is_home=true) }}
 {%- endblock seo %}
 
 {%- block content %}
-- 
cgit v1.3.1