Allow to configure menu items in menu bar via MENUITEMS

documentation/content/Components/menu-items.md

@@ -0,0 +1,35 @@
+---
+Title: Configuring Menu Items
+Tags: "pelican-theme, pelican-plugin, menu items"
+Category: Components
+Date: "2021-09-14 14:00"
+Slug: configuring-menu-items
+Comment_id: x4jitcv-configuring-menu-items
+Subtitle: null
+Summary: Elegant can be configured to provide custom menu items for the site.
+Keywords: "menu items, configuration"
+Authors: Pablo Iranzo Gómez
+modified: "2021-09-14T13:07:03.797Z"
+---
+
+Pelican allows to configure via the `pelicanconf.py` configuration file the variable `MENUITEMS`
+
+When no configuration is set, the Menu will show:
+
+- Categories
+- Tags
+- Archives
+
+Additionally Pages can also be shown if configured via the `DISPLAY_PAGES_ON_MENU` variable, but, if we wan to configure the default list from above, we can define the pages like:
+
+```py
+    MENUITEMS = [ ('Categories', "{{ SITEURL }}/{{ CATEGORIES_URL }}" ), ('Tags', "{{ SITEURL }}/{{ TAGS_URL }}"), ('Archives', "{{ SITEURL }}/{{ ARCHIVES_URL }}") ] %}
+```
+
+For example:
+
+```py
+    MENUITEMS = [ ('My Twitter', "https://twitter.com/meme" ), ('My tech blog', "https://example.com/tech") ] %}
+```
+
+And those new entries will appear instead of the default

templates/_includes/_defaults.html

@@ -236,3 +236,9 @@
 {% else %}
 {% set SHARE_LINKS = SHARE_LINKS %}
 {% endif %}
+
+{% if not MENUITEMS %}
+{% set MENUITEMS = [ ('Categories', "{{ SITEURL }}/{{ CATEGORIES_URL }}" ), ('Tags', "{{ SITEURL }}/{{ TAGS_URL }}"), ('Archives', "{{ SITEURL }}/{{ ARCHIVES_URL }}") ] %}
+{% else %}
+{% set MENUITEMS = MENUITEMS %}
+{% endif %}

templates/base.html

@@ -94,11 +94,15 @@
                                 <li {% if p == page %} class="active"{% endif %}><a href="{{ SITEURL }}/{{ p.url }}">{{ p.title }}</a></li>
                                 {% endfor %}
                                 {% endif %}
-                                {% from '_includes/_defaults.html' import TAGS_URL, CATEGORIES_URL, ARCHIVES_URL, SEARCH_URL with context %}
-                                <li {% if page_name == 'categories' %} class="active"{% endif %}><a href="{{ SITEURL }}/{{ CATEGORIES_URL }}">Categories</a></li>
-                                <li {% if page_name == 'tags' %} class="active"{% endif %}><a href="{{ SITEURL }}/{{ TAGS_URL }}">Tags</a></li>
-                                <li {% if page_name == 'archives' %} class="active"{% endif %}><a href="{{ SITEURL }}/{{ ARCHIVES_URL }}">Archives</a></li>
+
+                                {% from '_includes/_defaults.html' import MENUITEMS, SEARCH_URL with context %}
+                                {% if MENUITEMS %}
+                                {% for menuname, menuurl  in MENUITEMS %}
+                                <li {% if page_name == menuname %} class="active"{% endif %}><a href="{{ menuurl }}">{{ menuname }}</a></li>
+                                {% endfor %}
+                                {% endif %}
                                 <li><form class="navbar-search" action="{{ SITEURL }}/{{ SEARCH_URL }}" onsubmit="return validateForm(this.elements['q'].value);"> <input type="text" class="search-query" placeholder="Search" name="q" id="tipue_search_input"></form></li>
+
                             </ul>
                         </div>
                     </div>