Skip to main content

Create reusable DaisyUI themes through Wagtail

Project description

Wagtail DaisyUI Interface Editor

Create reusable DaisyUI themes through Wagtail and apply them to pages.

Links

Supported versions

This package supports Wagtail 7.0 and up, and all compatible versions of Python and Django.

Installation

Pick the command for your preferred package installer:

uv add wagtail-daisIE
poetry add wagtail-daisIE
pip install wagtail-daisIE

Quick start

1. Add to INSTALLED_APPS

# myproject/settings.py
INSTALLED_APPS = [
    ...
    "wagtail_daisIE",
    "colorfield",
    ...
]

2. Run migrations

python manage.py migrate

3. Create a theme

In the Wagtail admin, navigate to Snippets > DaisyUI Themes and create a new theme. Configure:

  • Name: A unique identifier (e.g. my-theme)
  • Set as default: Check this to make it the fallback theme
  • Color scheme: light, dark, or normal
  • Colors: Primary, secondary, accent, neutral, base surfaces, semantic colors
  • Border radii: Box, field, selector
  • Sizes: Field, selector, border width
  • Effects: Depth (3D) and noise toggle

4. Use the page mixin

Add DaisyUIThemePageMixin to any Wagtail Page model:

from wagtail.models import Page
from wagtail.admin.panels import FieldPanel
from wagtail_daisIE.models import DaisyUIThemePageMixin


class MyPage(DaisyUIThemePageMixin, Page):
    body = RichTextField()

    content_panels = Page.content_panels + [
        FieldPanel("body"),
        FieldPanel("daisyui_theme"),  # Add the theme selector
    ]

This mixin adds:

  • A daisyui_theme ForeignKey field to DaisyUITheme
  • Automatic injection of daisyui_theme into the page template context
  • A get_daisyui_theme() method that returns the selected theme (or the default theme if none is selected)

5. Render the theme in your templates

Load the template tags and render the theme CSS in <head>:

{% load wagtailcore_tags wagtail_daisIE_tags %}
<!DOCTYPE html>
<html{% if daisyui_theme %} data-theme="{{ daisyui_theme.name }}"{% endif %}>
    <head>
        ...
        {% daisyui_theme_css daisyui_theme %}
    </head>
    <body>
        {% block content %}{% endblock %}
    </body>
</html>

The {% daisyui_theme_css %} tag outputs an inline <style> block with all DaisyUI CSS custom properties for the theme.

Alternatively, use {% daisyui_theme_inline_css %} to get the raw CSS string for custom placement:

<style>
{% daisyui_theme_inline_css daisyui_theme %}
</style>

6. Load DaisyUI and Tailwind CSS

Add DaisyUI and Tailwind CSS to your base template. For a quick setup, use the CDN:

<link href="https://cdn.jsdelivr.net/npm/daisyui@5" rel="stylesheet" type="text/css" />
<script src="https://cdn.jsdelivr.net/npm/@tailwindcss/browser@4"></script>

Or use Django Tailwind CLI:

# settings.py
STATICFILES_DIRS = [BASE_DIR / "assets"]
# Custom CSS paths
TAILWIND_CLI_SRC_CSS = "src/styles/main.css"
TAILWIND_CLI_DIST_CSS = "css/app.css"

# Enable DaisyUI
TAILWIND_CLI_USE_DAISY_UI = True

# Use an already-installed Tailwind binary (e.g. `brew install tailwindcss`)
TAILWIND_CLI_USE_SYSTEM_BINARY = True

# Auto-inject @source directives for editable-installed external apps (opt-in)
TAILWIND_CLI_AUTO_SOURCE_EXTERNAL_APPS = True

Or install via npm and build with your own pipeline:

npm install daisyui @tailwindcss/cli tailwindcss

API reference

DaisyUIThemePageMixin

An abstract Django model mixin for Wagtail Pages.

Fields:

