Skip to content

Commit d1964a7

Browse files
committed
Fix errors
1 parent c0f7c0b commit d1964a7

File tree

4 files changed

+48
-53
lines changed

4 files changed

+48
-53
lines changed

docs/source/tutorial/builtin_components.rst

Lines changed: 26 additions & 26 deletions
Original file line numberDiff line numberDiff line change
@@ -63,32 +63,32 @@ Configuration
6363
Open your Django project's ``settings.py`` and add the following applications to ``INSTALLED_APPS`` -
6464
you only need (and should) add the components you want content editors to use:
6565

66-
.. code-block:: python
67-
68-
INSTALLED_APPS = [
69-
# Optional dependencies
70-
'djangocms_icon',
71-
'easy_thumbnails',
72-
'djangocms_link', # Required if djangocms_frontend.contrib.link is used
73-
# Main frontend components
74-
'djangocms_frontend',
75-
'djangocms_frontend.contrib.accordion',
76-
'djangocms_frontend.contrib.alert',
77-
'djangocms_frontend.contrib.badge',
78-
'djangocms_frontend.contrib.card',
79-
'djangocms_frontend.contrib.carousel',
80-
'djangocms_frontend.contrib.collapse',
81-
'djangocms_frontend.contrib.component',
82-
'djangocms_frontend.contrib.content',
83-
'djangocms_frontend.contrib.grid',
84-
'djangocms_frontend.contrib.icon',
85-
'djangocms_frontend.contrib.image',
86-
'djangocms_frontend.contrib.jumbotron',
87-
'djangocms_frontend.contrib.link',
88-
'djangocms_frontend.contrib.listgroup',
89-
'djangocms_frontend.contrib.media',
90-
'djangocms_frontend.contrib.tabs',
91-
'djangocms_frontend.contrib.utilities',
66+
.. code-block:: python
67+
68+
INSTALLED_APPS = [
69+
# Optional dependencies
70+
'djangocms_icon',
71+
'easy_thumbnails',
72+
'djangocms_link', # Required if djangocms_frontend.contrib.link is used
73+
# Main frontend components
74+
'djangocms_frontend',
75+
'djangocms_frontend.contrib.accordion',
76+
'djangocms_frontend.contrib.alert',
77+
'djangocms_frontend.contrib.badge',
78+
'djangocms_frontend.contrib.card',
79+
'djangocms_frontend.contrib.carousel',
80+
'djangocms_frontend.contrib.collapse',
81+
'djangocms_frontend.contrib.component',
82+
'djangocms_frontend.contrib.content',
83+
'djangocms_frontend.contrib.grid',
84+
'djangocms_frontend.contrib.icon',
85+
'djangocms_frontend.contrib.image',
86+
'djangocms_frontend.contrib.jumbotron',
87+
'djangocms_frontend.contrib.link',
88+
'djangocms_frontend.contrib.listgroup',
89+
'djangocms_frontend.contrib.media',
90+
'djangocms_frontend.contrib.tabs',
91+
'djangocms_frontend.contrib.utilities',
9292
]
9393
9494
For example, if you don't want to use any built-in components because you plan on

docs/source/tutorial/custom_components.rst

Lines changed: 19 additions & 24 deletions
Original file line numberDiff line numberDiff line change
@@ -9,37 +9,19 @@ Building Custom CMS Frontend Components
99

1010
.. versionadded:: 2.0
1111

12-
**Custom CMS Frontend components** are a powerful tool for content editors, allowing them to build pages without
13-
needing in-depth knowledge of design, HTML, or nested structures. Editors can simply add content to pre-defined
14-
components, creating visually cohesive pages with ease.
12+
In this tutorial, we will explore how to create custom **CMS Frontend Components**. These are more
13+
versatile than :ref:`template_components`, but require some minimal Python coding.
1514

16-
`djangocms-frontend` provides a simple way for developers to create **custom Frontend CMS Components**,
17-
by subclassing the `CMSFrontendComponent` class and providing a custom template.
18-
This approach requires minimal
19-
Python coding, while still offering flexibility and control over the component's behavior and appearance.
20-
21-
22-
23-
24-
In this tutorial, we will explore how to create custom **CMS Frontend Components**.
25-
These components empower developers to provide visually appealing components to content editors
26-
with minimal coding.
27-
28-
- Components are defined by subclassing the `CMSFrontendComponent` class.
29-
- Visual presentation is controlled via templates.
30-
- Django CMS allows to register and manage these components seamlessly.
31-
32-
Custom frontend components are more versatile than :ref:`template_components`, but require some minimal
33-
Python coding. Technically, you create a custom frontend component by declaring its change form and
34-
rendering template.
15+
You create a custom frontend component by subclassing the ``CMSFrontendComponent`` class to
16+
declare the form, plus providing a rendering template, and `djangocms-frontend` will take care
17+
integrating it automatically.
3518

3619

3720
Hero CMS component example
3821
==========================
3922

4023
In this tutorial we will create again a **Hero component** similar to the one in the
41-
:ref:`previous chapter <template_components>`, but this time with python code.
42-
24+
:ref:`previous chapter <template_components>`, but this time via code.
4325

4426
Directory Structure
4527
-------------------
@@ -190,3 +172,16 @@ the resulting plugin class with the exception of ``get_render_template()``. Simi
190172
Python code the model class, in this case with the exception of ``get_short_description()``.
191173

192174
For maximun flexibility in your customized components, you can build a :ref:`custom Plugin<how-to-add-frontend-plugins>`.
175+
176+
177+
Conclusion
178+
==========
179+
180+
In this tutorial, we explored how to create custom frontend components. These components empower developers to
181+
provide visually appealing components to content editors with minimal coding.
182+
183+
By following the steps outlined above, you can:
184+
185+
- Define components using the `CMSFrontendComponent` class.
186+
- Leverage templates to control the visual presentation of your components.
187+
- Register and manage your components seamlessly within django CMS.

docs/source/tutorial/index.rst

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -18,7 +18,7 @@ that gets the job done for your project.
1818
added to your project's ``INSTALLED_APPS``.
1919

2020
2. **Template Components** – The easiest approach creating or porting your own
21-
custom components, allowing you **define them by their HTML templates, without any code**. Special
21+
custom components, allowing you to define them by their **HTML templates, without any code**. Special
2222
``djangocms-frontend`` tags are used to provide the additional declarative information
2323
needed. This is the fastest approach to create ``djangocms-frontend`` components.
2424
Template-based (or auto) components are auto-detected.

docs/source/tutorial/template_components.rst

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -31,7 +31,7 @@ Directory Structure
3131
-------------------
3232

3333
`djangocms-frontend` will **automatically locate and register template components** by looking for them
34-
**in the `templates/<app_name>/cms_components/` directory** of your installed apps.
34+
in the **``templates/<app_name>/cms_components/``** directory of your installed apps.
3535

3636
Ensure your DjangoCMS app has the following structure::
3737

@@ -45,7 +45,7 @@ Ensure your DjangoCMS app has the following structure::
4545
views.py
4646
admin.py
4747

48-
In this case, `heme_app/templates/theme_app/cms_components/hero.html` will be the template
48+
In this example, ``theme_app/templates/theme_app/cms_components/hero.html`` will be the template
4949
defining our custom hero component.
5050

5151
.. note::

0 commit comments

Comments
 (0)