Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Add Microformats #3052

Merged
merged 8 commits into from
Jul 23, 2021
Merged

Add Microformats #3052

Show file tree
Hide file tree
Changes from 7 commits
Commits
Show all changes
8 commits
Select commit Hold shift + click to select a range
ba55029
Add rel=me to author profile links
dltj Jun 27, 2021
73bc07f
Add h-card Microformats markup
dltj Jun 27, 2021
f52d43f
Add h-entry microformat markup
dltj Jun 28, 2021
04fe046
Fix missing anchor tag
dltj Jul 10, 2021
2756c4f
Fix h-entry microformat markup on single template
dltj Jul 11, 2021
544a5e6
Use minimal subset of Microformat elements
dltj Jul 13, 2021
560da93
Add page link to h1 tag
dltj Jul 23, 2021
fa138dc
Put author 'u-url' on author__name h3
dltj Jul 23, 2021
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
2 changes: 1 addition & 1 deletion _includes/author-profile-custom-links.html
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
<!--
<li>
<a href="http://link-to-whatever-social-network.com/user/" itemprop="sameAs" rel="nofollow noopener noreferrer">
<a href="http://link-to-whatever-social-network.com/user/" itemprop="sameAs" rel="nofollow noopener noreferrer me">
<i class="fas fa-fw" aria-hidden="true"></i> Custom Social Profile Link
</a>
</li>
Expand Down
72 changes: 38 additions & 34 deletions _includes/author-profile.html
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,28 +1,32 @@
{% assign author = page.author | default: page.authors[0] | default: site.author %}
{% assign author = site.data.authors[author] | default: author %}

<div itemscope itemtype="https://schema.org/Person">
<div itemscope itemtype="https://schema.org/Person" class="h-card">

<a class="u-url hidden" rel="me" href="{{ '/' | relative_url }}">
Copy link
Owner

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Can we remove this hidden markup since u-url is being applied to the author.home link.
If u-url is required and the thought was to add the hidden markup because there is no guarantee someone adds author.home to their config.

Perhaps we can do a similar thing to the post title. In this case make the author name a link... use author.home first fallback to the site's root URL if the home link hasn't been configured.

<h3 class="author__name" itemprop="name" class="p-name">{{ author.name }}</h3>
  <a class="u-url" rel="me" href="{{ author.home | default: '/' | relative_url }}">{{ author.name }}</a>
</h3>

Hidden microformat entry for representative h-card
</a>

{% if author.avatar %}
<div class="author__avatar">
{% if author.home %}
<a href="{{ author.home | relative_url }}">
<img src="{{ author.avatar | relative_url }}" alt="{{ author.name }}" itemprop="image">
<img src="{{ author.avatar | relative_url }}" alt="{{ author.name }}" itemprop="image" class="u-photo">
</a>
{% else %}
<img src="{{ author.avatar | relative_url }}" alt="{{ author.name }}" itemprop="image">
<img src="{{ author.avatar | relative_url }}" alt="{{ author.name }}" itemprop="image" class="u-photo">
{% endif %}
</div>
{% endif %}

<div class="author__content">
{% if author.home %}
<a href="{{ author.home | relative_url }}"><h3 class="author__name" itemprop="name">{{ author.name }}</h3></a>
<a href="{{ author.home | relative_url }}" class="u-url"><h3 class="author__name" itemprop="name" class="p-name">{{ author.name }}</h3></a>
{% else %}
<h3 class="author__name" itemprop="name">{{ author.name }}</h3>
<h3 class="author__name" itemprop="name" class="p-name">{{ author.name }}</h3>
{% endif %}
{% if author.bio %}
<div class="author__bio" itemprop="description">
<div class="author__bio p-note" itemprop="description">
{{ author.bio | markdownify }}
</div>
{% endif %}
Expand All @@ -33,29 +37,29 @@ <h3 class="author__name" itemprop="name">{{ author.name }}</h3>
<ul class="author__urls social-icons">
{% if author.location %}
<li itemprop="homeLocation" itemscope itemtype="https://schema.org/Place">
<i class="fas fa-fw fa-map-marker-alt" aria-hidden="true"></i> <span itemprop="name">{{ author.location }}</span>
<i class="fas fa-fw fa-map-marker-alt" aria-hidden="true"></i> <span itemprop="name" class="p-locality">{{ author.location }}</span>
</li>
{% endif %}