Field Type Description
daisyui_theme ForeignKey(DaisyUITheme) The selected theme, or None

Methods:

Method Returns Description
get_daisyui_theme() DaisyUITheme | None Returns the selected theme, or the default theme if none was selected

Context:

Variable Type Description
daisyui_theme DaisyUITheme | None Available in all page templates

Template tags

Tag Type Output
{% daisyui_theme_css theme %} Inclusion tag Inline <style> block with DaisyUI CSS custom properties
{% daisyui_theme_inline_css theme %} Simple tag Raw CSS string for custom placement

DaisyUITheme

A snippet model representing a DaisyUI theme. Accessible via Snippets in the Wagtail admin.

Properties: name, default, prefers_dark, color_scheme, colors, radii, sizes, effects.

Settings

No Django settings are required. The package works out of the box once added to INSTALLED_APPS.

Development

See CONTRIBUTING.md for development setup and contribution workflow.

Key commands (via just):

just install     # Install Python and Node.js dependencies
just demo        # Run the demo site
just test        # Run tests
just lint        # Run all linters

License

wagtail-daisIE is licensed under the BSD 3-Clause License.

Project details


Download files

Download the file for your platform. If you're not sure which to choose, learn more about installing packages.

Source Distribution

wagtail_daisie-0.1.3.tar.gz (17.1 kB view details)

Uploaded Source

Built Distribution

If you're not sure about the file name format, learn more about wheel file names.

wagtail_daisie-0.1.3-py3-none-any.whl (21.8 kB view details)

Uploaded Python 3

File details

Details for the file wagtail_daisie-0.1.3.tar.gz.

File metadata

  • Download URL: wagtail_daisie-0.1.3.tar.gz
  • Upload date:
  • Size: 17.1 kB
  • Tags: Source
  • Uploaded using Trusted Publishing? Yes
  • Uploaded via: twine/6.1.0 CPython/3.13.13

File hashes

Hashes for wagtail_daisie-0.1.3.tar.gz
Algorithm Hash digest
SHA256 2d71403a5b0bd84e9d5b13a1366f939609edc445fe86065ef9605a0c9cb753ae
MD5 b201fef98010b6b063fd137f1ae56135
BLAKE2b-256 ff3fbc91a55c1d383fdb54d45448ec11a75b2e2c545ba1e098394739c7fbe983

See more details on using hashes here.

Provenance

The following attestation bundles were made for wagtail_daisie-0.1.3.tar.gz:

Publisher: publish.yml on baldwinboy/wagtail-daisIE

Attestations: Values shown here reflect the state when the release was signed and may no longer be current.

File details

Details for the file wagtail_daisie-0.1.3-py3-none-any.whl.

File metadata

  • Download URL: wagtail_daisie-0.1.3-py3-none-any.whl
  • Upload date:
  • Size: 21.8 kB
  • Tags: Python 3
  • Uploaded using Trusted Publishing? Yes
  • Uploaded via: twine/6.1.0 CPython/3.13.13

File hashes

Hashes for wagtail_daisie-0.1.3-py3-none-any.whl
Algorithm Hash digest
SHA256 23bd856ab8c79646844bef0b62087de80c4e5f1a5727e292d43c7e6a98a9a200
MD5 6a27f3c4c510f7fae6ff43b42bcd5a8b
BLAKE2b-256 e606adccc9d6bd24ab26433ee2efec3e8d252557f2e29a6d530c3b2ccfcb04a0

See more details on using hashes here.

Provenance

The following attestation bundles were made for wagtail_daisie-0.1.3-py3-none-any.whl:

Publisher: publish.yml on baldwinboy/wagtail-daisIE

Attestations: Values shown here reflect the state when the release was signed and may no longer be current.

Supported by

AWS Cloud computing and Security Sponsor Datadog Monitoring Depot Continuous Integration Fastly CDN Google Download Analytics Pingdom Monitoring Sentry Error logging StatusPage Status page