Exploring Empress Framework's Web Rendering Feature

Introduction

Welcome, developers! In this guide, we dive deep into Empress Framework’s exciting feature: Web Rendering. This feature is a powerful tool for creating server-rendered static web pages meant for your website visitors. These pages can be public or require login.

Feature Importance

Understanding and leveraging the Web Rendering feature is crucial for delivering smooth and efficient experiences to your users. It allows for the creation of a rich admin interface and the addition of dynamic content using templates. From a software development perspective, this feature is invaluable for integrating dynamic content and implementing custom app solutions.

Adding Pages

For every Empress app, including Empress, a www folder is included. This folder directly maps to website urls. The directory structure is as follows:

frappe/www
├── about.html
├── about.py
├── contact.html
├── contact.py
├── desk.html
├── desk.py
├── login.html
├── login.py
├── me.html
└── me.py

This structure enables the routes /about, /contact, /desk, /login and /me. To add a page of your own, simply add an HTML file in the www folder of your app.

Overriding Standard Pages and Templating

Empress also lets you override standard pages through your custom app. To override the standard /about provided by Empress, just add a file named about.html in the www folder of your app and it will take precedence.

Moreover, you can add dynamic content to Portal Pages using Jinja templates. All of the portal pages extend from the base template frappe/templates/web.html which itself extends from frappe/templates/base.html.

Context

Every portal page in Empress can have a Python controller which builds context for the page. The controller should have a get_context method which takes a context dict, adds any data to it, and then returns it. Here’s an example:

# about.py
import frappe

def get_context(context):
    context.about_us_settings = frappe.get_doc('About Us Settings')
    return context

Custom CSS and JS

To style your pages or add dynamic functionality, you can include custom CSS and JavaScript files. Just add a .css or .js file with the same name as your HTML file.

Home Page

The home page for your portal can be defined in various ways, including Role settings, Portal Settings, via the get_website_user_home_page hook, or through Website Settings.

Conclusion

The Web Rendering feature of Empress Framework offers developers a flexible and efficient way to create and customize web pages. Understanding this feature and its nuances can significantly enhance the development and customization of business solutions in Empress. So, go ahead and leverage this feature to deliver a seamless and dynamic web experience to your users. Happy coding!