{% if author.links %}
{% for link in author.links %}
{% if link.label and link.url %}
<li><a href="{{ link.url }}" rel="nofollow noopener noreferrer"><i class="{{ link.icon | default: 'fas fa-link' }}" aria-hidden="true"></i><span class="label">{{ link.label }}</span></a></li>
<li><a href="{{ link.url }}" rel="nofollow noopener noreferrer me"><i class="{{ link.icon | default: 'fas fa-link' }}" aria-hidden="true"></i><span class="label">{{ link.label }}</span></a></li>
{% endif %}
{% endfor %}
{% endif %}

{% if author.uri %}
<li>
<a href="{{ author.uri }}" itemprop="url">
<a href="{{ author.uri }}" itemprop="url" rel="me">
<i class="fas fa-fw fa-link" aria-hidden="true"></i><span class="label">{{ site.data.ui-text[site.locale].website_label | default: "Website" }}</span>
</a>
</li>
{% endif %}

{% if author.email %}
<li>
<a href="mailto:{{ author.email }}">
<a href="mailto:{{ author.email }}" rel="me" class="u-email">
<meta itemprop="email" content="{{ author.email }}" />
<i class="fas fa-fw fa-envelope-square" aria-hidden="true"></i><span class="label">{{ site.data.ui-text[site.locale].email_label | default: "Email" }}</span>
</a>
Expand All @@ -64,127 +68,127 @@ <h3 class="author__name" itemprop="name">{{ author.name }}</h3>

{% if author.keybase %}
<li>
<a href="https://keybase.io/{{ author.keybase }}" itemprop="sameAs" rel="nofollow noopener noreferrer">
<a href="https://keybase.io/{{ author.keybase }}" itemprop="sameAs" rel="nofollow noopener noreferrer me">
<i class="fas fa-fw fa-key" aria-hidden="true"></i><span class="label">Keybase</span>
</a>
</li>
{% endif %}

{% if author.twitter %}
<li>
<a href="https://twitter.com/{{ author.twitter }}" itemprop="sameAs" rel="nofollow noopener noreferrer">
<a href="https://twitter.com/{{ author.twitter }}" itemprop="sameAs" rel="nofollow noopener noreferrer me">
<i class="fab fa-fw fa-twitter-square" aria-hidden="true"></i><span class="label">Twitter</span>
</a>
</li>
{% endif %}

{% if author.facebook %}
<li>
<a href="https://www.facebook.com/{{ author.facebook }}" itemprop="sameAs" rel="nofollow noopener noreferrer">
<a href="https://www.facebook.com/{{ author.facebook }}" itemprop="sameAs" rel="nofollow noopener noreferrer me">
<i class="fab fa-fw fa-facebook-square" aria-hidden="true"></i><span class="label">Facebook</span>
</a>
</li>
{% endif %}

{% if author.linkedin %}
<li>
<a href="https://www.linkedin.com/in/{{ author.linkedin }}" itemprop="sameAs" rel="nofollow noopener noreferrer">
<a href="https://www.linkedin.com/in/{{ author.linkedin }}" itemprop="sameAs" rel="nofollow noopener noreferrer me">
<i class="fab fa-fw fa-linkedin" aria-hidden="true"></i><span class="label">LinkedIn</span>
</a>
</li>
{% endif %}

{% if author.xing %}
<li>
<a href="https://www.xing.com/profile/{{ author.xing }}" itemprop="sameAs" rel="nofollow noopener noreferrer">
<a href="https://www.xing.com/profile/{{ author.xing }}" itemprop="sameAs" rel="nofollow noopener noreferrer me">
<i class="fab fa-fw fa-xing-square" aria-hidden="true"></i><span class="label">XING</span>
</a>
</li>
{% endif %}

{% if author.instagram %}
<li>
<a href="https://instagram.com/{{ author.instagram }}" itemprop="sameAs" rel="nofollow noopener noreferrer">
<a href="https://instagram.com/{{ author.instagram }}" itemprop="sameAs" rel="nofollow noopener noreferrer me">
<i class="fab fa-fw fa-instagram" aria-hidden="true"></i><span class="label">Instagram</span>
</a>
</li>
{% endif %}

{% if author.tumblr %}
<li>
<a href="https://{{ author.tumblr }}.tumblr.com" itemprop="sameAs" rel="nofollow noopener noreferrer">
<a href="https://{{ author.tumblr }}.tumblr.com" itemprop="sameAs" rel="nofollow noopener noreferrer me">
<i class="fab fa-fw fa-tumblr-square" aria-hidden="true"></i><span class="label">Tumblr</span>
</a>
</li>
{% endif %}

