Integration with Wagtail

Wagtail integration is the same as Django, you need to follow these guides :

• Setup with Django

• Add CSS files with Django

Here are the additional steps to be able to add Snoweb SVG in a Wagtail block.

1 - Register snippet

Add the code below to register the SVG model in the wagtail snippets :

from wagtail.snippets.models import register_snippet
from snowebsvg.models import Svg

register_snippet(Svg)

2 - Create a chooser block

Here is an example of a chooser block to be able to choose an SVG from the Wagtail CMS :

from wagtail.snippets.blocks import SnippetChooserBlock
from snowebsvg.models import Svg


class SnowebSvgChooserBlock(SnippetChooserBlock):
    def __init__(self, target_model=Svg, **kwargs):
        super().__init__(target_model, **kwargs)
        self._target_model = target_model

    class Meta:
        icon = 'image'

Now, you can include SnowebSvgChooserBlock like :

class DrawerBlock(blocks.StructBlock):
    svg = SnowebSvgChooserBlock()

3 - Render SVG with Wagtail block template

You can use svg_inline to include an SVG in your Wagtail block template with these parameters :

• svg : instance of SnowebSvgChooserBlock.

• <theme> : 'light' or 'dark', see more at Themes.

• <width> : 100, 100%, auto, see more at SVG width.

• <height> : 100, 100%, auto, see more at SVG height.

• <variant> : 'none' or 'glass', see more at Variant.

• <grid> : True or False, display a grid preview.

• <klass> : Add extra css classes to <svg> element.

{% load svg %}

<a href="#" class="svg-trigger">
    {% svg_inline value.svg '<theme>' '<width>' '<height>' '<variant>' '<grid>' '<klass>' %}
</a>