diff --git a/docs/guides/devguides/slots_and_blocks.md b/docs/guides/devguides/slots_and_blocks.md index 959b99bf..5b7630be 100644 --- a/docs/guides/devguides/slots_and_blocks.md +++ b/docs/guides/devguides/slots_and_blocks.md @@ -5,44 +5,44 @@ template was inlined. So if the "included" template contains `slot` tags, then the component uses those slots. - So if you have a template `abc.html`: - ```django -
- hello - {% slot "body" %}{% endslot %} -
- ``` + So if you have a template `abc.html`: + ```django +
+ hello + {% slot "body" %}{% endslot %} +
+ ``` - And components that make use of `abc.html` via `include` or `extends`: - ```py - from django_components import Component, register + And components that make use of `abc.html` via `include` or `extends`: + ```py + from django_components import Component, register - @register("my_comp_extends") - class MyCompWithExtends(Component): - template = """{% extends "abc.html" %}""" + @register("my_comp_extends") + class MyCompWithExtends(Component): + template = """{% extends "abc.html" %}""" - @register("my_comp_include") - class MyCompWithInclude(Component): - template = """{% include "abc.html" %}""" - ``` + @register("my_comp_include") + class MyCompWithInclude(Component): + template = """{% include "abc.html" %}""" + ``` - Then you can set slot fill for the slot imported via `include/extends`: + Then you can set slot fill for the slot imported via `include/extends`: - ```django - {% component "my_comp_extends" %} - {% fill "body" %} - 123 - {% endfill %} - {% endcomponent %} - ``` + ```django + {% component "my_comp_extends" %} + {% fill "body" %} + 123 + {% endfill %} + {% endcomponent %} + ``` - And it will render: - ```html -
- hello - 123 -
- ``` + And it will render: + ```html +
+ hello + 123 +
+ ``` 2. Slot and block