Set rel attributes to links (fixes #40)

sass/_external.scss

@@ -1,5 +1,4 @@
-.external::after,
+.external::after {
-a[rel~="noreferrer"]::after {
 	$icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' %3E%3Cpath d='m6 6 5-5M7 1h4v4M4 2H3a2 2 0 0 0-2 2v5a2 2 0 0 0 2 2h5a2 2 0 0 0 2-2V8' style='fill:none;stroke:black;stroke-linejoin:round;stroke-linecap:round;stroke-width:2;stroke-dasharray:none'/%3E%3C/svg%3E");
 	-webkit-mask-image: $icon;
 	-webkit-mask-size: cover;

templates/404.html

@@ -1,6 +1,7 @@
 {% extends "base.html" %}
 
 {% block content %}
+{%- set rel_attributes = macros_rel_attributes::rel_attributes() | trim -%}
 <picture>
 	<source srcset="{{ get_url(path='404.png') }}" media="(prefers-reduced-motion: reduce)"></source>
 	<img id="not-found" class="pixels transparent no-hover" alt="404" src="{{ get_url(path='404.gif') }}">
@@ -13,7 +14,7 @@
 <div class="dialog-buttons">
 	<button class="inline-button" onclick="window.history.go(-1)">Go Back</button>
 	{%- if config.extra.issues_url %}
-		<a class="inline-button colored external" href="{{ config.extra.issues_url }}">File an Issue</a>
+		<a class="inline-button colored external" href="{{ config.extra.issues_url }}" rel="{{ rel_attributes }}">File an Issue</a>
 	{%- endif %}
 </div>
 {% endblock content %}

templates/article.html

@@ -3,6 +3,7 @@
 {% block content %}
 {%- set date_format = macros_translate::translate(key="date_format", default="%B %d, %Y", language_strings=language_strings) -%}
 {%- set date_locale = macros_translate::translate(key="date_locale", default="en_US", language_strings=language_strings) -%}
+{%- set rel_attributes = macros_rel_attributes::rel_attributes() | trim -%}
 <article>
 	{%- if page.extra.banner -%}
 		<div id="banner-container">
@@ -92,7 +93,7 @@
 <div class="dialog-buttons">
 	<a class="inline-button" href="#top">{{ macros_translate::translate(key="go_to_top", default="Go to Top", language_strings=language_strings) }}</a>
 	{%- if config.extra.issues_url -%}
-		<a class="inline-button colored external" href="{{ config.extra.issues_url }}">
+		<a class="inline-button colored external" href="{{ config.extra.issues_url }}" rel="{{ rel_attributes }}">
 			{{- macros_translate::translate(key="file_an_issue", default="File an Issue", language_strings=language_strings) -}}
 		</a>
 	{%- endif -%}

templates/base.html

@@ -1,3 +1,4 @@
+{% import "macros/rel_attributes.html" as macros_rel_attributes %}
 {% import "macros/translate.html" as macros_translate %}
 
 {%- set language_strings = load_data(path="i18n/" ~ lang ~ '.toml', required=false) -%}

templates/macros/rel_attributes.html

@@ -0,0 +1,17 @@
+{% macro rel_attributes() %}
+
+{%- set rel_attributes = [] -%}
+{%- if config.markdown.external_links_target_blank -%}
+    {%- set rel_attributes = rel_attributes | concat(with="noopener")  -%}
+{%- endif -%}
+{%- if config.markdown.external_links_no_follow -%}
+    {%- set rel_attributes = rel_attributes | concat(with="nofollow")  -%}
+{%- endif -%}
+{%- if config.markdown.external_links_no_referrer -%}
+    {%- set rel_attributes = rel_attributes | concat(with="noreferrer")  -%}
+{%- endif -%}
+
+{# Return the array of rel attributes joined by a space #}
+{{- rel_attributes | join(sep=" ") -}}
+
+{% endmacro rel_attributes %}

templates/partials/comments.html

@@ -1,6 +1,8 @@
 {#- Taken from https://carlschwan.eu/2020/12/29/adding-comments-to-your-static-blog-with-mastodon/ -#}
 {#- Attachment code taken from https://github.com/cassidyjames/cassidyjames.github.io/blob/99782788a7e3ba3cc52d6803010873abd1b02b9e/_includes/comments.html#L251-L296 -#}
 
+{%- set rel_attributes = macros_rel_attributes::rel_attributes() | trim -%}
+
 {%- if page.extra.comments.host -%}
 	{%- set host = page.extra.comments.host -%}
 {%- else -%}
@@ -26,7 +28,7 @@
 		<button id="load-comments" class="inline-button" onclick="loadComments()">
 			{{- macros_translate::translate(key="load_comments", default="Load Comments", language_strings=language_strings) -}}
 		</button>
-		<a class="inline-button colored external" href="https://{{ host }}/@{{ username }}/{{ id }}">
+		<a class="inline-button colored external" href="https://{{ host }}/@{{ username }}/{{ id }}" rel="{{ rel_attributes }}">
 			{{- macros_translate::translate(key="open_post", default="Open Post", language_strings=language_strings) -}}
 		</a>
 	</div>
@@ -147,7 +149,7 @@
 							let avatar = document.createElement("a");
 							avatar.className = "avatar-link";
 							avatar.setAttribute("href", status.account.url);
-							avatar.setAttribute("rel", "external nofollow");
+							avatar.setAttribute("rel", "{{ rel_attributes }}");
 							avatar.setAttribute(
 								"title",
 								`{{ macros_translate::translate(key="view_profile", default="View profile at", language_strings=language_strings) }} @${status.account.username}@${instance}`
@@ -161,7 +163,7 @@
 								"title",
 								`@${status.account.username}@${instance}`
 							);
-							instanceBadge.setAttribute("rel", "external nofollow");
+							instanceBadge.setAttribute("rel", "{{ rel_attributes }}");
 							instanceBadge.textContent = instance;
 
 							let display = document.createElement("span");
@@ -179,7 +181,7 @@
 							permalink.setAttribute("href", status.url);
 							permalink.setAttribute("itemprop", "url");
 							permalink.setAttribute("title", `{{ macros_translate::translate(key="view_comment", default="View comment at", language_strings=language_strings) }} ${instance}`);
-							permalink.setAttribute("rel", "external nofollow");
+							permalink.setAttribute("rel", "{{ rel_attributes }}");
 							permalink.textContent = new Date(
 								status.created_at
 							).toLocaleString("{{ date_locale }}", {

templates/partials/footer.html

@@ -1,3 +1,5 @@
+{%- set rel_attributes = macros_rel_attributes::rel_attributes() | trim -%}
+
 <footer id="site-footer">
 	{%- if config.extra.footer.links %}
 		<nav>
@@ -5,7 +7,7 @@
 				{%- for link in config.extra.footer.links %}
 				{%- if link.url is matching('https?://') %}
 					<li>
-						<a href="{{ link.url }}">
+						<a href="{{ link.url }}" rel="{{ rel_attributes }}">
 							{{- macros_translate::translate(key=link.name, default=link.name, language_strings=language_strings) -}}
 						</a>
 					</li>
@@ -31,7 +33,7 @@
 
 	{%- if config.extra.source_url and config.extra.footer.show_source %}
 		<p>
-			<a href="{{ config.extra.source_url }}">
+			<a href="{{ config.extra.source_url }}" rel="{{ rel_attributes }}">
 				{{- macros_translate::translate(key="source", default="Website source", language_strings=language_strings) -}}
 			</a>
 		</p>
@@ -40,7 +42,7 @@
 	{%- if config.extra.footer.show_powered_by %}
 		<p>
 			<small>
-				{{ macros_translate::translate(key="powered_by", default="Powered by", language_strings=language_strings) }} <a class="link" href="https://www.getzola.org">Zola</a> {{ macros_translate::translate(key="powered_by_and", default="and", language_strings=language_strings) }} <a class="link" href="https://duckquill.daudix.one">Duckquill</a>
+				{{ macros_translate::translate(key="powered_by", default="Powered by", language_strings=language_strings) }} <a class="link" href="https://www.getzola.org" rel="{{ rel_attributes }}">Zola</a> {{ macros_translate::translate(key="powered_by_and", default="and", language_strings=language_strings) }} <a class="link" href="https://duckquill.daudix.one" rel="{{ rel_attributes }}">Duckquill</a>
 			</small>
 		</p>
 	{%- endif %}
@@ -49,7 +51,7 @@
 		<ul id="socials">
 			{%- for link in config.extra.footer.socials %}
 				<li>
-					<a href="{{ link.url | safe }}" rel="me" title="{{ link.name }}">
+					<a href="{{ link.url | safe }}" rel="{{ rel_attributes }} me" title="{{ link.name }}">
 						<i class="icon" style='mask-image: url("data:image/svg+xml,{{ link.icon }}"); -webkit-mask-image: url("data:image/svg+xml,{{ link.icon }}")'></i>
 						<span>{{ link.name }}</span>
 					</a>

templates/partials/nav.html

@@ -1,3 +1,5 @@
+{%- set rel_attributes = macros_rel_attributes::rel_attributes() | trim -%}
+
 <header id="site-nav">
 	<nav>
 		<a href="#main" id="main-content" tabindex="0">
@@ -15,7 +17,7 @@
 			{%- for link in config.extra.nav.links %}
 				{%- if link.url is matching('https?://') %}
 					<li>
-						<a href="{{ link.url }}"
+						<a href="{{ link.url }}" rel="{{ rel_attributes }}"
 							{%- if current_url | default(value='/') | trim_end_matches(pat='/') | safe == link.url | trim_end_matches(pat='/') | safe -%}
 								class="active"
 							{%- endif -%}>