Xintra - Flask Premium Bootstrap-5 Admin Template, With these template formats, it's very easy to create a presence and grab someone's attention around the web page Because the template is built using HTML5, CSS3, Bootstrap 5 framework and with Sass. So please before you start working with the template take a quick look on the documentation so that you can easily built your website.

If You Love Our Template Design Please don't forgot to rate it. Thank you so much! 😊

Xintra Flask is a Premium Bootstrap-5 Admin Template using modern and minimal design. It is fully flexible user-friendly and responsive. Xintra Modern template is powered with HTML 5, SASS, & Bootstrap 5 which looks great on Desktops, Tablets, and Mobile Devices. This Template Includes 180+ HTML Pages . No Need to do hard work for this template customization. We already designed it and you can easily design your website just how you like it. This template using Bootstrap 5 framework. After Purchased this template you will get All HTML files,CSS, Scss and JS Files.

It has super clean flat user interface admin design, easy customizable components and widgets.The Template comes with a awesome unique design also we ensure you can easily design template.

It is a fully responsive layout for all type of devices. Works on all major web browsers, Desktop, iPhone, iPad, Tablet and all other smart phone devices

Once you Purchase Xintra Flask Premium Bootstrap-5 Admin Template, you will be able to get free download of all future updates.

In order to run Flask you need to install Python by the following steps

This steps are based on Windows OS

Step1: Please visite the Official Web Site of the Python python.org

Step2: Click on the Download Python button

Step3: Now your Python setup file has downloaded

Step4: Now Right click on the Python setup file and select Run as administrator click on Yes

Step5: Please click on the Check Box Add Python to PATH. And select Customize installation option

Step6: Click on Install for all users. And click on the Install button to install python on your system

Step7: To check whether Python is installed or not type python --version in your terminal

Step8: The pip package is automatically installed with your python installation

Step9: To check whether pip package is installed or not type pip --version in your terminal

NOTE: Please follow the official web site python.org to install on Linux/UNIX OS.

Ensure "Python" is installed on your computer.

Note: If you already know how to create a Python project, you can skip this step.

NOTE: First, activate the virtual environment, This will generate a requirements.txt file listing all installed Python packages for the project.

    ├── .venv/
    ├── static/
    |   └── assets/
    ├── templates/
    |   ├── pages/
    |   ├── components/
    |   └── layouts/
    ├── app.py
    ├── gulpfile.mjs
    ├── package.json
    └── package.lock.json
                                    

• First, unzip the project folder that you received from us.
• Navigate as shown Example: F:\project folder\templates\ Open pages folder will have 180+ html pages
• Navigate as shown Example: F:\project folder\templates\ Open components folder there you will find main-header, main-sidebar, footer, switcher, scripts, styles and etc files
• Navigate as shown Example: F:\project folder\templates\ Open layouts folder there you will find base.html, landing-base.html, custom-base.html files
• The base.html file is used for html pages; Do not use base file for error, authentication, landing html pages.
• The landing-base.html file is used for only landing.html page.
• The custom-base.html file is used for only error401, error500, error404, create-password, lockscreen, reset, signup, signin, comingsoon, twostep, undermaintenance html pages.
• NOTE : By default switcher is enabled in your template, so the switcher-styles will work i.e., RTL, horizontal, hover and etc..,. So if you want to enable those styles, first you need to remove or disable switcher in your template as shown in switcher section in documentation.
• Please refer FAQ'S to activate other versions and styles like RTL, horizontal, horizontal-hover, Dark-mode, Boxed-Layout, Icon Overlay, etc..,

• blinker==1.9.0
• click==8.1.7
• colorama==0.4.6
• Flask==3.1.0
• itsdangerous==2.2.0
• Jinja2==3.1.4
• MarkupSafe==3.0.2
• Werkzeug==3.1.3
• Bootstrap v5.3.3
• Sass
• Gulp 5.0.0

Step:1 Quick view of Installations

Step:2 Run project

        ├── static/
        |   ├── assets/
        |   |   ├── audio
        |   |   ├── css
        |   |   ├── icon-fonts
        |   |   ├── images
        |   |   ├── js
        |   |   ├── libs
        |   |   ├── scss
        |   |   └── video
        ├── templates/
        |   ├── components/
        |   |   |   ├── landingpage/
        |   |   |   |   ├── footer.html
        |   |   |   |   ├── header.html
        |   |   |   |   ├── header1.html
        |   |   |   |   ├── scripts.html
        |   |   |   |   ├── sidebar.html
        |   |   |   |   ├── sidebar1.html
        |   |   |   |   ├── styles.html
        |   |   |   |   └── switcher.html
        |   |   |   ├── footer.html		
        |   |   |   ├── main-header.html		
        |   |   |   ├── main-header1.html	
        |   |   |   ├── main-sidebar.html		
        |   |   |   ├── modal.html		
        |   |   |   ├── scripts.html	
        |   |   |   ├── styles.html	
        |   |   |   └── switcher.html
        |   ├── layouts/
        |   |   ├── base.html
        |   |   ├── custom-base.html
        |   |   └── landing-base.html
        |   ├── pages/
        |   |   └── 180+ html pages
        ├── app.py
        ├── gulpfile.mjs
        ├── package-lock.json
        ├── package.json
        └── requirements.txt
                                    

Introduction to the Flask Template Starter Kit:

The Flask template starterkit is a resource that helps developers kickstart their Flask web development projects by providing a preconfigured and ready-to-use template. It aims to simplify the initial setup and provide a foundation for building Python-based websites or applications.

Purpose of the Flask Template Starter Kit:

