We want to have a navigation bar with an active navigation item. It’s easy to archive with Jinja2.

Read More

templates/base.html

We can generate navigation items using a list of predefined href,id and caption.

(...)
<header>
    <nav class="navbar navbar-expand-lg navbar-dark fixed-top bg-dark">
        <a class="navbar-brand" href="#">TelegramBot</a>
        <ul class="navbar-nav mr-auto">
        {% set navbar_menus = [
        ('/', 'home', 'Home'),
        ('/about', 'about', 'About'),
        ] -%}
        {% set active_page = active_page|default('home') -%}
        {% for href, id, caption in navbar_menus %}
            <li class="nav-item">
                <a class="nav-link {% if id == active_page %} active {% endif%}" href="{{ href }}">
                    {{ caption }}
                </a>
            </li>
        {% endfor %}
        </ul>
    </nav>
</header>
<main role="main" class="container">
    {% block main_content %}
    {% endblock main_content %}
</main>

home.html

{% extends "base.html" %}
{% set active_page = "about" %}

{% block main_content %}
<h1 class="mt-5">I'm Telegram Bot</h1>
{% endblock main_content %}

about.html

{% extends "base.html" %}
{% set active_page = "about" %}

{% block main_content %}
<h1 class="mt-5">I'm Telegram Bot</h1>
{% endblock main_content %}

handlers/base.py

class MainPage(Handler):
    def get(self):
        kwargs = {
            'title': 'Home',
        }
        self.render_template('home.html', **kwargs)


class AboutPage(Handler):
    def get(self):
        kwargs = {
            'title': 'About',
        }
        self.render_template('about.html', **kwargs)

Result

Home Page About Page