Flask-Bootstrap

Warnings

• breaking Flask-Bootstrap is tied to Bootstrap 3.3.7.1, an older version of Bootstrap. For Bootstrap 4, 5, or later, use `Bootstrap-Flask` instead.
  Fix: For modern Bootstrap versions, migrate to `Bootstrap-Flask`. Note that `Flask-Bootstrap` and `Bootstrap-Flask` cannot be used in the same Python environment.
• deprecated The project appears to be abandoned, with its last release in 2017 and PyPI classifiers indicating Python 2 support. There is no active development for newer Python or Bootstrap versions.
  Fix: For new projects or modern Bootstrap/Python versions, consider `Bootstrap-Flask`.
• gotcha When overriding template blocks (e.g., `styles`, `scripts`) in `bootstrap/base.html`, you must include `{{ super() }}` to retain Bootstrap's default content. Otherwise, your custom content will entirely overwrite Bootstrap's.
  Fix: Always use `{{ super() }}` within overridden blocks: `{% block styles %}{{ super() }} <link rel="stylesheet" href="/my_styles.css">{% endblock %}`
• gotcha The correct way to initialize the extension is `bootstrap = Bootstrap(app)`. Simply calling `Bootstrap(app)` might work in some basic scenarios but the explicit assignment is recommended for consistency and proper behavior with certain Flask features.
  Fix: Ensure you assign the initialized extension to a variable: `bootstrap = Bootstrap(app)`.
• gotcha Flask-Bootstrap bundles jQuery 1.x. If your application or other JavaScript libraries require jQuery 2.x or later, you'll need to manually include the desired jQuery version via a CDN or local static files.
  Fix: Add a `script` tag for a newer jQuery version in your `{% block scripts %}` with `{{ super() }}`.

Install

• pip install flask-bootstrap Install with pip

Imports

• Bootstrap

  from flask_bootstrap import Bootstrap

  The class is simply `Bootstrap`.

Quickstart

Initialize the Flask app and the Bootstrap extension, then create a simple route that renders a template extending `bootstrap/base.html` to inherit Bootstrap's styling and scripts. The `SECRET_KEY` is required by Flask for certain functionalities (e.g., flashed messages).

from flask import Flask, render_template
from flask_bootstrap import Bootstrap
import os

app = Flask(__name__)
app.config['SECRET_KEY'] = os.environ.get('FLASK_SECRET_KEY', 'a_secret_key_for_dev')
bootstrap = Bootstrap(app)

@app.route('/')
def index():
    return render_template('index.html')

# To run this, save as app.py and create templates/index.html:
# # templates/index.html
# {% extends "bootstrap/base.html" %}
# {% block title %}My Flask-Bootstrap App{% endblock %}
#
# {% block content %}
#   <div class="container">
#     <h1>Hello, Flask-Bootstrap!</h1>
#     <p>This is a basic Flask application with Bootstrap 3 via Flask-Bootstrap.</p>
#     <button type="button" class="btn btn-primary">Primary button</button>
#   </div>
# {% endblock %}

if __name__ == '__main__':
    app.run(debug=True)