The purpose of the Flask template starter kit is to save developers time and effort by offering a set of prebuilt files and configurations commonly used in Flask projects. Instead of starting from scratch, developers can leverage the starter kit to quickly set up a project structure that adheres to best practices and industry standards.

Benefits of Using the Flask Template Starter Kit:

The starter kit eliminates the need to set up the basic project structure manually. It provides a well-organized file and folder structure, including commonly used directories for separating code, templates, assets, and configuration files. This allows developers to focus more on implementing business logic rather than spending time on initial setup.
Before using the Flask template starter kit, developers should have a basic understanding of Flask concepts. Additionally, they should have a environment Flask installed on their local machines. Familiarity with HTML, CSS, and JavaScript is also beneficial for frontend development aspects.

Starterkit Overview

You can use the Starterkit if you are creating a new project. It will be time-consuming to use the full admin version for a new project as Xintra have more than 180 HTML pages.

We have provided all the pre-build layouts like Sidemenu, Header, Footer and Scripts etc in the Starterkit.

For further information or support regarding the template, please contact us using the provided link: https://support.spruko.com/

        ├── static/
        |   ├── assets/
        |   |   ├── audio
        |   |   ├── css
        |   |   ├── icon-fonts
        |   |   ├── images
        |   |   ├── js
        |   |   ├── libs
        |   |   ├── scss
        |   |   └── video
        ├── templates/
        |   ├── pages/
        |   |   └── html pages
        |   ├── components/
        |   |   |   ├── footer.html		
        |   |   |   ├── main-header.html		
        |   |   |   ├── main-header1.html
        |   |   |   ├── main-sidebar.html  
        |   |   |   ├── scripts.html
        |   |   |   ├── styles.html	
        |   |   |   └── switcher.html
        |   ├── layouts/
        |   |   └── base.html
        ├── app.py
        ├── gulpfile.mjs
        ├── package-lock.json
        ├── package.json
        └── requirements.txt
                                    

• Take a quick look at the folder structure of the "Starterkit."
• Integration of your customized HTML pages becomes easy when using the "Starterkit."
• The "Starterkit" provides all the layout components, related assets, and plugins.
• To explore the contents of the "Starterkit," unzip the project folder received after purchase.
Navigate to the following paths:
• Example: C:/xampp/htdocs/starterkit/templates/pages/ - Add your HTML pages here if you have more.
• Example: C:/xampp/htdocs/starterkit/templates/components/ - This folder contains files such as main-header.html, footer.html, scripts.html, and styles.html.
• Example: C:/xampp/htdocs/starterkit/templates/layouts/ - This file such as base.html file here, if you have more.

Here we provided package.json and gulpfile.mjs files in your project, you just need to run npm install in your terminal in your project root path.

After compilation of download, you can compile your SCSS files into CSS files by following below procedure.

      

        ├── public/
        |   ├── assets/
        |   |   ├── audio
        |   |   ├── css
        |   |   ├── icon-fonts
        |   |   ├── images
        |   |   ├── js
        |   |   ├── libs
        |   |   ├── scss
        |   |   ├── video

                                                        
                                                            
                                                        

• Python : v3.12.3
• Flask : v3.1.0
• Bootstrap : v5.3.3
• Sass : v1.82.0
• gulp : v5.0.0
• node : 20.18.1
• npm : 10.8.2

If you want to remove switcher to your template follow the below process.

    Switcher path:
                                            
    Before:
    <body class="">
    Remove this( 
    <!-- Start::main-switcher -->
    {% include 'components/switcher.html' %}
    <!-- End::main-switcher -->
    )

    After :
    <body class="">
    (removed switcher path)
                                                                

    Before:
    <!-- Start::main-header -->
    {% include 'components/main-header.html' %}
    <!-- End::main-header -->

    After:														
    <!-- Start::main-header -->
    {% include 'components/main-header1.html' %}
    <!-- End::main-header -->
                                                                

    Remove Switcher Script :

    <!-- Custom-Switcher JS -->
    <script src="{{ url_for('static', filename='assets/js/custom-switcher.js') }}"></script>

                                                                

    Switcher path:

    BEFORE :
    <body class="landing-body">

    Remove this( 
    <!-- Start::main-switcher -->
    {% include 'components/landingpage/switcher.html' %}
    <!-- End::main-switcher -->
    )

    AFTER :
    <body class="landing-body">

    (removed switcher path)
                                                            

    Before:

    <!-- Start::main-header -->
    {% include 'components/landingpage/header.html' %}
    <!-- End::main-header -->

    After:	
                                                                                
    <!-- Start::main-header1 -->
    {% include 'components/landingpage/header1.html' %}
    <!-- End::main-header1 -->
                                                                

    Before:

    <!-- Start::main-sidebar -->
    {% include 'components/landingpage/sidebar.html' %}
    <!-- End::main-sidebar -->

    After:	
                                                                                
    <!-- Start::main-sidebar1 -->
    {% include 'components/landingpage/sidebar1.html' %}
    <!-- End::main-sidebar1 -->
                                
                                                                

    <html lang="en" dir="ltr" data-nav-layout="vertical" data-theme-mode="light" data-header-styles="light" data-menu-styles="dark" data-toggled="close">
                                    

    <html lang="en" dir="ltr" data-nav-layout="vertical" data-theme-mode="light" data-header-styles="light" data-menu-styles="dark" data-toggled="close">
                                    

All plugins runs through npm.

If you want new plugins : Install new plugin from npm then run gulp command.

Refer following links for usage:

Refer following links for usage:

Refer following links for usage:

Refer following links for usage: