Metronic Django

https://preview.keenthemes.com/django/metronic/docs
Admin
Metronic Django is a powerful starter kit and theme based on Bootstrap 5 designed to help developers...
Tokens:3,556
Snippets:64
Trust Score:10
Update:1 year ago
Show doc for...
Tokens:
Raw
### Download Get-Pip.py

Source: https://preview.keenthemes.com/django/metronic/docs/getting-started

Downloads the get-pip.py script to manually install Pip on Windows.

```bash
curl https://bootstrap.pypa.io/get-pip.py -o get-pip.py
```

--------------------------------

### Install Django

Source: https://preview.keenthemes.com/django/metronic/docs/getting-started

Installs the latest version of Django using Pip. Django is a Python web framework used for the project.

```bash
python -m pip install django
```

--------------------------------

### Install Pip

Source: https://preview.keenthemes.com/django/metronic/docs/getting-started

Installs Pip using the downloaded get-pip.py script. Pip is essential for installing Python packages like Django.

```bash
python get-pip.py
```

--------------------------------

### Check Django Version

Source: https://preview.keenthemes.com/django/metronic/docs/getting-started

Verifies the installed Django version. This confirms successful installation and can be used for compatibility checks.

```bash
django-admin --version
```

--------------------------------

### Check Python Version

Source: https://preview.keenthemes.com/django/metronic/docs/getting-started

Verifies the installed Python version. This is a prerequisite for installing Django.

```bash
python --version
```

--------------------------------

### Check Pip Version

Source: https://preview.keenthemes.com/django/metronic/docs/getting-started

Verifies the installed Pip version. This confirms that Pip has been successfully installed.

```bash
pip --version
```

--------------------------------

### Run Django Development Server

Source: https://preview.keenthemes.com/django/metronic/docs/getting-started

Starts the Django development server. This command runs the application, listens for changes, and hot-reloads them.

```bash
python manage.py runserver
```

--------------------------------

### Navigate to Tools Directory

Source: https://preview.keenthemes.com/django/metronic/docs/getting-started

Changes the current directory to the tools folder within the starter kit, where build dependencies are managed.

```bash
cd starterkit/_keenthemes/tools
```

--------------------------------

### Navigate to Starterkit Directory

Source: https://preview.keenthemes.com/django/metronic/docs/getting-started

Changes the current directory to the starterkit folder, which is the root of the Django project.

```bash
cd starterkit
```

--------------------------------

### Apply Django Migrations

Source: https://preview.keenthemes.com/django/metronic/docs/getting-started

Applies pending database migrations for the Django project. This is often necessary after initial setup or when encountering warnings about unapplied migrations.

```bash
python manage.py migrate
```

--------------------------------

### Install Project Dependencies (NPM)

Source: https://preview.keenthemes.com/django/metronic/docs/assets

This command installs project dependencies using NPM. It is an alternative to Yarn for building theme assets and should be run from the tools directory.

```bash
npm install
```

--------------------------------

### Python: Get Vendors

Source: https://preview.keenthemes.com/django/metronic/docs/theme-api

Get vendor files from settings. Retrieves the configuration details for vendor assets (JS/CSS) based on the specified type. Refer to settings.KT_THEME_VENDORS.

```python
KTTheme.getVendors(type)
```

--------------------------------

### Python: Get Direction

Source: https://preview.keenthemes.com/django/metronic/docs/theme-api

Get style direction. Returns the current text direction setting of the application.

```python
KTTheme.getDirection()
```

--------------------------------

### Python: Get Global Assets

Source: https://preview.keenthemes.com/django/metronic/docs/theme-api

Get the global assets. This function retrieves paths for globally available assets (like CSS or JS frameworks) based on the provided type.

```python
KTTheme.getGlobalAssets(type)
```

--------------------------------

### Django Template Tag: Get Custom JS

Source: https://preview.keenthemes.com/django/metronic/docs/theme-api

Get custom js files from the settings. This tag fetches paths for custom JavaScript files configured in your Django project settings.

```django
{% getCustomJs as js %}
```

--------------------------------

### Update Dependencies with Yarn

Source: https://preview.keenthemes.com/django/metronic/docs/updates

This command is used to install or update third-party plugins and their dependencies after updating the Metronic theme. It ensures that all necessary libraries are at their latest compatible versions.

```bash
yarn install
```

--------------------------------

### Django Template Tag: Get Global Assets

Source: https://preview.keenthemes.com/django/metronic/docs/theme-api

Get global asset files path from the settings. This tag retrieves paths for global assets like CSS or JS, defined in your Django settings.

```django
{% getGlobalAssets 'css' as assets_css %}
```

--------------------------------

