Font-Awesome-Flask

Font-Awesome-Flask is an extension for Flask that adds support for Font Awesome to your web application. It adds methods to load Font Awesome's resources (both Web Fonts + CSS and SVG + JS are supported) and render icons.

Installation

From PyPI

Font-Awesome-Flask is available on PyPI. Install with pip or your package manager of choice:

pip install Font-Awesome-Flask

From source

If you'd like, you can also install Font-Awesome-Flask from source (with flit):

git clone https://github.com/sgraaf/font-awesome-flask.git
cd font-awesome-flask
python3 -m pip install flit
flit install

Documentation

Check out the Font-Awesome-Flask documentation for the User's Guide and API Reference.

Example

Configuration

Font-Awesome-Flask can be configured via the Flask configuration API, using the config attribute of the Flask object. These are the available configuration values along with their description:

Initialization

Initialize the extension with the Flask application normally...:

from flask import Flask
from flask_font_awesome import FontAwesome

app = Flask(__name__)
font_awesome = FontAwesome(app)

... or using the Application Factory pattern:

from flask import Flask
from flask_font_awesome import FontAwesome

font_awesome = FontAwesome()


def create_app():
    app = Flask(__name__)
    font_awesome.init_app(app)
    return app

Loading resources

Font-Awesome-Flask provides three helper methods to load Font Awesome's resources: font_awesome.load(), font_awesome.load_js() and font_awesome.load_css().

Font Awesome can be used either via Web Fonts + CSS or via SVG + JS. Use the load_css() method for the former, and load_js() for the latter. You can also use the more general load(), which defaults to SVG + JS.

Whichever resource(s) you end up using, you can load them by including any of the load() methods in the head of your base template:

<head>
    ...
    {{ font_awesome.load_js() }}
    ...
</head>
<body>
    ...
</body>

Rendering icons

Font-Awesome-Flask provides two ways of rendering icons: via the font_awesome.render_icon() and font_awesome.render_stacked_icons() methods...:

{{font_awesome.render_icon("fas fa-house")}}
{{font_awesome.render_stacked_icons("fas fa-square", "fas fa-house")}}

... or via the Jinja macros of the same names:

{% from 'font_awesome.html' import render_icon, render_stacked_icons %}
{{ render_icon('fas fa-house') }}
{{ render_stacked_icons('fas fa-square', 'fasfa-house') }}