Skip to content

Commit

Permalink
Better SEO, OpenGraph, schema.org and clean generated code (alshediva…
Browse files Browse the repository at this point in the history 
…t#481)
  • Loading branch information
@jmrplens @pecey
jmrplens authored and pecey committed Jan 27, 2023
1 parent cf83227 commit d092f65
Show file tree
Hide file tree
Showing 30 changed files with 879 additions and 521 deletions.
2 changes: 2 additions & 0 deletions Gemfile
View file
Original file line number Diff line number Diff line change
Expand Up @@ -15,4 +15,6 @@ group :jekyll_plugins do
gem 'jemoji'
gem 'unicode_utils'
gem 'webrick'
gem 'htmlcompressor'
gem 'htmlbeautifier'
end
29 changes: 25 additions & 4 deletions _config.yml
View file
Original file line number Diff line number Diff line change
Expand Up @@ -38,10 +38,11 @@ max_width: 800px
# TODO: add layout settings (single page vs. multi-page)

# -----------------------------------------------------------------------------
# Open Graph
# Open Graph & Schema.org
# -----------------------------------------------------------------------------
# Display links to the page with a preview object on social media.
serve_og_meta: false # Include Open Graph meta tags in the HTML head
serve_schema_org: false # Include Schema.org in the HTML head
og_image: # The site-wide (default for all links) Open Graph preview image

# -----------------------------------------------------------------------------
Expand Down Expand Up @@ -69,8 +70,10 @@ contact_note: # > You can even add a little note about which of these is the bes

resume_link: https://github.com/pecey/PublicResume/blob/main/Palash_Chatterjee_Public_Resume.pdf

google_analytics: UA-XXXXXXXXX # out your google-analytics code
panelbear_analytics: XXXXXXXXX # panelbear analytics site ID
google_analytics: # your google-analytics ID (format: UA-XXXXXXXXX)
google_site_verification: # your google-site-verification ID (Google Search Console)
bing_site_verification: # out your bing-site-verification ID (Bing Webmaster)
panelbear_analytics: # panelbear analytics site ID (format: XXXXXXXXX)

# -----------------------------------------------------------------------------
# Blog
Expand Down Expand Up @@ -154,10 +157,26 @@ defaults:
path: "assets/**/*.*"
values:
sitemap: false

# Extras
github: [metadata]

# -----------------------------------------------------------------------------
# Jekyll optimization
# -----------------------------------------------------------------------------

# HTML remove comments (<!-- .... -->)
remove_HTML_comments: false

# HTML beautifier (_plugins/beautify.rb) / https://github.com/threedaymonk/htmlbeautifier
beautify: false # This function has conflict with the code snippets, they can be displayed incorrectly

# HTML minify (_plugins/minify.rb) Thanks to: https://www.ffbit.com/blog/2021/03/17/html-minification-in-jekyll.html
minify: false

# CSS/SASS minify
sass:
style: compressed

# -----------------------------------------------------------------------------
# Jekyll Archives
# -----------------------------------------------------------------------------
Expand Down Expand Up @@ -238,6 +257,8 @@ jekyll-diagrams:

enable_google_analytics: false # enables google analytics
enable_panelbear_analytics: false # enables panelbear analytics
enable_google_verification: false # enables google site verification
enable_bing_verification: false # enables bing site verification
enable_mansory: true # enables automatic project cards arangement
enable_math: true # enables math typesetting (uses MathJax)
enable_tooltips: false # enables automatic tooltip links generated
Expand Down
11 changes: 5 additions & 6 deletions _includes/figure.html
View file
Original file line number Diff line number Diff line change
@@ -1,17 +1,16 @@
{% assign path = include.path | remove: ".jpg" | remove: ".jpeg" | remove: ".png" | remove: ".tiff" %}
{%- assign path = include.path | remove: ".jpg" | remove: ".jpeg" | remove: ".png" | remove: ".tiff" -%}

<figure>

<picture>
{% for i in site.imagemagick.widths %}
<source media="(max-width: {{ i }}px)" srcset="{{ path | relative_url }}-{{ i }}.webp">
{% endfor %}
{% for i in site.imagemagick.widths -%}
<source media="(max-width: {{ i }}px)" srcset="{{ path | relative_url }}-{{ i }}.webp" />
{% endfor -%}

<!-- Fallback to the original file -->
<img {% if include.class %}class="{{ include.class }}"{% endif %} src="{{ include.path | relative_url }}" {% if include.alt %}alt="{{ alt }}"{% endif %} {% if include.title %}title="{{ title }}"{% endif %} {% if include.zoomable %}data-zoomable{% endif %} />

</picture>

{% if include.caption %}<figcaption class="caption">{{ include.caption }}</figcaption>{% endif %}
{%- if include.caption -%}<figcaption class="caption">{{ include.caption }}</figcaption>{%- endif %}

</figure>
52 changes: 25 additions & 27 deletions _includes/footer.html
View file
Original file line number Diff line number Diff line change
@@ -1,27 +1,25 @@
{% if site.footer_fixed %}
<footer class="fixed-bottom">
<div class="container mt-0">
&copy; Copyright {{ site.time | date: '%Y' }} {{ site.first_name }} {{ site.middle_name }} {{ site.last_name }}.
{{ site.footer_text }}
{% if site.impressum_path %}
<a href="{{ site.url }}{{ site.baseurl }}{{ site.impressum_path }}">Impressum</a>.
{% endif %}
{% if site.last_updated %}
Last updated: {{ "now" | date: '%B %d, %Y' }}.
{% endif %}
</div>
</footer>
{% else %}
<footer class="sticky-bottom mt-5">
<div class="container">
&copy; Copyright {{ site.time | date: '%Y' }} {{ site.first_name }} {{ site.middle_name }} {{ site.last_name }}.
{{ site.footer_text }}
{% if site.impressum_path %}
<a href="{{ site.url }}{{ site.baseurl }}{{ site.impressum_path }}">Impressum</a>.
{% endif %}
{% if site.last_updated %}
Last updated: {{ "now" | date: '%B %d, %Y' }}.
{% endif %}
</div>
</footer>
{% endif %}
{% if site.footer_fixed %}
<footer class="fixed-bottom">
<div class="container mt-0">
&copy; Copyright {{ site.time | date: '%Y' }} {{ site.first_name }} {{ site.middle_name }} {{ site.last_name }}. {{ site.footer_text }}
{%- if site.impressum_path -%}
<a href="{{ site.url }}{{ site.baseurl }}{{ site.impressum_path }}">Impressum</a>.
{%- endif -%}
{%- if site.last_updated -%}
Last updated: {{ "now" | date: '%B %d, %Y' }}.
{%- endif %}
</div>
</footer>
{%- else -%}
<footer class="sticky-bottom mt-5">
<div class="container">
&copy; Copyright {{ site.time | date: '%Y' }} {{ site.first_name }} {{ site.middle_name }} {{ site.last_name }}. {{ site.footer_text }}
{%- if site.impressum_path -%}
<a href="{{ site.url }}{{ site.baseurl }}{{ site.impressum_path }}">Impressum</a>.
{%- endif -%}
{%- if site.last_updated -%}
Last updated: {{ "now" | date: '%B %d, %Y' }}.
{%- endif %}
</div>
</footer>
{%- endif %}
54 changes: 19 additions & 35 deletions _includes/head.html
View file
Original file line number Diff line number Diff line change
@@ -1,18 +1,10 @@
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<!-- Metadata, OpenGraph and Schema.org -->
{% include metadata.html %}

<title>
{% if site.title == "blank" %}
{{ site.first_name }} {{ site.middle_name }} {{ site.last_name }}
{% else %}
{{ site.title }}
{% endif %}
{% if page.title != "blank" and page.url != "/" %}
| {{ page.title }}
{% endif %}
</title>
<meta name="description" content="{{ site.description }}">
<!-- Bootstrap & MDB -->
<link href="https://stackpath.bootstrapcdn.com/bootstrap/{{ site.bootstrap.version }}/css/bootstrap.min.css" rel="stylesheet" integrity="{{ site.bootstrap.integrity.css }}" crossorigin="anonymous">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/mdbootstrap/{{ site.mdb.version }}/css/mdb.min.css" integrity="{{ site.mdb.integrity.css }}" crossorigin="anonymous" />

<!-- Google verification -->
<meta name="google-site-verification" content="B7YjkKH0TNVTJSXNN9OiN0tUOCJMd_CdKkOuD7oNKHs" />
Expand All @@ -27,27 +19,19 @@
<meta property="og:image" content="{%- if page.og_image -%}{{ page.og_image }}{%- else -%}{{ site.og_image }}{%- endif -%}" />
{% endif %}

<!-- Bootstrap & MDB -->
<link href="https://stackpath.bootstrapcdn.com/bootstrap/{{ site.bootstrap.version }}/css/bootstrap.min.css" rel="stylesheet" integrity="{{ site.bootstrap.integrity.css }}" crossorigin="anonymous">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/mdbootstrap/{{ site.mdb.version }}/css/mdb.min.css" integrity="{{ site.mdb.integrity.css }}" crossorigin="anonymous" />
<!-- Code Syntax Highlighting -->
<link rel="stylesheet" href="https://gitcdn.link/repo/jwarby/jekyll-pygments-themes/master/{{ site.highlight_theme }}.css" />

<!-- Fonts & Icons -->
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/{{ site.fontawesome.version }}/css/all.min.css" integrity="{{ site.fontawesome.integrity }}" crossorigin="anonymous">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/academicons/{{ site.academicons.version }}/css/academicons.min.css" integrity="{{ site.academicons.integrity }}" crossorigin="anonymous">
<link rel="stylesheet" type="text/css" href="https://fonts.googleapis.com/css?family=Roboto:300,400,500,700|Roboto+Slab:100,300,400,500,700|Material+Icons">
<!-- Styles -->
{% if site.icon != empty -%}
<link rel="icon" href="data:image/svg+xml,<svg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 100 100%22><text y=%22.9em%22 font-size=%2290%22>{{ site.icon }}</text></svg>">
{%- endif %}
<link rel="stylesheet" href="{{ '/assets/css/main.css' | relative_url }}">
<link rel="canonical" href="{{ page.url | replace:'index.html','' | absolute_url }}">

<!-- Code Syntax Highlighting -->
<link rel="stylesheet" href="https://gitcdn.link/repo/jwarby/jekyll-pygments-themes/master/{{ site.highlight_theme }}.css" />
{%- if site.enable_darkmode %}

<!-- Styles -->
{% if site.icon != empty %}
<link rel="icon" href="data:image/svg+xml,<svg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 100 100%22><text y=%22.9em%22 font-size=%2290%22>{{ site.icon }}</text></svg>">
{% endif %}
<link rel="stylesheet" href="{{ '/assets/css/main.css' | relative_url }}">
<link rel="canonical" href="{{ page.url | replace:'index.html','' | absolute_url }}">

{% if site.enable_darkmode %}
<!-- Dark Mode -->
<script src="{{ '/assets/js/theme.js' | relative_url }}"></script>
<script src="{{ '/assets/js/dark_mode.js' | relative_url }}"></script>
{% endif %}
<!-- Dark Mode -->
<script src="{{ '/assets/js/theme.js' | relative_url }}"></script>
<script src="{{ '/assets/js/dark_mode.js' | relative_url }}"></script>
{%- endif -%}
89 changes: 75 additions & 14 deletions _includes/header.html
View file
Original file line number Diff line number Diff line change
@@ -1,4 +1,3 @@
<header>

<!-- Nav Bar -->
<nav id="navbar" class="navbar navbar-light navbar-expand-sm {% if site.navbar_fixed %}fixed-top{% else %}sticky-top{% endif %}">
Expand Down Expand Up @@ -81,18 +80,80 @@
</li>
{% endif %}
{% endif %}
{% endfor %}
{% if site.enable_darkmode %}
<div class = "toggle-container">
<a id = "light-toggle">
<!-- Navbar Toggle -->
<button class="navbar-toggler collapsed ml-auto" type="button" data-toggle="collapse" data-target="#navbarNav" aria-controls="navbarNav" aria-expanded="false" aria-label="Toggle navigation">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar top-bar"></span>
<span class="icon-bar middle-bar"></span>
<span class="icon-bar bottom-bar"></span>
</button>

<div class="collapse navbar-collapse text-right" id="navbarNav">
<ul class="navbar-nav ml-auto flex-nowrap">

<!-- About -->
<li class="nav-item {% if page.title == 'about' %}active{% endif %}">
<a class="nav-link" href="{{ '/' | relative_url }}">about
{%- if page.title == "about" -%}
<span class="sr-only">(current)</span>
{%- endif -%}
</a>
</li>
{% if site.blog_name %}
<!-- Blog -->
<li class="nav-item {% if page.url contains 'blog' %}active{% endif %}">
<a class="nav-link" href="{{ '/blog/' | relative_url }}">blog
{%- if page.title == "blog" -%}
<span class="sr-only">(current)</span>
{%- endif -%}
</a>
</li>
{%- endif %}

<!-- Other pages -->
{%- assign sorted_pages = site.pages | sort: "title" -%}
{%- for p in sorted_pages -%}
{%- if p.nav and p.autogen == nil -%}
{%- if p.dropdown %}
<li class="nav-item dropdown {% if page.title == p.title %}active{% endif %}">
<a class="nav-link dropdown-toggle" href="#" id="navbarDropdown" role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">{{ p.title }}
{%- if page.title == p.title -%}
<span class="sr-only">(current)</span>
{%- endif -%}
</a>
<div class="dropdown-menu dropdown-menu-right" aria-labelledby="navbarDropdown">
{%- for child in p.children -%}
{%- if child.title == 'divider' %}
<div class="dropdown-divider"></div>
{%- else %}
<a class="dropdown-item" href="{{ child.permalink | relative_url }}">{{ child.title }}</a>
{%- endif -%}
{% endfor %}
</div>
</li>
{%- else %}
<li class="nav-item {% if page.title == p.title %}active{% endif %}">
<a class="nav-link" href="{{ p.url | relative_url }}">{{ p.title }}
{%- if page.title == p.title -%}
<span class="sr-only">(current)</span>
{%- endif -%}
</a>
</li>
{%- endif -%}
{%- endif -%}
{% endfor -%}
{%- if site.enable_darkmode %}

<!-- Toogle theme mode -->
<div class = "toggle-container">
<a id = "light-toggle">
<i class="fas fa-moon"></i>
<i class="fas fa-sun"></i>
</a>
</div>
{% endif %}
</ul>
</div>
</div>
</nav>

</header>
</a>
</div>
{%- endif %}
</ul>
</div>
</div>
</nav>
</header>
Loading

0 comments on commit d092f65

Please sign in to comment.