{% if author.bitbucket %}
<li>
<a href="https://bitbucket.org/{{ author.bitbucket }}" itemprop="sameAs" rel="nofollow noopener noreferrer">
<a href="https://bitbucket.org/{{ author.bitbucket }}" itemprop="sameAs" rel="nofollow noopener noreferrer me">
<i class="fab fa-fw fa-bitbucket" aria-hidden="true"></i><span class="label">Bitbucket</span>
</a>
</li>
{% endif %}

{% if author.github %}
<li>
<a href="https://github.com/{{ author.github }}" itemprop="sameAs" rel="nofollow noopener noreferrer">
<a href="https://github.com/{{ author.github }}" itemprop="sameAs" rel="nofollow noopener noreferrer me">
<i class="fab fa-fw fa-github" aria-hidden="true"></i><span class="label">GitHub</span>
</a>
</li>
{% endif %}

{% if author.gitlab %}
<li>
<a href="https://gitlab.com/{{ author.gitlab }}" itemprop="sameAs" rel="nofollow noopener noreferrer">
<a href="https://gitlab.com/{{ author.gitlab }}" itemprop="sameAs" rel="nofollow noopener noreferrer me">
<i class="fab fa-fw fa-gitlab" aria-hidden="true"></i><span class="label">GitLab</span>
</a>
</li>
{% endif %}

{% if author.stackoverflow %}
<li>
<a href="https://stackoverflow.com/users/{{ author.stackoverflow }}" itemprop="sameAs" rel="nofollow noopener noreferrer">
<a href="https://stackoverflow.com/users/{{ author.stackoverflow }}" itemprop="sameAs" rel="nofollow noopener noreferrer me">
<i class="fab fa-fw fa-stack-overflow" aria-hidden="true"></i><span class="label">Stack Overflow</span>
</a>
</li>
{% endif %}

{% if author.lastfm %}
<li>
<a href="https://last.fm/user/{{ author.lastfm }}" itemprop="sameAs" rel="nofollow noopener noreferrer">
<a href="https://last.fm/user/{{ author.lastfm }}" itemprop="sameAs" rel="nofollow noopener noreferrer me">
<i class="fab fa-fw fa-lastfm-square" aria-hidden="true"></i><span class="label">Last.fm</span>
</a>
</li>
{% endif %}

{% if author.dribbble %}
<li>
<a href="https://dribbble.com/{{ author.dribbble }}" itemprop="sameAs" rel="nofollow noopener noreferrer">
<a href="https://dribbble.com/{{ author.dribbble }}" itemprop="sameAs" rel="nofollow noopener noreferrer me">
<i class="fab fa-fw fa-dribbble" aria-hidden="true"></i><span class="label">Dribbble</span>
</a>
</li>
{% endif %}

{% if author.pinterest %}
<li>
<a href="https://www.pinterest.com/{{ author.pinterest }}" itemprop="sameAs" rel="nofollow noopener noreferrer">
<a href="https://www.pinterest.com/{{ author.pinterest }}" itemprop="sameAs" rel="nofollow noopener noreferrer me">
<i class="fab fa-fw fa-pinterest" aria-hidden="true"></i><span class="label">Pinterest</span>
</a>
</li>
{% endif %}

{% if author.foursquare %}
<li>
<a href="https://foursquare.com/{{ author.foursquare }}" itemprop="sameAs" rel="nofollow noopener noreferrer">
<a href="https://foursquare.com/{{ author.foursquare }}" itemprop="sameAs" rel="nofollow noopener noreferrer me">
<i class="fab fa-fw fa-foursquare" aria-hidden="true"></i><span class="label">Foursquare</span>
</a>
</li>
{% endif %}

{% if author.steam %}
<li>
<a href="https://steamcommunity.com/id/{{ author.steam }}" itemprop="sameAs" rel="nofollow noopener noreferrer">
<a href="https://steamcommunity.com/id/{{ author.steam }}" itemprop="sameAs" rel="nofollow noopener noreferrer me">
<i class="fab fa-fw fa-steam" aria-hidden="true"></i><span class="label">Steam</span>
</a>
</li>
Expand All @@ -193,13 +197,13 @@ <h3 class="author__name" itemprop="name">{{ author.name }}</h3>
{% if author.youtube %}
{% if author.youtube contains "://" %}
<li>
<a href="{{ author.youtube }}" itemprop="sameAs" rel="nofollow noopener noreferrer">
<a href="{{ author.youtube }}" itemprop="sameAs" rel="nofollow noopener noreferrer me">
<i class="fab fa-fw fa-youtube" aria-hidden="true"></i><span class="label">YouTube</span>
</a>
</li>
{% elsif author.youtube %}
<li>
<a href="https://www.youtube.com/user/{{ author.youtube }}" itemprop="sameAs" rel="nofollow noopener noreferrer">
<a href="https://www.youtube.com/user/{{ author.youtube }}" itemprop="sameAs" rel="nofollow noopener noreferrer me">
<i class="fab fa-fw fa-youtube" aria-hidden="true"></i><span class="label">YouTube</span>
</a>
</li>
Expand All @@ -208,39 +212,39 @@ <h3 class="author__name" itemprop="name">{{ author.name }}</h3>