### Python: Get Default Mode

Source: https://preview.keenthemes.com/django/metronic/docs/theme-api

Get the default theme value. Retrieves the currently set default theme mode ('light', 'dark', or 'system').

```python
KTTheme.getModeDefault()
```

--------------------------------

### Django Template Tag: Get Vendors

Source: https://preview.keenthemes.com/django/metronic/docs/theme-api

Get vendor assets files based on the type, either js or css. This tag helps in including third-party library assets (like Bootstrap, jQuery) by specifying the asset type.

```django
{% getVendors 'js' as vendors_js %}
```

--------------------------------

### Django Template Tag: Asset URL

Source: https://preview.keenthemes.com/django/metronic/docs/theme-api

Get asset URL by path. This tag generates the correct URL for assets located in your project's static or media directories.

```django
<img alt="Logo" src="{% asset 'media/logos/logo-2.svg' %}" class="h-30px" />
```

--------------------------------

### Django Template Tag: Get Icon

Source: https://preview.keenthemes.com/django/metronic/docs/theme-api

Get SVG icon by path. This tag allows you to dynamically include SVG icons by specifying their path and optional class names.

```django
{% getIcon 'duotune/arrows/arr079.svg' 'svg-icon fs-2 text-success' %}
```

--------------------------------

### Python: Get Asset Path

Source: https://preview.keenthemes.com/django/metronic/docs/theme-api

Get an image path in assets folder by path. This utility function constructs the correct URL for assets located within the theme's asset directories.

```python
KTTheme.asset(path)
```

--------------------------------

### Django Template Tag: Get Custom CSS

Source: https://preview.keenthemes.com/django/metronic/docs/theme-api

Get custom css files from the settings. This tag retrieves paths for custom CSS files defined within your Django project's settings.

```django
{% getCustomCss as css %}
```

--------------------------------

### Python: Get Icon Content

Source: https://preview.keenthemes.com/django/metronic/docs/theme-api

Get SVG icon content. This function retrieves the SVG icon markup directly, allowing for inline SVG usage in your application.

```python
KTTheme.getIcon('duotune/arrows/arr079.svg', 'svg-icon fs-2 text-success')
```

--------------------------------

### Build Theme Assets with Gulp (Shell)

Source: https://preview.keenthemes.com/django/metronic/docs/assets

This command initiates the Gulp build process, which compiles Sass, JavaScript, and media files into the starterkit/assets folder. Ensure you are in the starterkit/_keenthemes/tools directory.

```bash
gulp
```

--------------------------------

### Create Django App

Source: https://preview.keenthemes.com/django/metronic/docs/templates

Command to create a new Django application. This command should be run from the directory containing the manage.py file.

```bash
python manage.py startapp mypage
```

--------------------------------

### Django View for My Page

Source: https://preview.keenthemes.com/django/metronic/docs/templates

Python code for a Django view that extends TemplateView and initializes the KTLayout. It defines the template to be used and prepares the context for rendering.

```python
from django.views.generic import TemplateView
from django.conf import settings
from _keenthemes.__init__ import KTLayout

class MypageView(TemplateView):
    template_name = 'template-path.html'

    def get_context_data(self, **kwargs):
        # Call the base implementation first to get a context
        context = super().get_context_data(**kwargs)

        # A function to init the global layout. It is defined in _keenthemes/__init__.py file
        context = KTLayout.init(context)

        return context
```

--------------------------------

### Add Multiple Vendors (Django)

Source: https://preview.keenthemes.com/django/metronic/docs/assets

This snippet shows how to add multiple vendor scripts or stylesheets simultaneously using KTTheme.addVendors. This is useful for including several third-party dependencies at once.

```python
KTTheme.addVendors(['formrepeater', 'fullcalendar'])
```

--------------------------------

### Add Single Vendor (Django)

Source: https://preview.keenthemes.com/django/metronic/docs/assets

This snippet illustrates how to add a single vendor script or stylesheet using KTTheme.addVendor. Vendor names can be found in `_keenthemes/settings.py` under `KT_THEME_VENDORS`.

```python
KTTheme.addVendor('datatables')
```

--------------------------------

### Build Theme Assets with Webpack (Shell)

Source: https://preview.keenthemes.com/django/metronic/docs/assets

This command initiates the Webpack build process for theme assets. It compiles Sass, JavaScript, and media files. Ensure you have modified tools/package.json by removing '"type": "module"' for this command to work correctly.

```bash
npm run build
```

--------------------------------

### Python: Add Vendors

Source: https://preview.keenthemes.com/django/metronic/docs/theme-api

Add multiple vendors to the page by name. Accepts a list of vendor names to include their associated assets (JS/CSS). Refer to settings.KT_THEME_VENDORS for available vendors.

