Flask Templates




  • Flask facilitates us to return the response in the form of HTML templates.

Sample Code

The flask script contains a view function, i.e., the message() which is associated with the URL '/'. Instead of returning a simple string as a message, it returns a message with <h1> tag attached to it using HTML.

script.py

from flask import *  
app = Flask(__name__)  
@app.route('/')  
def message():  
      return "<html><body><h1>Hi, welcome to wikitechy</h1></body></html>"  
if __name__ == '__main__':  
   app.run(debug = True)  

Output

 Flask Templates Output

Flask Html Templates

Rendering External HTML Files

 Template

Template

  • Flask provides us the render_template () function.
  • render_template () - It can be used to render the external HTML file to be returned as the response from the view function.

Sample code

message.html

<html>  
<head>  
<title>Message</title>  
</head>  
<body>  
<h1>hi, welcome to the website </h1>  
</body>  
</html>  

script.py

from flask import *  
app = Flask(__name__)  
 
@app. route('/')  
def message():  
      return render_template('message.html')  
if __name__ == '__main__':  
   app. run(debug = True)  
  • Here, we create the sample folder templates inside the application directory and save the HTML templates referenced in the flask script in that directory.
  • In this case, the path of our script file name as script.py is C:\flask whereas the path of the HTML template is C:\flask\templates.
  • Application Directory
    • script.py
    • templates
    • message.html

Output

 Flask Templates Output

Flask Html Templates

Delimiters

 flask templates jinja2

flask templates jinja2

  • It can be used in the HTML to make it capable of dynamic data representation.
  • The jinga2 template engine provides the following delimiters to escape from the HTML.
    • {% ... %} for statements
    • {{ ... }} for expressions to print to the template output
    • {# ... #} for the comments that are not included in the template output
    • # ... ## for line statements

Sample Code

  • In the below code, where the variable part of the URL is shown in the HTML script using the {{ ... }} delimiter.

message.html

<html>  
<head>  
<title>Message</title>  
</head>  
<body>  
<h1>hi, {{ name }}</h1>  
</body>  
</html>  

script.py

from flask import *  
app = Flask(__name__)  
  
@app.route('/user/<uname>')  
def message(uname):  
      return render_template('message.html',name=uname)  
if __name__ == '__main__':  
   app.run(debug = True)  

Output

 Flask-Templates Output1

Flask Templates Output

Embedding Python statements in HTML

  • In this case flask framework is used to embed the symbol python statements into the HTML.

Sample Code

  • In this example, We will print the table of 10 on the browser's window.
  • The for-loop statement is enclosed inside {%...%} delimiter, whereas, the loop variable and the number is enclosed inside {{ ... }} placeholders.

script.py

from flask import *  
app = Flask(__name__)  
  
@app.route('/table/<int:num>')  
def table(num):  
      return render_template('print-table.html',n=num)  
if __name__ == '__main__':  
   app.run(debug = True)  

print-table.py

<html>  
<head>  
<title>print table</title>  
</head>  
<body>  
<h2> printing table of {{n}}</h2>  
{% for i  in range(1,11): %}  
    <h3>{{n}} X {{i}} = {{n * i}} </h3>  
{% endfor %}  
</body>  
</html>  

Output

 Output Table

Output Table

If you want to learn about Python Course , you can refer the following links Python Training in Chennai , Machine Learning Training in Chennai , Data Science Training in Chennai , Artificial Intelligence Training in Chennai



Related Searches to Flask Templates

Adblocker detected! Please consider reading this notice.

We've detected that you are using AdBlock Plus or some other adblocking software which is preventing the page from fully loading.

We don't have any banner, Flash, animation, obnoxious sound, or popup ad. We do not implement these annoying types of ads!

We need money to operate the site, and almost all of it comes from our online advertising.

Please add wikitechy.com to your ad blocking whitelist or disable your adblocking software.

×