Snippets

[keepexploring]

Is your feature request related to a problem? Please describe.
I've currently used quite a bit of HTML sections within the CMS to achieve the formatting that I want on the pages. This is fine, but it is not very user friendly for the client.

Describe the solution you'd like
I'd like to add these as reusable snippets - where the client can edit the content of the snippet. I can see there is this file in the https://github.com/coderedcorp/coderedcms/blob/56a00d2f9ff2628867351c3a74f9d1b06d8bae40/coderedcms/models/snippet_models.py and wondering if there is a recommended approach to add snippets - do I simply seek to override this file? I did not see any documentation on this, but it would be a very useful thing to be able to do.

Describe alternatives you've considered
Currently using raw HTML 'blocks' in some parts in order to achieve what I am looking for.

Additional context
I'm wondering if this is documented anywhere or otherwise if you might be able to point me in the right direction as to the right approach to achieve this.

[vsalvino]

It is recommended, and encouraged, to make your own snippet models. Wagtail has a good documentation about this. And you can also copy our built-in snippet models as an example. See: https://docs.wagtail.org/en/stable/topics/snippets.html

Once you have a snippet model, you can add a snippet chooser to your page model. OR - override our built-in streamfield to add a snippet chooser block for your snippet model. See this issue and this comment in particular for an example of how to override our default streamfield: #305 (comment)

[keepexploring]

Thanks @vsalvino what do you mean by 'add a snippet chooser to your page model', is there an example of this you can point me to? Do you mean essentially making a new template tag and including this?

Thanks for the link to #304, really helpful. In that example of overriding the built-in streamfield. In this example, you have placed 'Myblock' as part of HeroBlock - can you explain this? Is this a specific example to 'Webpage' and how you have built this or is this a general override for all coderedcms pages - I'm trying to find in the repro where you do this. Just wanted to make sure I fully understand if I am doing an override.

[keepexploring]

Oh I see SnippetChooserPanel in the docs now. Thanks!
https://docs.wagtail.org/en/v2.8.1/topics/snippets.html#binding-pages-to-snippets

[keepexploring]

Can I add these to existing pages e.g.

class WebPage(CoderedWebPage):
    class Meta:
        verbose_name = "Web Page"

    template = "coderedcms/pages/web_page.html" 
    content_panels = CoderedWebPage.content_panels + [
        SnippetChooserPanel('mySnippet'),
    ]

Could I use this in an existing coderedcms page without causing any issues? (In order to add my block to all existing pages)?

[keepexploring]

The docs on 'Binding pages to snippets' seems to be about binding data to pages only. Can you add a template to this as well? With the 'Including snippets in template tags' a template seems to be used - which is what I am looking for. Can you just add template = myTemplate.html in the snippet definition or is there something I am missing. Thanks so much!

[keepexploring]

I noticed in the content blocks you have things two part: e.g.

@register_snippet
class Accordion(ClusterableModel):
    """Class for reusable content in a collapsible block."""

    class Meta:
        verbose_name = _("Accordion")
        verbose_name_plural = _("Accordions")

    name = models.CharField(
        max_length=255,
        verbose_name=_("Name"),
    )

    panels = [
        MultiFieldPanel(
            heading=_("Accordion"),
            children=[
                FieldPanel("name"),
            ],
        ),
        InlinePanel("accordion_panels", label=_("Panels")),
    ]

    def __str__(self):
        return self.name

which I have now created my own of and can get it to appear in the admin. And then I found this:

class AccordionBlock(BaseBlock):
    """
    Allows selecting an accordion snippet
    """

    accordion = SnippetChooserBlock("coderedcms.Accordion")

    class Meta:
        template = "coderedcms/blocks/accordion_block.html"
        icon = "bars"
        label = "Accordion"

Which uses SnippetChooserBlock and points to the template. I imagine that this is now added to pages somehow to be accessible from the admin page creation interface. Feels like I am slowly getting there. I have also now found this: https://github.com/coderedcorp/coderedcms/blob/56a00d2f9ff2628867351c3a74f9d1b06d8bae40/coderedcms/blocks/__init__.py where all the blocks are imported. Are you saying that what I need to do is append the CONTENT_STREAMBLOCKS and do:

class WebPage(CoderedWebPage):
    body = StreamField(MY_CONTENT_STREAMBLOCKS, null=True, blank=True)

It's this last part that I'm not quite getting yet - do I need to register all the STREAMBLOCKS again -in the link you shared you say "For custom blocks, you'd have to define the entire streamfield". Is that within a category? e.g. I notice in your example you redefine the LAYOUT_STREAMBLOCKS. What about the NAVIGATION_STREAMBLOCKS and all the other ones? Thanks so much - feels like I am almost there!

[keepexploring]

Finally I found https://github.com/coderedcorp/coderedcms/blob/d4746ef87ce2c1f3e44bd88b7c64969bec51936c/coderedcms/models/page_models.py
and this makes more sense of the example now that you gave in #305
I'll see if I can get this working, I can see this being really nice from a client perspective.

[keepexploring]

Hi @vsalvino where do you define the html for the blocks - e.g. accordion_block.html , I can't see this file in the repository, for example - or the other ones. I'm sure I'm missing something here as still getting familiar with the code base. Trying to see an example to see what template tags you use in the template (to be able to access the data the user created) etc and how that works. Any hints to help me understand this and get this working would be amazing!

I want to define 'blocks' of html, what users can choose the data that go in them (by snippets) and then allow these to be included the codered cos page builder. I get how define a snippet, that works, I see how to define a 'block', but how do you get the data into this html reusable block- the data that the user has created in the snippet? I know this is with template tags, but where are these defined for the snippet model? Do we define something in the snippet model to make this possible? (e.g. a foreign key) There is something I am missing and want to get my head around. Thanks

[keepexploring]

Hi @vsalvino are you able to point in the right direction of how I can get values injected into the template created as part of a new block? Not sure I should open this as a new issue as is just a clarification! Thanks!