```python
KTTheme.addVendors(vendors)
```

--------------------------------

### Python: Add Vendor

Source: https://preview.keenthemes.com/django/metronic/docs/theme-api

Add single vendor to the page by name. Allows adding a specific third-party library's assets by its name. Refer to settings.KT_THEME_VENDORS for details.

```python
KTTheme.addVendor(vendor)
```

--------------------------------

### Django URL Configuration for My Page

Source: https://preview.keenthemes.com/django/metronic/docs/templates

Python code for the mypage/urls.py file, defining URL patterns for the 'mypage' app. It includes a URL for the index view and specifies the name for the app.

```python
from django.urls import path
from mypage.views import MypageView

app_name = 'mypage'

urlpatterns = [
    # ...

    path('', MypageView.as_view(template_name = 'template-path.html'), name='index'),

    # ...
]
```

--------------------------------

### Django View for Dashboards

Source: https://preview.keenthemes.com/django/metronic/docs/templates

Python code for a Django view to render dashboard pages. It uses TemplateView and KTLayout for context initialization, specifying the default template file for dashboard-1.

```python
from django.views.generic import TemplateView
from _keenthemes.__init__ import KTLayout

class DashboardsView(TemplateView):
    # Default template file
    # Refer to dashboards/urls.py file for more pages and template files
    template_name = 'dashboards/dashboard-1.html'

    # Predefined function
    def get_context_data(self, **kwargs):
        # Call the base implementation first to get a context
        context = super().get_context_data(**kwargs)

        # A function to init the global layout. It is defined in _keenthemes/__init__.py file
        context = KTLayout.init(context)

        return context
```

--------------------------------

### Add Single Javascript File (Django)

Source: https://preview.keenthemes.com/django/metronic/docs/assets

This snippet demonstrates how to include a single custom JavaScript file from the assets folder using KTTheme.addJavascriptFile. The path is relative to the assets directory.

```python
KTTheme.addJavascriptFile('js/custom/intro.js')
```

--------------------------------

### Add Single CSS File (Django)

Source: https://preview.keenthemes.com/django/metronic/docs/assets

This snippet shows how to add a single custom CSS file from the assets folder using KTTheme.addCssFile. The path is relative to the assets directory.

```python
KTTheme.addCssFile('plugins/custom/cookiealert/cookiealert.bundle.css')
```

--------------------------------

### Include App URLs in Root URLconf

Source: https://preview.keenthemes.com/django/metronic/docs/templates

Python code snippet for the main _keenthemes/urls.py file to include the URLs from the 'mypage' application. This integrates the custom app's routing into the project.

```python
from django.contrib import admin
from django.urls import include, path

urlpatterns = [
    # ...

    # Mypage urls
    path('', include('mypage.urls')),

    # ...
]
```

--------------------------------

### Python: Set Layout View

Source: https://preview.keenthemes.com/django/metronic/docs/theme-api

Set the current page layout and init the layout bootstrap file. This function is crucial for defining the overall page structure and initializing layout-specific scripts.

```python
KTTheme.setLayoutView(view)
```

--------------------------------

### Python: Include Favicon

Source: https://preview.keenthemes.com/django/metronic/docs/theme-api

Include favicon from settings. This function renders the HTML tag for the favicon, using the path defined in the theme's settings.

```python
KTTheme.includeFavicon()
```

--------------------------------

### Django Template Include Partial

Source: https://preview.keenthemes.com/django/metronic/docs/templates

Django template syntax for including a layout partial. This directive allows for modular template design by importing reusable template fragments.

```django
{% include './partials/aside/_base.html' %}
```

--------------------------------

### Python: Add CSS File

Source: https://preview.keenthemes.com/django/metronic/docs/theme-api

Add custom CSS file to the page. Registers a custom CSS file to be linked or included in the HTML output.

```python
KTTheme.addCssFile(file)
```

--------------------------------

### Python: Set Default Mode

Source: https://preview.keenthemes.com/django/metronic/docs/theme-api

Set the default theme mode. Supported values are 'light', 'dark', and 'system'. This determines the initial theme appearance.

```python
KTTheme.setModeDefault(mode)
```

--------------------------------

### Python: Include Fonts

Source: https://preview.keenthemes.com/django/metronic/docs/theme-api

Include the fonts from settings. This function generates the necessary HTML to load font files as specified in the theme's configuration.

```python
KTTheme.includeFonts()
```

--------------------------------

### Python: Add Javascript File

Source: https://preview.keenthemes.com/django/metronic/docs/theme-api

Add custom javascript file to the page. This function registers a custom JavaScript file to be included in the page's output.

