first commit

16 files changed, 1141 insertions, 0 deletions

diff --git a/libretube-theme/templates/archives.html b/libretube-theme/templates/archives.html
new file mode 100644
index 0000000..8374a58
--- /dev/null
+++ b/libretube-theme/templates/archives.html
@@ -0,0 +1,99 @@
+{% extends "base.html" %}
+
+{% block head %}
+    {% block title %}
+        <title>{{ _('Archivos de %(sitename)s', sitename=SITENAME) }}</title>
+    {% endblock %}
+    {{ super() }}
+    {% block seo %}
+        <meta name="description" content="{{ _('Lista de artículos publicados en %(sitename)s', sitename=SITENAME) }}"/>
+        <meta name="keywords" content="{{ _('archivos,artículos,historia,lista de artículos') }}"/>
+        <style>
+         .content ul, .content ul ul, .content ul ul ul {
+             list-style:none !important;
+         }
+         .content ul {
+             margin-left: 0px !important;
+         }
+         .contenedor-arbol, .contenedor-arbol ul, .contenedor-arbol li {
+             position: relative;
+             margin: 0;
+             padding-left: 2%;
+             line-height: normal;
+         }
+         .contenedor-arbol ul {
+             list-style: none;
+         }
+         .contenedor-arbol li::before, .contenedor-arbol li::after {
+             content: "";
+             position: absolute;
+             left: -12px;
+         }
+         .contenedor-arbol li::before {
+             border-top: 2px solid #000;
+             top: 9px;
+             width: 12px;
+             height: 0;
+         }
+         .contenedor-arbol li::after {
+             border-left: 2px solid black;
+             height: 100%;
+             width: 0px;
+             top: 2px;
+         }
+         .contenedor-arbol ul > li:last-child::after {
+             height: 8px;
+         }
+        </style>
+    {% endblock %}
+{% endblock %}
+
+{% block content %}
+<!-- Main -->
+<div class="row mt-6 mt-10">
+    <div class="col-md-9 mx-auto text-justify">
+        <!-- dinamic page content  -->
+        <div class="contenedor-arbol ml-3">
+            <p>{{ ngettext('%(num)d artículo', '%(num)d artículos', dates|length) }}</p>
+            <ul>
+                {% for article in dates %}
+                {% set current_year = article.date|strftime('%Y') %}
+                {% set current_month = article.date|strftime('%m') %}
+                {% if loop.previtem %}
+                {% set previous_year = loop.previtem.date|strftime('%Y') %}
+                {% set previous_month = loop.previtem.date|strftime('%m') %}
+                {% endif %}
+                {% if current_year != previous_year %}
+                {% if loop.previtem %}
+            </ul>
+            </li> <!-- Cierra el mes -->
+            </ul>
+            </li> <!-- Cierra el año -->
+            {% endif %}
+            <li><a href="{{ SITEURL }}/archives/{{ current_year }}/">{{ current_year }}</a>
+            <ul>
+            <li><a href="{{ SITEURL }}/archives/{{ current_year }}/{{ current_month }}/">{{ article.date|strftime('%B') }}</a>
+            <ul>
+            {% elif current_month != previous_month %}
+            {% if loop.previtem %}
+            </ul>
+            </li>
+            {% endif %}
+            <li><a href="{{ SITEURL }}/archives/{{ current_year }}/{{ current_month }}/">{{ article.date|strftime('%B') }}</a>
+            <ul>
+            {% endif %}
+            <li><a href="{{ SITEURL }}/{{ article.url }}" title="{{ article.locale_date}}">{{ article.title }}</a></li>
+            {% if loop.last %}
+            </ul>
+            </li> <!-- Cierra el mes -->
+            </ul>
+            </li> <!-- Cierra el año -->
+            {% endif %}
+            {% endfor %}
+            </ul>
+        </div>
+        <!-- End dinamic page content  -->
+    </div>
+</div>
+<!-- End Main -->
+{% endblock %}
diff --git a/libretube-theme/templates/article.html b/libretube-theme/templates/article.html
new file mode 100644
index 0000000..a29c95a
--- /dev/null
+++ b/libretube-theme/templates/article.html
@@ -0,0 +1,270 @@
+{% extends "base.html" %}
+{% block html_lang %}{{ article.lang }}{% endblock %}
+
+{% block head %}
+    {% block title %}
+        <title>{{ article.title }} - {{SITENAME}}</title>
+    {% endblock %}
+    {{ super() }}
+    {% import 'translations.html' as translations with context %}
+    {% if translations.entry_hreflang(article) %}
+        {{ translations.entry_hreflang(article) }}
+    {% endif %}
+    <!-- plyr -->
+    <link href="{{ SITEURL }}/{{ THEME_STATIC_DIR }}/modules/plyr/plyr.css" rel="stylesheet">
+    <!--/ plyr -->
+    {% if article.styles %}
+        {% for style in article.styles %}
+            {{ style }}
+        {% endfor %}
+    {% endif %}
+    {% block seo %}
+        {% set seo_description = article.summary|striptags %}
+        {% set SEO_DESC_LENGTH = 160 %}
+        {% if seo_description|length >= SEO_DESC_LENGTH %}
+            {# Quita la última palabra para no dejarla incompleta #}
+            {% set seo_description = seo_description[:SEO_DESC_LENGTH].split(' ')[:-1]|join(' ') %}
+            {% if not seo_description[-1] in ['.', '?', ':', '!'] %}
+                {% set seo_more = seo_description + '…' %}
+                {% set seo_description = seo_more|replace('"','') %}
+            {% endif %}
+        {% endif %}
+        <!-- Article Image -->
+        {% set article_image = "%s/%s/../wp-content/uploads/article/thumbnail/%s" % (SITEURL, THEME_STATIC_DIR, article.image) %}
+        <!-- Meta Article -->
+        <meta name="author" content="{{ article.author }}"/>
+        <meta name="description" content="{{ seo_description|striptags }}"/>
+        <meta name="keywords" content="{{ article.tags|join(',')|escape }}"/>
+        <!-- Schema -->
+        <meta itemprop="name" content="{{ article.title }}"/>
+        <meta itemprop="description" content="{{ seo_description|striptags }}"/>
+        <meta itemprop="uploadDate" content="{{ article.date.isoformat() }}"/>
+        <meta itemprop="thumbnailURL" content="{{ article_image }}"/>
+        <!-- OpenGraph -->
+        <meta property="article:section" content="{{ article.category }}"/>
+        <meta property="video:release_date" content="{{ article.date.isoformat() }}"/>
+        {% if article.modified %}
+            <meta property="article:modified_time" content="{{ article.modified.isoformat() }}"/>
+        {% endif %}
+        <meta property="og:title" content="{{ article.title }}"/>
+        <meta property="og:type" content="video.movie"/>
+        <meta property="og:url" content="{{ SITEURL }}/{{ article.url }}"/>
+        <meta property="og:description" content="{{ seo_description|striptags }}"/>
+        <meta property="og:image" content="{{ article_image }}"/>
+        {% for tag in article.tags %}
+            <meta property="og:video:tag" content="{{ tag | escape }}"/>
+        {% endfor %}
+        {% if article.og_video %}
+            <!-- videograph -->
+            <meta property="og:video" content="{{ article.og_video }}"/>
+            <meta property="og:video:secure_url" content="{{ article.og_video }}"/>
+            <meta property="og:video:type" content="video/webm"/>
+            <meta property="og:video:width" content="400"/>
+            <meta property="og:video:height" content="300"/>
+            <!-- /videograph -->
+        {% endif %}
+        <!-- Twitter -->
+        <meta name="twitter:card" content="summary"/>
+        <meta name="twitter:title" content="{{ article.title }} - {{ SITENAME }}"/>
+        <meta name="twitter:description" content="{{ seo_description|striptags }}"/>
+        <meta name="twitter:url" content="{{ SITEURL }}/{{ article.url }}"/>
+        <meta name="twitter:image" content="{{ article_image }}"/>
+    {% endblock %}
+{% endblock %}
+
+{% block menu_header %} <!-- empty -->{% endblock menu_header %}
+
+{%- block content -%}
+    <!-- Main -->
+    <main class="row mt-3 mt-10">
+        <div class="col-md-12">
+            <div class="row mr-3">
+                <div class="col-md-8">
+
+                    <!-- dinamic article content  -->
+                    <div class="ml-3 mb-3">
+                        {{ article.content }}
+                    </div>
+                    <!-- End dinamic article content  -->
+
+                    <!-- License -->
+                    <div class="d-flex align-items-center ml-3">
+                        <h6 class="mr-3 font-weight-bold">{{ _('Licencia') }}</h6>
+                        {% if article.license ==  LICENSE['allrights']['name'] %}
+                            <!-- allrights -->
+                            <a>{{ article.license }}</a>
+                            <!-- cc - version 4 -->
+                        {% elif article.license ==  LICENSE['ccby4']['name']%}
+                            <!-- ccby4 -->
+                            <a href="{{ LICENSE['ccby4']['url'] }}" rel="noopener noreferrer" target="_blank"><abbr title="{{ LICENSE['ccby4']['fullname'] }}">{{ article.license }}</abbr></a>
+                        {% elif article.license ==  LICENSE['ccbysa4']['name']%}
+                            <!-- ccbysa4 -->
+                            <a href="{{ LICENSE['ccbysa4']['url'] }}" rel="noopener noreferrer" target="_blank"><abbr title="{{ LICENSE['ccbysa4']['fullname'] }}">{{ article.license }}</abbr></a>
+                        {% elif article.license ==  LICENSE['ccbynd4']['name']%}
+                            <!-- ccbynd4 -->
+                            <a href="{{ LICENSE['ccbynd4']['url'] }}" rel="noopener noreferrer" target="_blank"><abbr title="{{ LICENSE['ccbynd4']['fullname'] }}">{{ article.license }}</abbr></a>
+                        {% elif article.license ==  LICENSE['ccbync4']['name']%}
+                            <!-- ccbync4 -->
+                            <a href="{{ LICENSE['ccbync4']['url'] }}" rel="noopener noreferrer" target="_blank"><abbr title="{{ LICENSE['ccbync4']['fullname'] }}">{{ article.license }}</abbr></a>
+                        {% elif article.license ==  LICENSE['ccbyncsa4']['name']%}
+                            <!-- ccbyncsa4 -->
+                            <a href="{{ LICENSE['ccbyncsa4']['url'] }}" rel="noopener noreferrer" target="_blank"><abbr title="{{ LICENSE['ccbyncsa4']['fullname'] }}">{{ article.license }}</abbr></a>
+                        {% elif article.license ==  LICENSE['ccbyncnd4']['name']%}
+                            <!-- ccbyncnd4 -->
+                            <a href="{{ LICENSE['ccbyncnd4']['url'] }}" rel="noopener noreferrer" target="_blank"><abbr title="{{ LICENSE['ccbyncnd4']['fullname'] }}">{{ article.license }}</abbr></a>
+                            <!-- cc - version 3 -->
+                        {% elif article.license ==  LICENSE['ccby3']['name']%}
+                            <!-- ccby3 -->
+                            <a href="{{ LICENSE['ccby3']['url'] }}" rel="noopener noreferrer" target="_blank"><abbr title="{{ LICENSE['ccby3']['fullname'] }}">{{ article.license }}</abbr></a>
+                        {% elif article.license ==  LICENSE['ccbysa3']['name']%}
+                            <!-- ccbysa3 -->
+                            <a href="{{ LICENSE['ccbysa3']['url'] }}" rel="noopener noreferrer" target="_blank"><abbr title="{{ LICENSE['ccbysa3']['fullname'] }}">{{ article.license }}</abbr></a>
+                        {% elif article.license ==  LICENSE['ccbynd3']['name']%}
+                            <!-- ccbynd3 -->
+                            <a href="{{ LICENSE['ccbynd3']['url'] }}" rel="noopener noreferrer" target="_blank"><abbr title="{{ LICENSE['ccbynd3']['fullname'] }}">{{ article.license }}</abbr></a>
+                        {% elif article.license ==  LICENSE['ccbync3']['name']%}
+                            <!-- ccbync3 -->
+                            <a href="{{ LICENSE['ccbync3']['url'] }}" rel="noopener noreferrer" target="_blank"><abbr title="{{ LICENSE['ccbync3']['fullname'] }}">{{ article.license }}</abbr></a>
+                        {% elif article.license ==  LICENSE['ccbyncsa3']['name']%}
+                            <!-- ccbyncsa3 -->
+                            <a href="{{ LICENSE['ccbyncsa3']['url'] }}" rel="noopener noreferrer" target="_blank"><abbr title="{{ LICENSE['ccbyncsa3']['fullname'] }}">{{ article.license }}</abbr></a>
+                        {% elif article.license ==  LICENSE['ccbyncnd3']['name']%}
+                            <!-- ccbyncnd3 -->
+                            <a href="{{ LICENSE['ccbyncnd3']['url'] }}" rel="noopener noreferrer" target="_blank"><abbr title="{{ LICENSE['ccbyncnd3']['fullname'] }}">{{ article.license }}</abbr></a>
+                        {% elif article.license ==  LICENSE['cc01']['name']%}
+                            <!-- cc01 -->
+                            <a href="{{ LICENSE['cc01']['url'] }}" rel="noopener noreferrer" target="_blank"><abbr title="{{ LICENSE['cc01']['fullname'] }}">{{ article.license }}</abbr></a>
+                            {% elif article.license ==  LICENSE['publicdomain']['name']%}
+                            <!-- publicdomanin -->
+                            <a href="{{ LICENSE['publicdomain']['url'] }}" rel="noopener noreferrer" target="_blank"><abbr title="{{ LICENSE['publicdomain']['fullname'] }}">{{ article.license }}</abbr></a>
+                        {% else %}
+                            <a href="https://creativecommons.org/licenses/by-sa/4.0/" rel="noopener noreferrer" target="_blank"><abbr title="Attribution-ShareAlike 4.0 International">CC BY-SA 4.0</abbr></a>
+                        {% endif %}
+                    </div>
+                    <!-- /License -->
+
+                    <!-- Author -->
+                    <div class="ml-3">
+                        <hr class="hr-author">
+
+                        <p class="mb-0">
+                            {% if not HIDE_AUTHORS and article.authors %}
+                                <span class="soumaicon text-info">
+                                    <svg>
+                                        <use href="{{ SITEURL }}/{{ THEME_STATIC_DIR }}/images/svg/master.svg#user" />
+                                    </svg>
+                                </span>
+                                {% for author in article.authors %}
+                                    <a class="link-author" href="{{ SITEURL }}/{{ author.url }}" title="{{ author }}">{{ author }}</a>
+                                    <span class="style-scope">
+                                        <svg viewBox="0 0 24 24" preserveAspectRatio="xMidYMid meet" focusable="false">
+                                            <g>
+                                                <path fill-rule="evenodd" clip-rule="evenodd" d="M12,2C6.48,2,2,6.48,2,12s4.48,10,10,10s10-4.48,10-10 S17.52,2,12,2z M9.92,17.93l-4.95-4.95l2.05-2.05l2.9,2.9l7.35-7.35l2.05,2.05L9.92,17.93z" class="style-scope yt-icon"></path>
+                                            </g>
+                                        </svg>
+                                    </span>
+                                {% endfor %}
+                            {% endif %}
+                        </p>
+
+                        <!-- time publish -->
+                        {% set año = article.date|strftime('%Y') %}
+                        {% set mes = article.date|strftime('%m') %}
+                        {% set nombre_mes = article.date|strftime('%B') %}
+                        <time class="entry-date published"
+                              datetime="{{ article.date.isoformat() }}">
+                            <small>
+                                {{ _('Publicado el') }}
+                                {{ article.date|strftime('%a %-d') }}
+                                <a class="text-info" href="{{ SITEURL }}/archives/{{ año }}/{{ mes }}/"
+                                   title="{% trans %}Vídeos de {{ nombre_mes }} de {{ año }}{% endtrans %}">
+                                    {{ nombre_mes }}
+                                </a>
+                                {{ _('de') }}
+                                <a class="text-secondary" href="{{ SITEURL }}/archives/{{ año }}/"
+                                   title="{% trans %}Vídeos de {{ año }}{% endtrans %}">{{ año }}
+                                </a>
+                            </small>
+                        </time>
+                        <!-- /time publish -->
+
+                        <hr class="hr-author">
+                    </div>
+                    <!-- /Author -->
+
+                    <!-- Comments -->
+                    <div id="hashover" class="comments-container mt-4 ml-3">
+                        <script src="/hashover-next/comments.php"></script>
+                        <noscript>
+                            <p>{% trans trimmed abre_enlace='<a href="mailto:heckyel@hyperbola.info?subject=Comentario_«%(titulo_art)s»">'|format(titulo_art=article.title|replace(' ', '%20')), cierra_enlace='</a>' %}
+                                Lo siento, el sistema de comentarios no funciona sin JavaScript. Si
+                                deseas, puedes {{ abre_enlace }} enviar tu comentario por correo
+                                electrónico {{ cierra_enlace }}. El comentario será publicado en el espacio
+                                reservado a comentarios de esta página.{% endtrans %}</p>
+                        </noscript>
+                    </div>
+                    <!--End Comments -->
+
+                </div>
+
+                {% if SHOW_RECENT_POSTS %}
+
+                    <div class="col-md-4">
+                        <!-- article video 1 -->
+
+                        {% for article in articles[:SHOW_RECENT_POSTS] %}
+                            <article class="row justify-content-center align-items-center mt-1">
+                                <!-- video next -->
+                                <div class="col-md-6 mini">
+                                    <a href="{{ SITEURL }}/{{ article.url }}">
+                                        <div class="area">
+                                            <div class="mask">
+
+                                                <div class="vertical-align">
+                                                    <i class="soumaicon play"><svg><use href="{{ SITEURL }}/{{ THEME_STATIC_DIR }}/images/svg/master.svg#play"/></svg></i>
+                                                </div> <!-- End Vertical Align -->
+
+                                            </div> <!-- End Mask / Hover -->
+
+                                            {% if article.image %}
+                                                <img src="{{ SITEURL }}/{{ THEME_STATIC_DIR }}/../wp-content/uploads/article/thumbnail/{{ article.image }}" alt="{{ article.title }}" class="img-fluid">
+                                            {% else %}
+                                                <img src="{{ SITEURL }}/{{ THEME_STATIC_DIR }}/images/video.png" alt="video" class="img-fluid">
+                                            {% endif %}
+
+                                            {% if article.time %}
+                                                <span class="duration">{{ article.time }}</span>
+                                            {% else %}
+                                                <span class="duration">{{ ('00:00') }}</span>
+                                            {% endif %}
+
+                                        </div> <!-- End Area -->
+                                    </a>
+                                </div>
+                                <!-- video next -->
+
+                                <!-- description -->
+                                <div class="col-md-6">
+                                    <h6><a href="{{ SITEURL }}/{{ article.url }}" rel="bookmark" title="{{ _('Ver %(articulo)s', articulo=article.title|striptags) }}">{{ article.title }}</a></h6>
+                                    {% include "article_info_aside.html" %}
+                                </div>
+                            </article>
+                        {% endfor %}
+
+                    </div>
+                {% endif %}
+
+            </div>
+        </div>
+    </main>
+    <!-- End Main -->
+{%- endblock -%}
+
+{% block extend_js %}
+    <!-- Plyr -->
+    <script src="{{ SITEURL }}/{{ THEME_STATIC_DIR }}/modules/plyr/plyr.min.js"
+            integrity="sha512-l6ZzdXpfMHRfifqaR79wbYCEWjLDMI9DnROvb+oLkKq6d7MGroGpMbI7HFpicvmAH/2aQO+vJhewq8rhysrImw=="
+            crossorigin="anonymous"></script>
+    <script src="{{ SITEURL }}/{{ THEME_STATIC_DIR }}/js/play.js"></script>
+    <!-- /Plyr -->
+{% endblock %}
diff --git a/libretube-theme/templates/article_info.html b/libretube-theme/templates/article_info.html
new file mode 100644
index 0000000..cd6e949
--- /dev/null
+++ b/libretube-theme/templates/article_info.html
@@ -0,0 +1,68 @@
+<!-- post footer -->
+<footer class="card-content-footer mb-4">
+    <span class="soumaicon text-info">
+        <svg>
+            <use href="{{ SITEURL }}/{{ THEME_STATIC_DIR }}/images/svg/master.svg#calendar" />
+        </svg>
+    </span>
+    {% set año = article.date|strftime('%Y') %}
+    {% set mes = article.date|strftime('%m') %}
+    {% set nombre_mes = article.date|strftime('%B') %}
+    <time class="entry-date published"
+          datetime="{{ article.date.isoformat() }}" itemprop="datePublished">
+        <small>
+            {{ article.date|strftime('%a %-d') }}
+            <a href="{{ SITEURL }}/archives/{{ año }}/{{ mes }}/"
+               title="{% trans %}Artículos de {{ nombre_mes }} de {{ año }}{% endtrans %}">
+                {{ nombre_mes }}
+            </a>
+            <a href="{{ SITEURL }}/archives/{{ año }}/"
+               title="{% trans %}Artículos de {{ año }}{% endtrans %}">{{ año }}
+            </a>
+        </small>
+    </time>
+
+    {% if article.modified %}
+        <span class="soumaicon text-info">
+            <svg>
+                <use href="{{ SITEURL }}/{{ THEME_STATIC_DIR }}/images/svg/master.svg#calendar" />
+            </svg>
+        </span>
+        <span class="edit-link"
+              title="{{ _('Fecha de modificación') }}">
+            <small class="screen-reader-text">{{ _('Modificado el %(fecha)s'|format(fecha='</small>
+        <time class="updated" datetime="%s"><small>%s</small></time>')|format(article.modified.isoformat(), article.locale_modified)) }}
+        </span>
+    {% endif %}
+
+    {% if not HIDE_AUTHORS and article.authors %}
+        <span class="soumaicon text-info">
+            <svg>
+                <use href="{{ SITEURL }}/{{ THEME_STATIC_DIR }}/images/svg/master.svg#user" />
+            </svg>
+        </span>
+        {% for author in article.authors %}
+            <small itemprop="director" itemscope itemtype="https://schema.org/Person">
+                <a href="{{ SITEURL }}/{{ author.url }}"
+                   title="{% trans %}Autor del artículo{% endtrans %}"
+                   itemprop="name">{{ author }}</a>{% if not loop.last %}, {% endif %}
+            </small>
+        {% endfor %}
+    {% endif %}
+
+    {% import 'translations.html' as translations with context %}
+    {% if translations.translations_for(article) %}
+        <span class="soumaicon text-info">
+            <svg>
+                <use href="{{ SITEURL }}/{{ THEME_STATIC_DIR }}/images/svg/master.svg#translate" />
+            </svg>
+        </span>
+        <small>
+            {{ translations.translations_for(article) }}
+        </small>
+    {% else %}
+    {% endif %}
+
+</footer>
+<!-- end of post footer -->
+<!-- /.post-info -->
diff --git a/libretube-theme/templates/article_info_aside.html b/libretube-theme/templates/article_info_aside.html
new file mode 100644
index 0000000..f0b7e14
--- /dev/null
+++ b/libretube-theme/templates/article_info_aside.html
@@ -0,0 +1,54 @@
+<!-- post footer -->
+<div class="card-content-footer">
+    <span class="soumaicon text-info">
+        <svg>
+            <use href="{{ SITEURL }}/{{ THEME_STATIC_DIR }}/images/svg/master.svg#calendar" />
+        </svg>
+    </span>
+    {% set año = article.date|strftime('%Y') %}
+    {% set mes = article.date|strftime('%m') %}
+    {% set nombre_mes = article.date|strftime('%B') %}
+    <time class="entry-date published"
+          datetime="{{ article.date.isoformat() }}">
+        <small>
+            {{ article.date|strftime('%a %-d') }}
+            <a class="text-info" href="{{ SITEURL }}/archives/{{ año }}/{{ mes }}/"
+               title="{% trans %}Artículos de {{ nombre_mes }} de {{ año }}{% endtrans %}">
+                {{ nombre_mes }}
+            </a>
+            <a class="text-secondary" href="{{ SITEURL }}/archives/{{ año }}/"
+               title="{% trans %}Artículos de {{ año }}{% endtrans %}">{{ año }}
+            </a>
+        </small>
+    </time>
+
+    {% if not HIDE_AUTHORS and article.authors %}
+        <span class="soumaicon text-info">
+            <svg>
+                <use href="{{ SITEURL }}/{{ THEME_STATIC_DIR }}/images/svg/master.svg#user" />
+            </svg>
+        </span>
+        {% for author in article.authors %}
+            <small>
+                <a class="text-white" href="{{ SITEURL }}/{{ author.url }}"
+                   title="{% trans %}Autor del artículo{% endtrans %}">{{ author }}</a>{% if not loop.last %}, {% endif %}
+            </small>
+        {% endfor %}
+    {% endif %}
+
+    {% import 'translations.html' as translations with context %}
+    {% if translations.translations_for(article) %}
+        <span class="soumaicon text-info">
+            <svg>
+                <use href="{{ SITEURL }}/{{ THEME_STATIC_DIR }}/images/svg/master.svg#translate" />
+            </svg>
+        </span>
+        <small>
+            {{ translations.translations_for(article) }}
+        </small>
+    {% else %}
+    {% endif %}
+
+</div>
+<!-- end of post footer -->
+<!-- /.post-info -->
diff --git a/libretube-theme/templates/author.html b/libretube-theme/templates/author.html
new file mode 100644
index 0000000..ba1b2d9
--- /dev/null
+++ b/libretube-theme/templates/author.html
@@ -0,0 +1,34 @@
+{% extends "base.html" %}
+
+{% block head %}
+    {% block title %}
+        <title>{{ _('Artículos escritos por %(author)s en %(sitename)s', author=author, sitename=SITENAME) }}</title>
+    {% endblock %}
+    {{ super() }}
+    {% block seo %}
+        <!-- Meta Author -->
+        <meta name="author" content="{{ author }}"/>
+        <meta name="description" content="{{ _('Artículos escritos por %(author)s en %(sitename)s', author=author, sitename=SITENAME) }}"/>
+        <meta name="keywords" content="{% trans %}articulista,artículos,author,autor {{ author }},escritor,{{ author }}{% endtrans %}"/>
+        <style>
+        .card-content-header {
+            margin-bottom: 2rem;
+        }
+        </style>
+    {% endblock %}
+{% endblock %}
+
+{% block menu_header %}{% endblock menu_header %}
+
+{% block content %}
+    <!-- title -->
+    <div class="row">
+        <div class="col-md-12 mx-auto text-justify">
+            <hr>
+            <h4 class="tab">{% trans %}Autor: {{ author }}{% endtrans %}</h4>
+            <hr>
+        </div>
+    </div>
+    <!-- title -->
+    {{ super() }}
+{% endblock %}
diff --git a/libretube-theme/templates/authors.html b/libretube-theme/templates/authors.html
new file mode 100644
index 0000000..f7428b6
--- /dev/null
+++ b/libretube-theme/templates/authors.html
@@ -0,0 +1,72 @@
+{% extends "base.html" %}
+
+{% block head %}
+    {% block title %}
+        <title>{{ _('Créditos de %(sitename)s', sitename=SITENAME) }}</title>
+    {% endblock %}
+    {{ super() }}
+    {% block seo %}
+        <meta name="description" content="{{ _('Lista de autores de %(sitename)s', sitename=SITENAME) }}"/>
+        <meta name="keywords" content="{{ _('articulistas, autores, colaboradores, escritores, lista de autores') }}"/>
+
+        <!-- OpenGraph -->
+        <meta property="og:type" content="article"/>
+        <meta property="og:title" content="{{ _('Lista de autores de %(sitename)s', sitename=SITENAME) }}"/>
+        <meta property="og:description" content="{{ SITESUBTITLE }}"/>
+        <meta property="og:site_name" content="{{ SITENAME }}"/>
+
+        <!-- Twitter -->
+        <meta name="twitter:card" content="summary"/>
+        <meta name="twitter:title" content="{{ _('Lista de autores de %(sitename)s', sitename=SITENAME) }}"/>
+        <meta name="twitter:description" content="{{ SITESUBTITLE }}"/>
+    {% endblock %}
+{% endblock %}
+
+{% block content %}
+    <!-- Main -->
+    <div class="row mt-6 mt-10">
+        <div class="col-md-9 mx-auto text-justify">
+            <!-- dinamic page content  -->
+            <div class="ml-3">
+                <h2>{{ _('Artículos de vídeo') }}</h2>
+                <ul class="ml-3">
+                    {%- for author, articles in authors|sort %}
+                        <li>
+                            <a href="{{ SITEURL }}/{{ author.url }}"
+                               title="{% trans %}Artículos escritos por {{ author }}{% endtrans %}">{{ author }}</a>
+                            ({{ articles|count }})
+                        </li>
+                    {% endfor %}
+                </ul>
+
+                <h2>{{ _('Programación') }}</h2>
+                <ul class="ml-3">
+                    <li><a href="https://www.freakspot.net/" title="{{ _('Sitio para gente Libre') }}">Jorge Maldonado Ventura</a></li>
+                    <li><a href="https://heckyel.ga/" title="{{ _('Sitio web de Jesús E.') }}">Jesús E.</a></li>
+                </ul>
+
+                <h2>{{ _('Traducción') }}</h2>
+                <ul class="ml-3">
+                    <li><a href="https://rosenzweig.io/" title="{{ _('Sitio web de Alyssa Rosenzweig') }}">Alyssa Rosenzweig</a></li>
+                    <li>Jorge Maldonado Ventura</li>
+                </ul>
+
+                <h2>{{ _('Software que usa la página') }}</h2>
+                {% set software = (('https://nginx.org/', 'Nginx'),
+                    ('http://babel.pocoo.org/', 'Babel'),
+                    ('https://pypi.org/project/beautifulsoup4/', 'BeautifulSoup4'),
+                    ('https://www.python.org/', 'Python'),
+                    ('https://blog.getpelican.com/', 'Pelican'),
+                    ('https://pypi.org/project/Markdown/', 'Markdown'),
+                    ('https://lablibre.tuxfamily.org/pages/librejs.html', _('Algunos programas de JavaScript'),)) %}
+                <ul class="ml-3">
+                    {% for program in software %}
+                        <li><a href="{{ program[0] }}" title="{{ _('Sitio web de %(programa)s', programa=program[1]) }}">{{ program[1] }}</a></li>
+                    {% endfor %}
+                </ul>
+            </div>
+            <!-- End dinamic page content  -->
+        </div>
+    </div>
+    <!-- End Main -->
+{% endblock %}
diff --git a/libretube-theme/templates/base.html b/libretube-theme/templates/base.html
new file mode 100644
index 0000000..51c3cef
--- /dev/null
+++ b/libretube-theme/templates/base.html
@@ -0,0 +1,203 @@
+<!DOCTYPE html>
+<html lang="{% block html_lang %}{{ DEFAULT_LANG }}{% endblock %}">
+    <head prefix="og: https://ogp.me/ns{% if article %}/video{% endif %}#"{% if article %} itemscope itemtype="https://schema.org/VideoObject"{% endif %}>
+        {% block head %}
+            <!-- Meta Base -->
+            <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="HandheldFriendly" content="True"/>
+            {% block extra_head %}
+            {% endblock %}
+            <!-- Bootstrap 4.3.1 -->
+            <link href="{{ SITEURL }}/{{ THEME_STATIC_DIR }}/css/bootstrap/bootstrap.css" rel="stylesheet"
+                  integrity="sha384-63+VK53+oFYHzIqG3ljBEZ1Pr9+l0uKU+6UK4YsgNZtVkXQQtsvr0TRcBxncV0gG"/>
+            <!-- Main style -->
+            <link href="{{ SITEURL }}/{{ THEME_STATIC_DIR }}/css/styles.css" rel="stylesheet"/>
+            <!-- favicon -->
+            <link rel="icon" type="image/png" sizes="192x192" href="{{ SITEURL }}/{{ THEME_STATIC_DIR }}/images/favicon/favicon-192x192.png"/>
+            <link rel="icon" type="image/png" sizes="96x96" href="{{ SITEURL }}/{{ THEME_STATIC_DIR }}/images/favicon/favicon-96x96.png"/>
+            <link rel="icon" type="image/png" sizes="32x32" href="{{ SITEURL }}/{{ THEME_STATIC_DIR }}/images/favicon/favicon-32x32.png"/>
+            <link rel="icon" type="image/png" sizes="16x16" href="{{ SITEURL }}/{{ THEME_STATIC_DIR }}/images/favicon/favicon-16x16.png"/>
+        {% endblock head %}
+    </head>
+
+    <body>
+
+        <div class="container-fluid">
+
+            <div class="row ml-1">
+                <header class="fixed-top">
+                    <div class="col-md-12">
+                        <div class="row mt-2 mb-2">
+                            <div class="col-lg-2 align-self-center text-center">
+                                <a href="{{ SITEURL }}/" rel="home"><img class="logo" src="{{ SITEURL }}/{{ THEME_STATIC_DIR }}/images/logo.svg" alt="logo"></a>
+                            </div>
+                            <div class="col-lg-5 align-self-center">
+                                <form action="{{ SITEURL }}/buscar.php"><input placeholder="{{ _('Escribe para buscar...') }}" type="search" name="q" required></form>
+                            </div>
+
+                            <div class="col-lg-5 menu-profile">
+                                <ul>
+                                    <li>
+                                        <div class="image-profile-menu">
+                                            <img src="{{ SITEURL }}/{{ THEME_STATIC_DIR }}/images/videocamera.svg" alt="profile">
+                                        </div>
+                                    </li>
+                                    <li class="ml-2">{{ _('VideoTeca')}}</li>
+                                </ul>
+                            </div>
+                            <!-- End login -->
+                        </div>
+                    </div>
+                </header> <!-- End Header -->
+            </div> <!-- End Row -->
+
+            <div class="row mt-5 mt-8">
+
+                <div class="col-md-12">
+
+                    {% block menu_header %}
+                        {% if DISPLAY_PAGES_ON_MENU %}
+                            <hr>
+                            <nav>
+                                <ul class="tab">
+                                    <li class="{% if output_file == 'index.html' %}active{% endif %}"><a href="{{ SITEURL }}/" class="navbar-item is-tab">{{ _('Inicio') }}</a></li>
+                                    {% for p in pages %}
+                                        <li class="navbar-item is-tab {% if p == page %} active{% endif %}"><a href="{{ SITEURL }}/{{ p.url }}">{{ p.title }}</a></li>
+                                    {% endfor %}
+                                    <li class="navbar-item is-tab {% if output_file == ARCHIVES_SAVE_AS %} active {% endif %}"><a href="{{ SITEURL }}/{{ ARCHIVES_URL }}">{{ _('Archivos') }}</a></li>
+                                </ul> <!-- End Tabs -->
+                            </nav>
+                            <hr>
+                        {% endif %}
+                    {% endblock menu_header %}
+
+                    {%- block content -%}
+
+                        <!-- Main videos -->
+                        <main class="row main-videos">
+
+                            <div class="col-md-12">
+
+                                <div class="row">
+                                    {% for article in articles_page.object_list %}
+                                        <article class="col-md-3 video" itemscope itemtype="https://schema.org/Movie">
+                                            <a href="{{ SITEURL }}/{{ article.url }}" title="{{ article.title }}">
+                                                <div class="area">
+                                                    <div class="mask">
+
+                                                        <div class="vertical-align">
+                                                            <i class="soumaicon play"><svg><use href="{{ SITEURL }}/{{ THEME_STATIC_DIR }}/images/svg/master.svg#play"/></svg></i>
+                                                            <p>{{ _('Ver ahora')}}</p>
+                                                        </div> <!-- End Vertical Align -->
+
+                                                    </div> <!-- End Mask / Hover -->
+
+                                                    {% if article.image %}
+                                                        <img itemprop="image" src="{{ SITEURL }}/{{ THEME_STATIC_DIR }}/../wp-content/uploads/article/thumbnail/{{ article.image }}" alt="{{ article.title }}" class="img-fluid">
+                                                    {% else %}
+                                                        <img itemprop="image" src="{{ SITEURL }}/{{ THEME_STATIC_DIR }}/images/video.png" alt="video" class="img-fluid">
+                                                    {% endif %}
+
+                                                    {% if article.time %}
+                                                        <span class="duration">{{ article.time }}</span>
+                                                    {% else %}
+                                                        <span class="duration">{{ ('00:00') }}</span>
+                                                    {% endif %}
+
+                                                </div> <!-- End Area -->
+                                            </a>
+
+                                            <h2 itemprop="name"><a href="{{ SITEURL }}/{{ article.url }}" rel="bookmark" title="{{ _('Ver %(articulo)s', articulo=article.title|striptags) }}">{{ article.title }}</a></h2>
+
+                                            <!-- post footer -->
+                                            {% include "article_info.html" %}
+                                            <!-- end of post footer -->
+
+                                        </article> <!-- End Col-md-6 -->
+                                    {% endfor %}
+                                </div>
+
+                            </div>
+                        </main>
+                        <!-- End Main Videos -->
+
+                        <!-- Pagination -->
+                        {% include "pagination.html" %}
+                        <!--/End Pagination -->
+
+                    {%- endblock -%}
+
+                </div>
+            </div> <!-- End Row -->
+            <hr>
+            <footer>
+                <ul>
+                    <!-- About -->
+                    {% if DEFAULT_LANG == 'eo' %}
+                        <li><a href="{{ SITEURL }}/pages/acerca-de.html">{{ 'Pri' }}</a></li>
+                    {% elif DEFAULT_LANG == 'en' %}
+                        <li><a href="{{ SITEURL }}/pages/acerca-de.html">{{ 'About' }}</a></li>
+                    {% else %}
+                        <li><a href="{{ SITEURL }}/pages/acerca-de.html">{{ 'Acerca de' }}</a></li>
+                    {% endif %}
+                    <!-- /About -->
+
+                    <!-- Developers -->
+                    {% if DEFAULT_LANG == 'eo' %}
+                        <li><a href="{{ SITEURL }}/pages/créditos/">{{ 'Kreditoj' }}</a></li>
+                    {% elif DEFAULT_LANG == 'en' %}
+                        <li><a href="{{ SITEURL }}/pages/créditos/">{{ 'Credits' }}</a></li>
+                    {% else %}
+                        <li><a href="{{ SITEURL }}/pages/créditos/">{{ 'Créditos' }}</a></li>
+                    {% endif %}
+                    <!-- /Developers -->
+                </ul>
+                <ul>
+                    <!-- Política de Uso -->
+                    {% if DEFAULT_LANG == 'eo' %}
+                        <li><a href="{{ SITEURL}}/pages/regularo-pri-uzado.html">{{ _('Política de uso') }}</a></li>
+                    {% else %}
+                        <li><a href="{{ SITEURL}}/pages/política-de-uso.html">{{ _('Política de uso') }}</a></li>
+                    {% endif %}
+                    <!-- /Política de Uso -->
+
+                    <!-- LibreJS -->
+                    <li><a href="{{ SITEURL }}/pages/librejs.html" data-jslicense="1">{{ _('Licencias de JavaScript') }}</a></li>
+                    <!-- /LibreJS -->
+
+                    <!-- source code -->
+                    <li><a href="{{ SOURCE_URL }}" rel="noopener noreferrer" target="_blank">{{ _('Código fuente') }}</a></li>
+                    <!-- /source code -->
+                </ul>
+
+                <h6>Copyleft &copy; 2019 - 2022 {{ SITENAME }} Lbtd.</h6>
+
+                {% if CURRENT_VERSION and CURRENT_BRANCH %}
+                    <h6>{{ _('Versión actual:') }} {{ CURRENT_VERSION }} @ {{ CURRENT_BRANCH }}</h6>
+                {% endif %}
+
+            </footer> <!-- End Footer -->
+
+        </div>
+        {% block extend_js %}
+        {% endblock %}
+
+        {% if article %}
+            {% if article.js %}
+                {% for script in article.js %}
+                    {{ script }}
+                {% endfor %}
+            {% endif %}
+        {% endif %}
+
+        {% if page %}
+            {% if page.js %}
+                {% for script in page.js %}
+                    {{ script }}
+                {% endfor %}
+            {% endif %}
+        {% endif %}
+    </body>
+</html>
diff --git a/libretube-theme/templates/categories.html b/libretube-theme/templates/categories.html
new file mode 100644
index 0000000..f945364
--- /dev/null
+++ b/libretube-theme/templates/categories.html
@@ -0,0 +1,40 @@
+{% extends "base.html" %}
+
+{% block head %}
+    {% block title %}
+        <title>{{ _('Lista de categorías de %(sitename)s', sitename=SITENAME)}}</title>
+    {% endblock %}
+    {{ super() }}
+    <meta name="description" content="{{ _('Lista de categorías de %(sitename)s', sitename=SITENAME) }}"/>
+    <meta name="keywords" content="{{ _('categorías') }}">
+    <style>
+     .card-content-header {
+         margin-bottom: 2rem;
+     }
+    </style>
+{% endblock %}
+
+{% block content %}
+    <div class="col-md-12">
+        <div class="row">
+            <div class="col-md-12">
+                <h3 class="text-center">{{ _('Lista de categorías') }}</h3>
+            </div>
+        </div>
+        <div class="row">
+            <div class="col-md-4">
+                <!-- empty space -->
+            </div>
+            <div class="col-md-4">
+                <ul>
+                    {% for category, articles in categories %}
+                        <li><a href="{{ SITEURL }}/{{ category.url }}">{{ category }}</a></li>
+                    {% endfor %}
+                </ul>
+            </div>
+            <div class="col-md-4">
+                <!-- empty space -->
+            </div>
+        </div>
+    </div>
+{% endblock %}
diff --git a/libretube-theme/templates/category.html b/libretube-theme/templates/category.html
new file mode 100644
index 0000000..b6fc9d5
--- /dev/null
+++ b/libretube-theme/templates/category.html
@@ -0,0 +1,17 @@
+{% extends "base.html" %}
+
+{% block head %}
+    {% block title %}
+        <title>{{ category.name }} - {{SITENAME}}</title>
+    {% endblock %}
+    {{ super() }}
+{% endblock %}
+
+{% block content %}
+    <div class="col-md-12">
+        <!-- title category -->
+        <h3 class="text-center">{{ category }}</h3>
+        <!-- /title category -->
+    </div>
+    {{ super() }}
+{% endblock %}
diff --git a/libretube-theme/templates/index.html b/libretube-theme/templates/index.html
new file mode 100644
index 0000000..e8746c7
--- /dev/null
+++ b/libretube-theme/templates/index.html
@@ -0,0 +1,37 @@
+{% extends "base.html" %}
+
+{% block head %}
+    {% block title %}
+        <title>{% if articles_page.number != 1 %}{{ _('Página') }} {{ articles_page.number }} | {% endif %}{{ SITENAME }}</title>
+    {% endblock %}
+    {{ super() }}
+    {% if lang_siteurls and articles_page.number == 1 %}
+        {% for lang, url in lang_siteurls.items() %}
+            <link rel="alternate" hreflang="{{ lang }}" href="{{ url }}"/>
+        {% endfor %}
+    {% endif %}
+
+    {% block seo %}
+        {% set SITE_DESCRIPTION = _('Videoteca de software libre brindando avance tecnológico') %}
+        <!-- Meta Index -->
+        <meta name="description" content="{{ SITE_DESCRIPTION }}">
+
+        <!-- OpenGraph -->
+        <meta property="og:title" content="{{ SITENAME }}">
+        <meta property="og:description" content="{{ SITE_DESCRIPTION }}">
+        <meta property="og:url" content="{{ SITEURL }}">
+        <meta property="og:image" content="{{ SITEURL }}/{{ THEME_STATIC_DIR }}/images/favicon/favicon-96x96.png"/>
+        <meta property="og:type" content="website">
+
+        <!-- Twitter -->
+        <meta name="twitter:card" content="summary_large_image"/>
+        <meta name="twitter:title" content="{{ SITENAME }}"/>
+        <meta name="twitter:description" content="{{ SITE_DESCRIPTION }}"/>
+        <meta name="twitter:image" content="{{ SITEURL }}/{{ THEME_STATIC_DIR }}/images/favicon/favicon-96x96.png"/>
+    {% endblock %}
+{% endblock %}
+
+{% block sitename %}
+    <h1 class="title is-1 is-spaced">{{ SITENAME }}</h1>
+    <h4 class="subtitle is-4">{{ SITESUBTITLE }}</h4>
+{% endblock %}
diff --git a/libretube-theme/templates/page.html b/libretube-theme/templates/page.html
new file mode 100644
index 0000000..47db027
--- /dev/null
+++ b/libretube-theme/templates/page.html
@@ -0,0 +1,49 @@
+{% extends "base.html" %}
+
+{% block html_lang %}{{ page.lang }}{% endblock%}
+
+{% block head %}
+    {% block title %}
+        <title>{{ page.title }} - {{SITENAME}}</title>
+    {% endblock %}
+    {% import 'translations.html' as translations with context %}
+    {% if translations.entry_hreflang(page) %}
+        {{ translations.entry_hreflang(page) }}
+    {% endif %}
+    {{ super() }}
+    {% if page.styles %}
+        {% for style in page.styles %}
+            {{ style }}
+        {% endfor %}
+    {% endif %}
+    {% block seo %}
+        <!-- Meta Page -->
+        <meta name="description" content="{{ SITENAME }} &ndash; {{ SITESUBTITLE }}"/>
+        <meta name="author" content="{{ page.author }}"/>
+        <!-- OpenGraph -->
+        <meta property="og:type" content="article"/>
+        <meta property="og:title" content="{{ page.title }}"/>
+        <meta property="og:description" content="{{ SITESUBTITLE }}"/>
+        <meta property="og:site_name" content="{{ SITENAME }}"/>
+        <meta property="og:url" content="{{ SITEURL }}/{{ page.url }}"/>
+        <!-- Twitter -->
+        <meta name="twitter:card" content="summary"/>
+        <meta name="twitter:title" content="{{ page.title }}"/>
+        <meta name="twitter:description" content="{{ SITESUBTITLE }}"/>
+        <meta name="twitter:url" content="{{ SITEURL }}/{{ page.url }}"/>
+    {% endblock %}
+{% endblock head %}
+
+{%- block content -%}
+    <!-- Main -->
+    <div class="row mt-10">
+        <div class="col-md-9 mx-auto text-justify">
+            <!-- dinamic page content  -->
+            <div class="ml-3">
+                {{ page.content }}
+            </div>
+            <!-- End dinamic page content  -->
+        </div>
+    </div>
+    <!-- End Main -->
+{%- endblock -%}
diff --git a/libretube-theme/templates/pagination.html b/libretube-theme/templates/pagination.html
new file mode 100644
index 0000000..ec99498
--- /dev/null
+++ b/libretube-theme/templates/pagination.html
@@ -0,0 +1,78 @@
+{% if DEFAULT_PAGINATION %}
+    <nav class="mt-5">
+        <ul class="pagination pagination-circle pg-red justify-content-center">
+
+            <!-- Previous -->
+            {% if articles_page.has_previous() %}
+                <li class="page-item">
+                    <a href="{{ SITEURL }}/{{ articles_previous_page.url }}" class="page-link" aria-label="Previous">
+                        <span aria-hidden="true">&laquo;</span>
+                    </a>
+                </li>
+            {% else %}
+                <li class="page-item disabled">
+                    <a class="page-link" aria-label="Previous">
+                        <span aria-hidden="true">&laquo;</span>
+                    </a>
+                </li>
+            {% endif %}
+            <!-- /Previous -->
+
+            {% for num in range(1, 1 + articles_paginator.num_pages) %}
+                {% set print_number = False %}
+                {% set dots_before = True %}
+                {% if num == 1 %}
+                    {% set print_number = True %}
+                    {% set dots_before = False %}
+                {% elif (articles_page.number - PAGINATOR_LIMIT / 2) <= num < (articles_page.number - PAGINATOR_LIMIT / 2 + 1) %}
+                    {% set print_number = True %}
+                    {% if num == 2 %}
+                        {% set dots_before = False %}
+                    {% endif %}
+                {% elif (articles_page.number - PAGINATOR_LIMIT / 2 + 1) <= num <= (articles_page.number + PAGINATOR_LIMIT / 2) %}
+                    {% set print_number = True %}
+                    {% set dots_before = False %}
+                {% elif num == articles_paginator.num_pages %}
+                    {% set print_number = True %}
+                    {% if (articles_page.number + PAGINATOR_LIMIT / 2) <= num <= (articles_page.number + PAGINATOR_LIMIT / 2 + 1)%}
+                        {% set dots_before = False %}
+                    {% endif %}
+                {% endif %}
+                {% if print_number %}
+                    {% if dots_before %}
+                        <li><span class="pagination-ellipsis">&hellip;</span></li>
+                    {% endif %}
+                    {% if num == articles_page.number %}
+                        <li class="page-item active">
+                            <a class="page-link"
+                               aria-label="Page {{ num }}">{{ num }}</a>
+                        </li>
+                    {% else %}
+
+                        <li class="page-item">
+                            <a class="page-link" aria-label="Goto page {{ num }}"
+                               href="{{ SITEURL }}/{{ articles_paginator.page(num).url }}">{{ num }}
+                            </a>
+                        </li>
+                    {% endif %}
+                {% endif %}
+            {% endfor %}
+
+            <!-- Next -->
+            {% if articles_page.has_next() %}
+                <li class="page-item">
+                    <a href="{{ SITEURL }}/{{ articles_next_page.url }}" class="page-link" aria-label="Next">
+                        <span aria-hidden="true">&raquo;</span>
+                    </a>
+                </li>
+            {% else %}
+                <li class="page-item disabled">
+                    <a class="page-link" aria-label="Next">
+                        <span aria-hidden="true">&raquo;</span>
+                    </a>
+                </li>
+            {% endif %}
+            <!-- /Next -->
+        </ul>
+    </nav>
+{% endif %}
diff --git a/libretube-theme/templates/period_archives.html b/libretube-theme/templates/period_archives.html
new file mode 100644
index 0000000..3ff1ca2
--- /dev/null
+++ b/libretube-theme/templates/period_archives.html
@@ -0,0 +1,55 @@
+{% extends "base.html" %}
+
+{% block head %}
+    {% block title %}
+        {% set len_period = period|length %}
+        {%- if len_period == 1 -%}
+            <title>{{ _('Archivos de %(año)d', año=period[0]) }} - {{SITENAME}}</title>
+        {%- elif len_period == 2 -%}
+            <title>{{ _('Archivos de %(mes)s de %(año)d', año=period[0], mes=period[1]) }} - {{SITENAME}}</title>
+        {%- elif len_period == 3 -%}
+            <title>{{ _('Archivos del %(dia)d de %(mes)s de %(año)d', año=period[0], mes=period[1], dia=period[2]) }} - {{SITENAME}}</title>
+        {%- endif -%}
+    {% endblock %}
+    {{ super() }}
+{% endblock %}
+
+{% block menu_header %}{% endblock menu_header %}
+
+{% block content %}
+    <!-- title -->
+    <div class="row mt-10">
+        <div class="col-md-12 mx-auto text-justify">
+            <hr>
+            <h4 class="tab">
+                {% set len_period = period|length %}
+                {%- if len_period == 1 -%}
+                    {{ _('Archivos de %(año)d', año=period[0]) }}
+                {%- elif len_period == 2 -%}
+                    {{ _('Archivos de %(mes)s de %(año)d', año=period[0], mes=period[1]) }}
+                {%- elif len_period == 3 -%}
+                    {{ _('Archivos del %(dia)d de %(mes)s de %(año)d', año=period[0], mes=period[1], dia=period[2]) }}
+                {%- endif -%}
+            </h4>
+            <hr>
+        </div>
+    </div>
+    <!-- title -->
+
+    <!-- Main -->
+    <div class="row">
+        <div class="col-md-9 mx-auto text-justify">
+            <!-- dinamic page content  -->
+            <div>
+                <dl>
+                    {% for article in dates %}
+                        <dt>{{ article.date|strftime('%A %-d de %B de %Y a las %H:%M %z') }}</dt>
+                        <dd><a href="{{ SITEURL }}/{{ article.url }}">{{ article.title }}</a></dd>
+                    {% endfor %}
+                </dl>
+            </div>
+            <!-- End dinamic page content  -->
+        </div>
+    </div>
+    <!-- End Main -->
+{% endblock %}
diff --git a/libretube-theme/templates/tag.html b/libretube-theme/templates/tag.html
new file mode 100644
index 0000000..a6e0f47
--- /dev/null
+++ b/libretube-theme/templates/tag.html
@@ -0,0 +1,14 @@
+{% extends "base.html" %}
+{% block head %}
+    {% block title %}<title>#{{ tag.name }} - {{SITENAME}}</title>{% endblock title %}
+    {{ super() }}
+    <meta name="robots" content="noindex, follow" />
+{% endblock %}
+{% block content %}
+    <div class="col-md-12">
+        <!-- title tag -->
+        <h3 class="text-center">#{{ tag }}</h3>
+        <!-- /title tag -->
+    </div>
+    {{ super() }}
+{% endblock %}
diff --git a/libretube-theme/templates/tags.html b/libretube-theme/templates/tags.html
new file mode 100644
index 0000000..9357565
--- /dev/null
+++ b/libretube-theme/templates/tags.html
@@ -0,0 +1,35 @@
+{% extends "base.html" %}
+
+{% block head %}
+    {% block title %}
+        <title>{{ _('Lista de etiquetas de %(sitename)s', sitename=SITENAME) }}</title>
+    {% endblock %}
+    {{ super() }}
+    <meta name="description" content="{{ _('Lista de etiquetas de %(sitename)s', sitename=SITENAME) }}"/>
+    <meta name="keywords" content="{{ _('etiquetas,palabras clave') }}">
+{% endblock %}
+
+{% block content %}
+    <div class="col-md-12">
+        <div class="row">
+            <div class="col-md-12">
+                <h3 class="text-center">{{ _('Lista de etiquetas') }}</h3>
+            </div>
+        </div>
+        <div class="row">
+            <div class="col-md-4">
+                <!-- empty space -->
+            </div>
+            <div class="col-md-4">
+                <ul>
+                    {%- for tag, articles in tags|sort %}
+                        <li><a href="{{ SITEURL }}/{{ tag.url }}">{{ tag }}</a> ({{ articles|count }})</li>
+                    {% endfor %}
+                </ul>
+            </div>
+            <div class="col-md-4">
+                <!-- empty space -->
+            </div>
+        </div>
+    </div>
+{% endblock %}
diff --git a/libretube-theme/templates/translations.html b/libretube-theme/templates/translations.html
new file mode 100644
index 0000000..e8d2665
--- /dev/null
+++ b/libretube-theme/templates/translations.html
@@ -0,0 +1,16 @@
+{% macro translations_for(article) %}
+    {% if article.translations %}
+        {{ _('Traducciones:') }}
+        {% for translation in article.translations %}
+            <a href="{{ SITEURL }}/{{ translation.url }}" hreflang="{{ translation.lang }}">{{ LANGUAGE_CODES[translation.lang] }}</a>{% if not loop.last %},{% endif %}
+        {% endfor %}
+    {% endif %}
+{% endmacro %}
+
+{% macro entry_hreflang(entry) %}
+    {% if entry.translations %}
+        {% for translation in entry.translations %}
+            <link rel="alternate" hreflang="{{ translation.lang }}" href="{{ SITEURL }}/{{ translation.url }}">
+        {% endfor %}
+    {% endif %}
+{% endmacro %}