{% if author.soundcloud %}
<li>
<a href="https://soundcloud.com/{{ author.soundcloud }}" itemprop="sameAs" rel="nofollow noopener noreferrer">
<a href="https://soundcloud.com/{{ author.soundcloud }}" itemprop="sameAs" rel="nofollow noopener noreferrer me">
<i class="fab fa-fw fa-soundcloud" aria-hidden="true"></i><span class="label">SoundCloud</span>
</a>
</li>
{% endif %}

{% if author.weibo %}
<li>
<a href="https://www.weibo.com/{{ author.weibo }}" itemprop="sameAs" rel="nofollow noopener noreferrer">
<a href="https://www.weibo.com/{{ author.weibo }}" itemprop="sameAs" rel="nofollow noopener noreferrer me">
<i class="fab fa-fw fa-weibo" aria-hidden="true"></i><span class="label">Weibo</span>
</a>
</li>
{% endif %}

{% if author.flickr %}
<li>
<a href="https://www.flickr.com/{{ author.flickr }}" itemprop="sameAs" rel="nofollow noopener noreferrer">
<a href="https://www.flickr.com/{{ author.flickr }}" itemprop="sameAs" rel="nofollow noopener noreferrer me">
<i class="fab fa-fw fa-flickr" aria-hidden="true"></i><span class="label">Flickr</span>
</a>
</li>
{% endif %}

{% if author.codepen %}
<li>
<a href="https://codepen.io/{{ author.codepen }}" itemprop="sameAs" rel="nofollow noopener noreferrer">
<a href="https://codepen.io/{{ author.codepen }}" itemprop="sameAs" rel="nofollow noopener noreferrer me">
<i class="fab fa-fw fa-codepen" aria-hidden="true"></i><span class="label">CodePen</span>
</a>
</li>
{% endif %}