```python
KTTheme.addJavascriptFile(file)
```

--------------------------------

### Python: Print HTML Classes

Source: https://preview.keenthemes.com/django/metronic/docs/theme-api

Print HTML classes for the HTML template. This function generates the string of CSS classes for a given scope, suitable for direct use in HTML.

```python
printHtmlClasses("body", False)
```

--------------------------------

### Python: Print HTML Attributes

Source: https://preview.keenthemes.com/django/metronic/docs/theme-api

Print HTML attributes for the HTML template. This function outputs the HTML attributes that have been set for a specific scope, intended for template rendering.

```python
KTTheme.printHtmlAttributes("body")
```

--------------------------------

### Django Template Tag: Include Favicon

Source: https://preview.keenthemes.com/django/metronic/docs/theme-api

Function to print the favicon URL. This tag is useful for linking the favicon in the HTML head section of your Django web pages.

```django
<link rel="shortcut icon" href="{% includeFavicon %}"/>
```

--------------------------------

### Django Template Tag: Print HTML Attributes

Source: https://preview.keenthemes.com/django/metronic/docs/theme-api

Print HTML attribute based on the scope. This tag is used to output HTML attributes for a given scope, useful for dynamic attribute generation.

```django
{% printHtmlAttributes as 'body' %}
```

--------------------------------

### Python: Set Direction

Source: https://preview.keenthemes.com/django/metronic/docs/theme-api

Set style direction. This function configures the text direction for the application, accepting 'ltr' (left-to-right) or 'rtl' (right-to-left).

```python
KTTheme.setDirection(direction)
```

--------------------------------

### Python: Add Multiple HTML Attributes

Source: https://preview.keenthemes.com/django/metronic/docs/theme-api

Add multiple HTML attributes by scope. This function enables adding several HTML attributes to an element at once, using a dictionary or similar structure.

```python
KTTheme.addHtmlAttributes("body", attributes)
```

--------------------------------

### Django Template Tag: Include Fonts

Source: https://preview.keenthemes.com/django/metronic/docs/theme-api

Function to include fonts HTML. This template tag is used within Django templates to render the necessary HTML for including font files.

```django
{% includeFonts %}
```

--------------------------------

### Django Template Tag: Print HTML Classes

Source: https://preview.keenthemes.com/django/metronic/docs/theme-api

Print HTML classes based on the scope. This template tag helps in rendering specific CSS classes for HTML elements, often tied to page sections or scopes.

```django
{% printHtmlClasses 'body' %}
```

--------------------------------

### Python: Extend CSS Filename

Source: https://preview.keenthemes.com/django/metronic/docs/theme-api

Extend CSS file name with RTL or dark mode. This utility modifies CSS filenames to reflect RTL settings or dark mode, ensuring correct asset loading.

```python
KTTheme.extendCssFilename(path)
```

--------------------------------

### Python: Set Mode Switch

Source: https://preview.keenthemes.com/django/metronic/docs/theme-api

Enable or disable the theme mode switch. This function controls the visibility and functionality of the light/dark mode toggle in the UI.

```python
KTTheme.setModeSwitch(flag)
```

--------------------------------

### Python: Add HTML Attribute

Source: https://preview.keenthemes.com/django/metronic/docs/theme-api

Add HTML attributes by scope. This Python function allows you to programmatically add HTML attributes to specific elements identified by a scope (e.g., 'body', 'header').

```python
KTTheme.addHtmlAttribute("body", "data-kt-app-sidebar-fixed", "true")
```

--------------------------------

### Python: Is Mode Switch Enabled

Source: https://preview.keenthemes.com/django/metronic/docs/theme-api

Check the theme mode switch status. Returns a boolean indicating whether the mode switch feature is currently active.

```python
KTTheme.isModeSwitchEnabled()
```

--------------------------------

### Python: Add HTML Class

Source: https://preview.keenthemes.com/django/metronic/docs/theme-api

Add HTML class by scope. This function is used to append CSS classes to HTML elements, targeting them via their scope.

```python
KTTheme.addHtmlClass("body", "app-default")
```

--------------------------------

### Python: Is RTL Direction

Source: https://preview.keenthemes.com/django/metronic/docs/theme-api

Check if style direction is RTL. This function returns true if the current text direction is set to Right-to-Left.

```python
KTTheme.isRtlDirection()
```

--------------------------------

### Django Template Tag: Is RTL Direction

Source: https://preview.keenthemes.com/django/metronic/docs/theme-api

Check current text direction based on the settings. This tag returns a boolean indicating if the current text direction is Right-to-Left (RTL).

```django
{% isRtlDirection %}
```
Tokens:
Raw