I'm new to twig and I'm having some problems.
Here is my question:
I have 3 twig templates:
base.html.twig which I extend in home.html.twig and header / basic.html.twig included in home.html.twig
{#base.html.twig#}
<!DOCTYPE html>
<html class="vw-100">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<meta name="robots" content="index"/>
<meta name="keywords" content="{% block keywords %}{% endblock %}"/>
<meta name="description" content="{% block description %}{% endblock %}"/>
<title>{% block title %}Welcome!{% endblock %}</title>
<link rel="icon" type="image/png" href="{{ asset('assets/images/icon.png') }}"/>
<link rel="stylesheet" href="{{ asset('assets/css/dist/bootstrap.min.css') }}">
<link rel="stylesheet" href="{{ asset('assets/css/base.css') }}">
<link rel="stylesheet" href="{{ asset('assets/css/footer/basic.css') }}">
{% block stylesheets %}{% endblock %}
<script src="{{ asset('assets/js/dist/fontawesome.min.js') }}" crossorigin="anonymous"></script>
</head>
<body class="vw-100">
{% block body %}{% endblock %}
{% include 'footer/basic.html.twig' %}
<script src="{{ asset('assets/js/dist/jquery.min.js') }}"></script>
<script src="{{ asset('assets/js/dist/popper.min.js') }}"></script>
<script src="{{ asset('assets/js/dist/bootstrap.min.js') }}"></script>
<script src="{{ asset('assets/js/base.js') }}"></script>
{% block javascripts %}{% endblock %}
</body>
</html>
{#home.twig.html#}
{% extends 'base.html.twig' %}
{% block keywords %}{% endblock %}
{% block description %}{% endblock %}
{% block title %}Accueil{% endblock %}
{% block stylesheets %}
<link rel="stylesheet" href="{{ asset('assets/css/homePage.css') }}">
{% endblock %}
{% block body %}
{% include 'header/basic.html.twig' with {h1: 'Enterprise Name', text_link: 'Learn More', link: 'link', text: 'some text'}%}
{% endblock %}
{% block javascripts %}{% endblock %}
{#header/basic.html#}
<header class="vw-100">
<div class="cover-container d-flex h-100 p-3 mx-auto flex-column justify-content-center">
<main role="main" class="inner cover text-center">
<h1 class="cover-heading theme-text-color">{{ h1 }}</h1>
<p class="lead theme-text-color">{{ text }}</p>
<p class="lead">
{{ text_link }}
</p>
</main>
</div>
</header>
I need to add a link to the stylesheet block from the header/basic.html.twig template like this:
{#header/basic.html#}
{% block stylesheets %}
...{# home.twig.html content #}
<link rel="stylesheet" href="{{ asset('assets/css/header/basic.css') }}">
{% endblock %}
<header class="vw-100">
<div class="cover-container d-flex h-100 p-3 mx-auto flex-column justify-content-center">
<main role="main" class="inner cover text-center">
<h1 class="cover-heading theme-text-color">{{ h1 }}</h1>
<p class="lead theme-text-color">{{ text }}</p>
<p class="lead">
{{ text_link }}
</p>
</main>
</div>
</header>
I tried a lot of things, but I didn't succeed.
Is there a way to do this? Thanks
Related
I need help with Django web Framework I cannot solve this problem or I cannot identify the source of the problem. Please help me with this problem the main problem is written in the title.
Here is my traceback for the error:
Traceback (most recent call last):
File "C:\Users\Admin\AppData\Local\Programs\Python\Python39\lib\site-packages\django\core\handlers\exception.py", line 47, in inner
response = get_response(request)
File "C:\Users\Admin\AppData\Local\Programs\Python\Python39\lib\site-packages\django\core\handlers\base.py", line 181, in _get_response
response = wrapped_callback(request, *callback_args, **callback_kwargs)
File "D:\Documents\CodingFox\CodingFox_final\CodingFox\Users\views.py", line 37, in registeration_form
form.save()
File "D:\Documents\CodingFox\CodingFox_final\CodingFox\Users\forms.py", line 18, in save
user = super().save(*args, **kwargs)
File "C:\Users\Admin\AppData\Local\Programs\Python\Python39\lib\site-packages\django\contrib\auth\forms.py", line 131, in save
user.save()
File "C:\Users\Admin\AppData\Local\Programs\Python\Python39\lib\site-packages\django\db\models\fields\related_descriptors.py", line 536, in __get__
return self.related_manager_cls(instance)
File "C:\Users\Admin\AppData\Local\Programs\Python\Python39\lib\site-packages\django\db\models\fields\related_descriptors.py", line 851, in __init__
raise ValueError('"%r" needs to have a value for field "%s" before '
ValueError: "<User: harry1>" needs to have a value for field "id" before this many-to-many relationship can be used.
Models.py file
from django.db import models
from django.utils import timezone
from django.contrib.auth.models import User
from django.urls import reverse
import cv2
class Profile(models.Model):
user =models.OneToOneField(User, on_delete=models.CASCADE)
cover_img = models.ImageField(default='default.png',upload_to='cover_pics')
image = models.ImageField(default='default.jpg',upload_to='profile_pics')
# bio = models.TextField()
def __str__(self):
return f'{self.user.username} Profile'
def save(self ,*args, **kwargs):
super(Profile, self).save( *args, **kwargs)
img = cv2.imread(self.image.path)
output_size = cv2.resize(img,(300,300))
cv2.imwrite(self.image.path, output_size)
Forms.py
from django import forms
from django.contrib.auth.models import User
from django.contrib.auth.forms import UserCreationForm, AuthenticationForm
from django.forms import models
from .models import Profile
class UserRegistrationForm(UserCreationForm):
email=forms.EmailField(required=False)
class Meta:
model = User
fields = ['username','email','password1','password2']
class ProfileUpdateForm(forms.ModelForm):
class Meta:
model = Profile
fields = ['cover_img','image']
class UserLoginForm(AuthenticationForm):
class Meta:
model = User
fields = ['username','password']
Base.html
{% load static %}
{% load crispy_forms_tags %}
<!DOCTYPE html>
<html lang="en">
<head>
{% block head %}
{% endblock head %}
<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="title" content="CodingFox: Pre Written Code snippets">
<meta name="description"
content="CodingFox can enhance the speed of programming by giving them pre-written code snippets.">
<meta property="og:type" content="website">
<meta property="og:url" content="https://CodingFox.com/">
<meta property="og:title" content="CodingFox: Pre Written Code snippets">
<meta property="og:description"
content="CodingFox can enhance the speed of programming by giving them pre-written code snippets.">
<meta property="og:image" content="resoures/img/For_website.png">
<meta property="twitter:card" content="summary_large_image">
<meta property="twitter:url" content="https://CodingFox.com/">
<meta property="twitter:title" content="CodingFox: Pre Written Code snippets">
<meta property="twitter:description"
content="CodingFox can enhance the speed of programming by giving them pre-written code snippets.">
<meta property="twitter:image" content="resoures/img/For_website.png">
<link rel="stylesheet" href="{% static 'vendors/css/1.3 grid.css.css' %}">
<link href="https://unpkg.com/ionicons#4.5.10-0/dist/css/ionicons.min.css" rel="stylesheet">
<link rel="stylesheet" href="{% static 'vendors/css/normalize.css' %}">
<link rel="stylesheet" href="{% static 'vendors/css/prism-1.css' %}">
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Lato:wght#100;300;400;700;900&display=swap" rel="stylesheet">
<link rel="stylesheet" href="https://fonts.googleapis.com/icon?family=Material+Icons">
<link rel="apple-touch-icon" sizes="57x57" href="{% static 'favicon/apple-icon-57x57.png' %}">
<link rel="apple-touch-icon" sizes="60x60" href="{% static 'favicon/apple-icon-60x60.png' %}">
<link rel="apple-touch-icon" sizes="72x72" href="{% static 'favicon/apple-icon-72x72.png' %}">
<link rel="apple-touch-icon" sizes="76x76" href="{% static 'favicon/apple-icon-76x76.png' %}">
<link rel="apple-touch-icon" sizes="114x114" href="{% static 'favicon/apple-icon-114x114.png' %}">
<link rel="apple-touch-icon" sizes="120x120" href="{% static 'favicon/apple-icon-120x120.png' %}">
<link rel="apple-touch-icon" sizes="144x144" href="{% static 'favicon/apple-icon-144x144.png' %}">
<link rel="apple-touch-icon" sizes="152x152" href="{% static 'favicon/apple-icon-152x152.png' %}">
<link rel="apple-touch-icon" sizes="180x180" href="{% static 'favicon/apple-icon-180x180.png' %}">
<link rel="icon" type="image/png" sizes="192x192" href="{% static 'favicon/android-icon-192x192.png' %}">
<link rel="icon" type="image/png" sizes="32x32" href="{% static 'favicon/favicon-32x32.png' %}">
<link rel="icon" type="image/png" sizes="96x96" href="{% static 'favicon/favicon-96x96.png' %}">
<link rel="icon" type="image/png" sizes="16x16" href="{% static 'favicon/favicon-16x16.png' %}">
<link rel="manifest" href="{% static 'favicon/manifest.json' %}">
<meta name="msapplication-TileColor" content="#ffffff">
<meta name="msapplication-TileImage" content="{% static 'favicon/ms-icon-144x144.png' %}">
<meta name="theme-color" content="#ffffff">
<script src="{% static 'vendors/js/prism-1.js' %}"></script>
</head>
<body>
<nav>
<img src="{% static 'resoures/img/For_website.png' %}" alt="Logo_img" />
<div class="ion-md-menu nav_icon" id="nav_clickable"></div>
{% if user.is_authenticated %}
<div class="nav_icon-link">New Post</div>
<div class="nav_icon-link"><span class="ion-md-search"></span></div>
{% else %}
<div class="nav_icon-link">Login</div>
<div class="nav_icon-highlight">Register</div>
{% endif %}
<div class="clearfix"></div>
<div class="nav_box" id="nav_box">
{% if user.is_authenticated %}
<a href="" class="nav_box-link--person_img"><img src="{{ user.profile.image.url }}" alt="person-img"
srcset="" /></a>
<span class="ion-md-home"></span> {{ user.username }}
{% else %}
{% comment %} Unknown {% endcomment %}
{% endif %}
<span class="ion-md-moon"></span> Theme
<div class="nav_box-theme_box" id="theme_box">
<p>Change the color scheme to Dark colors.</p>
<h4>Toggle Theme</h4>
<input type="checkbox" name="" id="nav_box-theme_box-checkbox" />
</div>
<span class="ion-md-code"></span> Languages
<ul class="nav_box_language_box" id="lang_box">
<li>
<span class="ion-logo-html5"> HTML</span>
</li>
<li>
<span class="ion-logo-css3"> CSS</span>
</li>
<li>
<span class="ion-logo-python"> Python</span>
</li>
<li>
<span class="ion-logo-javascript"> JavaScript</span>
</li>
</ul>
{% if user.is_authenticated %}
<span class="ion-md-options"></span> Settings
<span class="ion-md-save"></span> Saved Posts
{% comment %} <span class="ion-md-home"></span> Home {% endcomment %}
<hr />
<span class="ion-md-log-out"></span> Log out
{% else %}
<span class="ion-md-log-in"></span> Login
<hr />
<span class="ion-md-person-add"></span> Register
{% endif %}
</div>
</nav>
<div class="message-box">
{% if messages %}
<ul class="messages">
{% for message in messages %}
<li{% if message.tags %} class="{{ message.tags }}"{% endif %}>
{% if message.level == DEFAULT_MESSAGE_LEVELS.ERROR %}Important: {% endif %}
{{ message }}
</li>
{% endfor %}
</ul>
{% endif %}
</div>
{% block category %}
{% endblock category %}
{% block Post_loading %}
{% endblock Post_loading %}
{% block post %}
{% endblock post %}
<script src="https://code.jquery.com/jquery-3.6.0.min.js"
integrity="sha256-/xUj+3OJU5yExlq6GSYGSHk7tPXikynS7ogEvDej/m4=" crossorigin="anonymous"></script>
<script src="{% static 'resoures/js/script.js' %}"></script>
<script src="{% static 'resoures/js/script-jquery.js' %}"></script>
<script src="{% static 'vendors/js/jquery.waypoints.min.js' %}"></script>
</body>
</html>
signup_form.html
{% extends 'base.html' %}
{% load static %}
{% load crispy_forms_tags %}
<head>
{% block head %}
<title>CodingFox | Register</title>
<link rel="stylesheet" href="{% static 'resoures/css/login.css' %}" />
{% endblock head %}
</head>
<body>
{% block post %}
<form action="" method="post" class="signup_form">
{% csrf_token %}
<h1>Welcome New User!</h1>
{% comment %} <label for="signup_email">Email :</label>
<input type="email" name="email" id="email">
<label for="signup_username">Username :</label>
<input type="text" name="username" id="username">
<label for="signup_password">Password :</label>
<input type="password" name="password" id="password"> {% endcomment %}
{{ form|crispy }}
{% comment %} <h4>Forgot Password?</h4> {% endcomment %}
<input type="submit" value="Register">
<hr>
<p>Already have a account?</p>
Login
</form>
{% endblock post %}
</body>
Views.py
def registeration_form(request):
if request.method == 'POST':
form=UserRegistrationForm(request.POST)
if form.is_valid():
form.save()
username=form.cleaned_data.get('username')
messages.success(request,f'Account created for {username}!')
return redirect('login_page')
else:
form=UserRegistrationForm()
context = {
'title':'Register',
'form':form
}
return render(request,'signup_form.html',context)
Urls.py
from django.contrib import admin
from django.urls import path, include
from . import views
urlpatterns = [
path('register/',views.registeration_form, name='register_page'),
]
Can you please give me a solution? This thing just worked a week ago but it's giving errors now. It is also giving errors for creating Post.
i am running into that error. at first i had bootstrap3 installed in my project directory. it was throwing the same error after some googling i saw some troubleshoots advising to install bootstrap4 still am facing the same error. i need help. Below is my code.
installing bootstrap4
pip install django-bootstrap4
settings.py
setting for bootstrap
bootstrap4 = {
'include_jquery':True,
}
# Application definition
INSTALLED_APPS = [
'django.contrib.admin',
'django.contrib.auth',
'django.contrib.contenttypes',
'django.contrib.sessions',
'django.contrib.messages',
'django.contrib.staticfiles',
'learning_logs.apps.LearningLogsConfig',
'users',
'bootstrap4',
]
base.html
{% load bootstrap4 %}
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Learning Log</title>
{% bootstrap_css %}
{% bootstrap_javascript %}
</head>
<body>
<!--static navbar -->
<nav class="navbar navbar-default navbar-static-top">
<div class="container">
<div class="navbar-header">
<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar"
aria-expanded="false" aria-controls="navbar"> </button>
<a class="navbar-brand" href="{% url 'index' %}"> Learning Log</a>
</div>
<div id="navbar" class="navbar-collapse collapse">
<ul class="nav navbar-nav">
<li>Topics</li>
</ul>
<ul class="nav navbar-nav navbar-right">
{% if user.is_authenticated %}
<li><a>Hello, {{ user.username }}.</a></li>
<li>log out</li>
{% else %}
<li>register</li>
<li>log in</li>
{% endif %}
</ul>
</div>
<!--/.nav-collapse -->
</div>
</nav>
<div class="container">
<div class="page-header">
{% block header %}{% endblock header %}
</div>
<div>
{% block content %}{% endblock content %}
</div>
</div> <!-- /container -->
</body>
</html>
There are different ways than what you are doing to access bootstrap, instead you could just add the bootstrap links as you would normally add them to html code like this:
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">
You could also just download the bootstrap files and link it into your static folder.
I am new to wagtail and I am not able to figure out why I am getting this error: Invalid block tag on line 140: 'wagtailuserbar'. Did you forget to register or load this tag?.
I am attaching the needful code.
--base.html--
{% load static from static %}
<!doctype html>
<html lang="en">
<head>
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.5.0/css/bootstrap.min.css" integrity="sha384-9aIt2nRpC12Uk9gS9baDl411NQApFmC26EwAOH8WgZl5MYYxFfc+NcPb1dKGj7Sk" crossorigin="anonymous">
<meta charset="utf-8" />
<title>
{% block title %}
Title
{% if self.seo_title %}{{ self.seo_title }}{% else %}{{ self.title }}{% endif %}
{% endblock %}
{% block title_suffix %}
{% with self.get_site.site_name as site_name %}
{% if site_name %}- {{ site_name }}{% endif %}
{% endwith %}
{% endblock %}
</title>
<meta name="description" content="" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
{# Global stylesheets #}
<link rel="stylesheet" type="text/css" href="{% static 'css/mysite_blog.css' %}">
{% block extra_css %}
{# Override this in templates to add extra stylesheets #}
{% endblock %}
{% block head %}
{% endblock head %}
<style> </style>
<!-- Required meta tags -->
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<!-- Bootstrap CSS -->
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css" integrity="sha384-Vkoo8x4CGsO3+Hhxv8T/Q5PaXtkKtu6ug5TOeNV6gBiFeWPGFN9MuhOf23Q9Ifjh" crossorigin="anonymous">
</head>
<body class="{% block body_class %}{% endblock %}">
{% wagtailuserbar %}
{% block content %}{% endblock %}
{# Global javascript #}
<script type="text/javascript" src="{% static 'js/mysite_blog.js' %}"></script>
{% block extra_js %}
{# Override this in templates to add extra javascript #}
{% endblock %}
<!-- Other Stuff -->
<script src="https://code.jquery.com/jquery-3.5.1.slim.min.js" integrity="sha384-DfXdz2htPH0lsSSs5nCTpuj/zy4C+OGpamoFVy38MVBnE+IbbVYUew+OrCXaRkfj" crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/popper.js#1.16.0/dist/umd/popper.min.js" integrity="sha384-Q6E9RHvbIyZFJoft+2mJbHaEWldlvI9IOYy5n3zV9zzTtmI3UksdQRVvoxMfooAo" crossorigin="anonymous"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.5.0/js/bootstrap.min.js" integrity="sha384-OgVRvuATP1z7JjHLkuOU7Xw704+h835Lr+6QL9UvYjZE3Ipu6Tp75j7Bh/kR0JKI" crossorigin="anonymous"></script>
</body>
</html>
a similar error occurred for {% static %} tag but was fixed by the 1st line in the above code. Please Help me with a solution to this error.
You can load both tags in the same load statement like this:
{% load static wagtailuserbar %}
from static is not needed.
Is there a possibility or workaround how to merge 2 twig templates? (NOT render!)
To give more context, let's assume I have base.twig:
<!DOCTYPE html>
<html>
<head>
<title>{{ title }}</title>
</head>
<body>
<div id="content">{% block content %}{% endblock %}</div>
</body>
</html>
and a child content.twig:
{% extends "base.twig" %}
{% block content %}
<h1>Hello {{ username }}</h1>
{% endblock %}
Expected result:
<!DOCTYPE html>
<html>
<head>
<title>{{ title }}</title>
</head>
<body>
<div id="content">
<h1>Hello {{ username }}</h1>
</div>
</body>
</html>
Thanks for the help!
So, I'm trying to create a simple layout with a Bootstrap nav-bar and a block of content on the body, and that works fine. But, when I extend that to a child, no matter what changes I make on the child, nothing shows up!
I'll post the two templates I'm using right now.
layout.html
<!doctype html>
{% extends "bootstrap/base.html" %}
<html>
<head>
<title>{% block title %}{% endblock %} </title>
</head>
<body>
{% block navbar %}
<nav class="navbar navbar-inverse navbar navbar-fixed-stop" role="navigation" style="border-radius:0px;">
<div class="container-fluid">
<div class="navbar-header"><a class="navbar-brand" href="#">BGP Monitor</a></div>
<ul class = "nav navbar-nav">
{% if g.user.is_authenticated %}
<li>Admin Panel</li>
{% endif %}
</ul>
<ul class="nav navbar-nav navbar-right">
{% if g.user.is_authenticated %}
<li><a href ="{{ url_for('logout') }}">Logout</li>
{% else %}
<li><a href ="{{ url_for('login') }}">Login</li>
{% endif %}
</ul>
</div>
</div>
</nav>
{% endblock %}
<div class="container-fluid" id="form">
{% block container %}{% endblock %}
</div>
</body>
</html>
And the child:
{% extends "layout.html" %}
<html>
<head></head>
<body>
<h3>aaa</h3>
{% block container %}
<div class="collapse navbar-collapse" id="container">
{{ super() }}
<form action="{{ url_for('login')}}" class="navbar-form navbar-right" method="POST">
{{ form.hidden_tag() }}
<div class="form-group">
{{ form.email(class="form-control", placeholder="Username") }}
</div>
<div class="form-group">
{{ form.password(class="form-control", placeholder="Password") }}
</div>
<div class="form-group">
<button class="btn btn-default" type="submit">Sign In</button>
</div>
</form>
</div>
</div>
{% endblock %}
</body>
The nav-bar shows, but the form doesn't show up, at all. It's as if the child does not exist.
Any ideas?
Thank you
P.S:
So, I changed to this:
layout.html
<!doctype html>
<html>
<head>
<title>{% block title %}{% endblock %}</title>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
</head>
<body>
<nav class="navbar navbar-inverse navbar navbar-fixed-stop" role="navigation" style="border-radius:0px;">
<div class="container-fluid">
<div class="navbar-header"><a class="navbar-brand" href="#">BGP Monitor</a></div>
<ul class = "nav navbar-nav">
{% if g.user.is_authenticated %}
<li>Admin Panel</li>
{% endif %}
</ul>
<ul class="nav navbar-nav navbar-right">
{% if g.user.is_authenticated %}
<li><a href ="{{ url_for('logout') }}">Logout</li>
{% else %}
<li><a href ="{{ url_for('login') }}">Login</li>
{% endif %}
</ul>
</div>
</div>
</nav>
<div class="container-fluid" id="container">
{% block container %}{% endblock %}
</div>
</body>
</html>
And this child:
{% extends "layout.html" %}
{% block container %}
<form action="{{ url_for('login')}}" class="navbar-form navbar-right" method="POST">
{{ form.hidden_tag() }}
<div class="form-group">
{{ form.email(class="form-control", placeholder="Username") }}
</div>
<div class="form-group">
{{ form.password(class="form-control", placeholder="Password") }}
</div>
<div class="form-group">
<button class="btn btn-default" type="submit">Sign In</button>
</div>
</form>
{% endblock %}
This way, there's no duplicate {% extend ... %}.
It now shows the form, but the WHOLE div is clickable, rendering it pretty much useless..
Any ideas?
You aren't supposed to have all the <html><head><body> tags in a child. It should just be:
{% extends "layout.html" %}
{% block container %}
<h3>aaa</h3>
<div class="collapse navbar-collapse" id="container">
{{ super() }}
<form action="{{ url_for('login')}}" class="navbar-form navbar-right" method="POST">
{{ form.hidden_tag() }}
<div class="form-group">
{{ form.email(class="form-control", placeholder="Username") }}
</div>
<div class="form-group">
{{ form.password(class="form-control", placeholder="Password") }}
</div>
<div class="form-group">
<button class="btn btn-default" type="submit">Sign In</button>
</div>
</form>
</div>
</div>
{% endblock %}
And notice how I moved the <h3>aaa</h3> code to inside the block.
Next, you can only have one {% extends ... %} call per rendering (You can't extend an extension). So, you need to consolidate your child to layout.html, making separate layouts per view.
Alternatively, you could change layout.html to use an include, keeping just one {% extends... %} per view:
layout.html
{% include "bootstrap/base.html" %}
{% block navbar %}
<nav class="navbar navbar-inverse navbar navbar-fixed-stop" role="navigation" style="border-radius:0px;">
<div class="container-fluid">
<div class="navbar-header"><a class="navbar-brand" href="#">BGP Monitor</a></div>
<ul class = "nav navbar-nav">
{% if g.user.is_authenticated %}
<li>Admin Panel</li>
{% endif %}
</ul>
<ul class="nav navbar-nav navbar-right">
{% if g.user.is_authenticated %}
<li><a href ="{{ url_for('logout') }}">Logout</li>
{% else %}
<li><a href ="{{ url_for('login') }}">Login</li>
{% endif %}
</ul>
</div>
</div>
</nav>
{% endblock %}
<div class="container-fluid" id="form">
{% block container %}{% endblock %}
</div>
Again, notice there are no duplicated <html> etc tags in layout.html. Those are already in bootstrap/base.html