article

Wednesday, February 26, 2020

Python Flask Parent and child Templates


Python Flask Parent and child Templates

 
#app.py
from flask import Flask, render_template, url_for, request, jsonify
from datetime import datetime

app = Flask(__name__)

@app.context_processor
def inject_now():
    return {'now': datetime.utcnow()}

@app.route('/')
def home():
 return render_template('index.html')
 
@app.route('/about')
def about():
 return render_template('about.html')
 
@app.route('/testimonials')
def testimonials():
 return render_template('testimonials.html')
 
@app.route('/contact')
def contact():
 return render_template('contact.html')
 
@app.route('/products')
def products():
 return render_template('products.html') 
  
if __name__ == '__main__':
 app.run(debug=True)
//parent.html
<!DOCTYPE html>
<html>
 <head>
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Python Flask Parent and child Templates - {% block title %}{% endblock %}</title>
  {% block head %}   
  {% endblock %}
 </head>
<body>
 {% include "snippets/header.html" %}
 <div class="row">
  <div class="col-s-3">
   {% include "snippets/left.html" %}
  </div> 
  <div class="col-s-9">
   {% block content %}{% endblock %}
  </div>
 </div>
 {% include "snippets/footer.html" %}
</body>
</html>
//index.html
{% extends "parent.html" %}
{% block title %}Welcome{% endblock %}

{% block content %}
    <h1>Welcome</h1>
    <p>
  Welcome to working with parent and child templates in flask
 </p>
{% endblock %}
//about.html
{% extends "parent.html" %}
{% block title %}About Us{% endblock %}

{% block content %}
    <h1>About</h1>
    <p>
  this is about page
 </p>
{% endblock %}
//testimonials.html
{% extends "parent.html" %}
{% block title %}Testimonials{% endblock %}

{% block content %}
    <h1>Testimonials</h1>
    <p>
  This is testimonials page
 </p>
{% endblock %}
//contact.html
{% extends "parent.html" %}
{% block title %}Contact Us{% endblock %}

{% block content %}
    <h1>Contact Us </h1>
    <p>
  This is Contact Us page
 </p>
{% endblock %}

Related Post