{% if author.vine %}
<li>
<a href="https://vine.co/u/{{ author.vine }}" itemprop="sameAs" rel="nofollow noopener noreferrer">
<a href="https://vine.co/u/{{ author.vine }}" itemprop="sameAs" rel="nofollow noopener noreferrer me">
<i class="fab fa-fw fa-vine" aria-hidden="true"></i><span class="label">{{ site.data.ui-text[site.locale].email_label | default: "Email" }}</span>
</a>
</li>
Expand All @@ -249,4 +253,4 @@ <h3 class="author__name" itemprop="name">{{ author.name }}</h3>
{% include author-profile-custom-links.html %}
</ul>
</div>
</div>
</div>
2 changes: 1 addition & 1 deletion _includes/category-list.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -12,7 +12,7 @@
<strong><i class="fas fa-fw fa-folder-open" aria-hidden="true"></i> {{ site.data.ui-text[site.locale].categories_label | default: "Categories:" }} </strong>
<span itemprop="keywords">
{% for category_word in categories_sorted %}
<a href="{{ category_word | slugify | prepend: path_type | prepend: site.category_archive.path | relative_url }}" class="page__taxonomy-item" rel="tag">{{ category_word }}</a>{% unless forloop.last %}<span class="sep">, </span>{% endunless %}
<a href="{{ category_word | slugify | prepend: path_type | prepend: site.category_archive.path | relative_url }}" class="page__taxonomy-item p-category" rel="tag">{{ category_word }}</a>{% unless forloop.last %}<span class="sep">, </span>{% endunless %}
{% endfor %}
</span>
</p>
Expand Down
6 changes: 3 additions & 3 deletions _includes/page__date.html
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
{% assign date_format = site.date_format | default: "%B %-d, %Y" %}
{% if page.last_modified_at %}
<p class="page__date"><strong><i class="fas fa-fw fa-calendar-alt" aria-hidden="true"></i> {{ site.data.ui-text[site.locale].date_label | default: "Updated:" }}</strong> <time datetime="{{ page.last_modified_at | date: "%Y-%m-%d" }}">{{ page.last_modified_at | date: date_format }}</time></p>
<p class="page__date"><strong><i class="fas fa-fw fa-calendar-alt" aria-hidden="true"></i> {{ site.data.ui-text[site.locale].date_label | default: "Updated:" }}</strong> <time class="dt-published" datetime="{{ page.last_modified_at | date: "%Y-%m-%d" }}">{{ page.last_modified_at | date: date_format }}</time></p>
{% elsif page.date %}
<p class="page__date"><strong><i class="fas fa-fw fa-calendar-alt" aria-hidden="true"></i> {{ site.data.ui-text[site.locale].date_label | default: "Updated:" }}</strong> <time datetime="{{ page.date | date_to_xmlschema }}">{{ page.date | date: date_format }}</time></p>
{% endif %}
<p class="page__date"><strong><i class="fas fa-fw fa-calendar-alt" aria-hidden="true"></i> {{ site.data.ui-text[site.locale].date_label | default: "Updated:" }}</strong> <time class="dt-published" datetime="{{ page.date | date_to_xmlschema }}">{{ page.date | date: date_format }}</time></p>
{% endif %}
2 changes: 1 addition & 1 deletion _includes/tag-list.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -12,7 +12,7 @@
<strong><i class="fas fa-fw fa-tags" aria-hidden="true"></i> {{ site.data.ui-text[site.locale].tags_label | default: "Tags:" }} </strong>
<span itemprop="keywords">
{% for tag_word in tags_sorted %}
<a href="{{ tag_word | slugify | prepend: path_type | prepend: site.tag_archive.path | relative_url }}" class="page__taxonomy-item" rel="tag">{{ tag_word }}</a>{% unless forloop.last %}<span class="sep">, </span>{% endunless %}
<a href="{{ tag_word | slugify | prepend: path_type | prepend: site.tag_archive.path | relative_url }}" class="page__taxonomy-item p-category" rel="tag">{{ tag_word }}</a>{% unless forloop.last %}<span class="sep">, </span>{% endunless %}
{% endfor %}
</span>
</p>
Expand Down
10 changes: 6 additions & 4 deletions _layouts/single.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -17,7 +17,7 @@
<div id="main" role="main">
{% include sidebar.html %}

<article class="page" itemscope itemtype="https://schema.org/CreativeWork">
<article class="page h-entry" itemscope itemtype="https://schema.org/CreativeWork">
{% if page.title %}<meta itemprop="headline" content="{{ page.title | markdownify | strip_html | strip_newlines | escape_once }}">{% endif %}
{% if page.excerpt %}<meta itemprop="description" content="{{ page.excerpt | markdownify | strip_html | strip_newlines | escape_once }}">{% endif %}
{% if page.date %}<meta itemprop="datePublished" content="{{ page.date | date_to_xmlschema }}">{% endif %}
Expand All @@ -26,12 +26,14 @@
<div class="page__inner-wrap">
{% unless page.header.overlay_color or page.header.overlay_image %}
<header>
{% if page.title %}<h1 id="page-title" class="page__title" itemprop="headline">{{ page.title | markdownify | remove: "<p>" | remove: "</p>" }}</h1>{% endif %}
{% if page.title %}<h1 id="page-title" class="page__title p-name" itemprop="headline">
<a href="{{ page.url | absolute_url }}" class="u-url" itemprop="url">{{ page.title | markdownify | remove: "<p>" | remove: "</p>" }}</a>
</h1>{% endif %}
{% include page__meta.html %}
</header>
{% endunless %}

<section class="page__content" itemprop="text">
<section class="page__content e-content" itemprop="text">
{% if page.toc %}
<aside class="sidebar__right {% if page.toc_sticky %}sticky{% endif %}">
<nav class="toc">
Expand Down Expand Up @@ -86,4 +88,4 @@ <h4 class="page__related-title">{{ site.data.ui-text[site.locale].related_label
</div>
</div>
{% endif %}
</div>
</div>
7 changes: 6 additions & 1 deletion _sass/minimal-mistakes/_page.scss
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -72,6 +72,11 @@ body {
margin-top: 0;
line-height: 1;

a {
color: $dark-gray;
Copy link
Owner

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Replace with $text-color variable so each of the skins can assign the correct text color to match. They're not all dark gray.

text-decoration: none;
}

& + .page__meta {
margin-top: -0.5em;
}
Expand Down Expand Up @@ -556,4 +561,4 @@ body {
padding-right: 0;
}
}
}
}