Author: Sinan Yosunkaya

Frappe Framework and HTML

When using the Frappe Framework, you can create dynamic HTML pages by utilizing Jinja templates.

To do this, you should create .py and .html files with the same name in the same directory. The Python file should include the get_context method, while the HTML file should contain the Jinja Template.

Using the get_context method in our Python file, we will pass the variables obtained to the Jinja Template within the HTML file to render the page.

For example:

sample_page.py:

import frappe

@frappe.whitelist(allow_guest=True)
def get_context(context):
    benim_adim = "Sinan Yosunkaya"
    favori_takimim = "Gençlerbirliği"
    benim_memleketim = "Ankara"
    kedilerimin_isimleri = ['Kedi', 'Tavuk', 'Tombalak', 'MinikaGo', 'Sempatik']

    context.benim_adim = benim_adim
    context.favori_takimim = favori_takimim
    context.benim_memleketim = benim_memleketim
    context.kedilerimin_isimleri = kedilerimin_isimleri

    return context

sample_page.html:

<!DOCTYPE html>
<!-- Built on Frappe. https://frappeframework.com/ -->
<html lang="en">

<head>
	<meta charset="utf-8">
	<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
	<meta name="generator" content="frappe">
</head>

{% block content %}
<p>Hello, my name is {{ benim_adim }}, and I support the team {{ favori_takimim }}. My hometown is {{ benim_memleketim }}. I have {{ kedilerimin_isimleri|length }} cats, and their names are as follows:
<ol>
{% for kedi_ismi in kedilerimin_isimleri %}
    <li>{{ kedi_ismi }}</li>
{% endfor %}
</ol>
</p>
{% endblock %}

As shown in this simple example, we were able to render the variables created in our Python file (sample_page.py) inside our HTML file (sample_page.html).