attila_pelican_theme/templates/article.html

224 lines
10 KiB
HTML

{% extends "base.html" %}
{% block title %}{{ article.title | striptags }}{% endblock %}
{# <!-- Choosing cover image --> #}
{% if article.cover %}
{% if article.cover|lower|truncate(4, True, '') == "http" %}
{% set selected_cover = article.cover %}
{% else %}
{% set selected_cover = SITEURL+"/"+article.cover %}
{% endif %}
{% elif article.og_image %}
{% if article.og_image|lower|truncate(4, True, '') == "http" %}
{% set selected_cover = article.og_image %}
{% else %}
{% set selected_cover = SITEURL+"/"+article.og_image %}
{% endif %}
{% elif article.color %}
{% set selected_color = article.color %}
{% elif HEADER_COVER %}
{% if HEADER_COVER|lower|truncate(4, True, '') == "http" %}
{% set selected_cover = HEADER_COVER %}
{% else %}
{% set selected_cover = SITEURL+"/"+HEADER_COVER %}
{% endif %}
{% elif HEADER_COLOR %}
{% set selected_color = HEADER_COLOR %}
{% endif %}
{% block canonical_url %}<link href="{{ SITEURL }}/{{ article.url }}" rel="canonical" />{% endblock canonical_url %}
{% block head %}
{{ super() }}
{% for keyword in article.keywords %}
<meta name="keywords" content="{{keyword}}" >
{% endfor %}
{% if description %}
<meta name="description" content="{{ description }}">
{% elif article.headline %}
<meta name="description" content="{{ article.headline }}">
{% elif article.summary %}
<meta name="description" content="{{ article.summary|striptags|truncate(140) }}">
{% endif %}
{% for author in article.authors %}
<meta name="author" content="{{ author }}">
{% endfor %}
{% for tag in article.tags %}
<meta name="tags" content="{{tag}}">
{% endfor %}
{% include 'partials/og_article.html' %}
{% include 'partials/jsonld_article.html' %}
{% endblock %}
{% block header %}
<!-- Progressbar -->
<div class="progress-container">
<span class="progress-bar"></span>
</div>
<!-- Page Header -->
<!-- Set your background image for this header on the line below. -->
<header id="post-header" {% if selected_cover or selected_color %}class="has-cover"{% endif %}>
<div class="inner">
<nav id="navigation">
{% if SITE_LOGO %}
<span class="blog-logo">
<a href="{{ SITEURL }}/"><img src="{{SITE_LOGO}}" alt="Blog Logo" /></a>
</span>
{% else %}
<span id="home-button" class="nav-button">
<a class="home-button" href="{{ SITEURL }}/" title="Home"><i class="ic ic-arrow-left"></i> Home</a>
</span>
{% endif %}
<span id="menu-button" class="nav-button">
<a class="menu-button"><i class="ic ic-menu"></i> Menu</a>
</span>
</nav>
<h1 class="post-title">{{ article.title }}</h1>
<!-- TODO : Proper class for headline -->
{% if article.headline %}
<span class="blog-description">{{ article.headline }}</span>
{% endif %}
<span class="post-meta">
{% for author in article.authors %}
{% set author_name = author.name | title %}
{% if AUTHORS_BIO and author.name.lower() in AUTHORS_BIO %}
{% set author_name = AUTHORS_BIO[author.name.lower()].name or author.name %}
{% endif %}
<a href="{{ SITEURL }}/{{ author.url }}">{{ author_name }}</a>
{% endfor %}
| <time datetime="{{ article.locale_date }}">{{ article.locale_date }}</time>
</span>
<!-- TODO : Modified check -->
{% if article.modified %}
<span class="post-meta"> | Updated on {{ article.locale_modified }}</span>
{% endif %}
{% if selected_cover %}
<div class="post-cover cover" style="background-image: url('{{ selected_cover }}'); background-position: left 0">
{% elif selected_color %}
<div class="post-cover cover" style="background-color: {{ selected_color }}">
{% endif %}
</div>
</header>
{% endblock header %}
{% block content %}
<!-- Post content -->
<main class="content" role="main">
<article class="post">
<div class="inner">
<section class="post-content">
{{article.content}}
</section>
<section class="post-info">
{% if article.tags %}
<aside class="post-tags">
{% for tag in article.tags if not tag=="pl-fr" %}<a href="{{ SITEURL }}/{{ tag.url }}">{{ tag | escape }}</a>{% if not loop.last %}{% endif %}{% endfor %}
</aside>
{% endif %}
<div class="clear"></div>
{% for author in article.authors %}
{% if AUTHORS_BIO and author.name.lower() in AUTHORS_BIO %}
<aside class="post-author">
{% set author_name = AUTHORS_BIO[author.name.lower()].name or author.name %}
{% set author_avatar = AUTHORS_BIO[author.name.lower()].image %}
{% if author_avatar %}
{% if author_avatar|lower|truncate(4, True, '') != "http" %}
{% set author_avatar = SITEURL+"/"+author_avatar %}
{% endif %}
<figure class="post-author-avatar">
<img src="{{author_avatar}}" alt="{{author_name}}" />
</figure>
{% endif %}
<div class="post-author-bio">
<h4 class="post-author-name"><a href="{{ SITEURL }}/{{author.url}}">{{author_name}}</a></h4>
{% if AUTHORS_BIO[author.name.lower()].bio %}
<p class="post-author-about">{{AUTHORS_BIO[author.name.lower()].bio}}</p>
{% endif %}
{% if AUTHORS_BIO[author.name.lower()].location %}
<span class="post-author-location"><i class="ic ic-location"></i> {{AUTHORS_BIO[author.name.lower()].location}}</span>
{% endif %}
{% if AUTHORS_BIO[author.name.lower()].website %}
<span class="post-author-website"><a href="{{AUTHORS_BIO[author.name.lower()].website}}"><i class="ic ic-link"></i> Website</a></span>
{% endif %}
<!-- Social linkes in alphabet order. -->
{% if AUTHORS_BIO[author.name.lower()].facebook %}
<span class="post-author-facebook"><a target="_blank" href="https://facebook.com/{{AUTHORS_BIO[author.name.lower()].facebook}}"><i class="ic ic-facebook"></i> Facebook</a></span>
{% endif %}
{% if AUTHORS_BIO[author.name.lower()].github %}
<span class="post-author-github"><a target="_blank" href="https://github.com/{{AUTHORS_BIO[author.name.lower()].github}}"><i class="ic ic-link"></i> GitHub</a></span>
{% endif %}
{% if AUTHORS_BIO[author.name.lower()].linkedin %}
<span class="post-author-linkedin"><a target="_blank" href="https://www.linkedin.com/in/{{AUTHORS_BIO[author.name.lower()].linkedin}}"><i class="ic ic-link"></i> LinkedIn</a></span>
{% endif %}
{% if AUTHORS_BIO[author.name.lower()].twitter %}
<span class="post-author-twitter"><a target="_blank" href="https://twitter.com/{{AUTHORS_BIO[author.name.lower()].twitter}}"><i class="ic ic-twitter"></i> Twitter</a></span>
{% endif %}
</div>
<div class="clear"></div>
</aside>
{% endif %}
{% endfor %}
</section>
{% if DISQUS_SITENAME and SITEURL and article.status != "draft" %}
<script type="text/javascript">
var disqus = '{{ DISQUS_SITENAME }}';
var disqus_shortname = '{{ DISQUS_SITENAME }}';
{% if article.disqus_identifier %}
var disqus_identifier = '{{ article.disqus_identifier }}';
{% else %}
var disqus_identifier = '/{{ article.url }}';
{% endif %}
var disqus_url = '{{ SITEURL }}/{{ article.url }}';
</script>
<noscript>Please enable JavaScript to view the comments.</noscript>
<section class="post-comments">
{% if article.disqus_identifier %}
<a id="show-disqus" class="post-comments-activate" data-disqus-identifier="{{ article.disqus_identifier }}" >Show Comments</a>
{% else %}
<a id="show-disqus" class="post-comments-activate" data-disqus-identifier="/{{ article.url }}" >Show Comments</a>
{% endif %}
<div id="disqus_thread"></div>
</section>
{% endif %}
<aside class="post-nav">
{% if article.next_article %}
<a class="post-nav-next" href="{{ SITEURL }}/{{ article.next_article.url}}">
<section class="post-nav-teaser">
<i class="ic ic-arrow-left"></i>
<h2 class="post-nav-title">{{ article.next_article.title }}</h2>
<p class="post-nav-excerpt">{{ article.next_article.summary|striptags|truncate(90) }}</p>
</section>
</a>
{% endif %}
{% if article.prev_article %}
<a class="post-nav-prev" href="{{ SITEURL }}/{{ article.prev_article.url}}">
<section class="post-nav-teaser">
<i class="ic ic-arrow-right"></i>
<h2 class="post-nav-title">{{ article.prev_article.title }}</h2>
<p class="post-nav-excerpt">{{ article.prev_article.summary|striptags|truncate(90) }}</p>
</section>
</a>
{% endif %}
<div class="clear"></div>
</aside>
</div>
</article>
</main>
{% endblock content %}