Markdown meets django CMS

We've all been there. You ask Claude to draft a blog post, it hands you beautifully formatted Markdown -- headings, code blocks, tables, the works -- and then you paste it into your CMS rich text editor. Luckily, with modern rich text editors, formatting does not break any more. However, often additional, undesired formatting is included: footnotes to references, data attributes for the internal workings of the website. Stuff, that is entirely independent of the content and its meaning.

djangocms-markdown fixes this. It brings a proper Markdown editing and rendering pipeline to django CMS -- as a plugin, a model field, and a template filter.

The AI content problem

Let's be honest: a growing share of draft content starts its life as Markdown. AI assistants output Markdown by default. Developers think in Markdown. Technical writers prefer it. And Markdown has a killer feature for content management: diffs that make sense. When you compare two versions of a Markdown document, you see exactly what changed. Try that with rich text HTML.

djangocms-markdown lets you keep content in the format it was created in. Paste AI-generated Markdown directly into the editor, tweak it, publish. No reformatting gymnastics.

What's in the box

Drop-in CMS plugin

Add a Markdown block to any django CMS placeholder. It nicely lives next to djangocms-text. The editor is EasyMDE – toolbar, live preview, side-by-side editing, the whole package. 

Out of the box, your Markdown renders with support for tables, fenced code blocks with syntax highlighting, footnotes, definition lists, abbreviations, table of contents, strike-through, and task lists. No configuration needed.

MarkdownField for your custom models

Building a blog? A knowledge base? A documentation system? Use MarkdownField anywhere you'd use a TextField:

from djangocms_markdown.fields import MarkdownField

classArticle(models.Model):
    body = MarkdownField() 

Store raw Markdown, access rendered HTML:

article.body           # "## Hello\n\nSome bold text."
article.body.rendered  # "<h2>Hello</h2>\n<p>Some <strong>bold</strong> text.</p>"

The admin form automatically gets the Markdown editor. Your templates automatically get sanitized HTML.

This pull request primarily focuses on standardizing and improving vertical spacing across headings, paragraphs, and other text elements throughout the project, especially by ensuring consistent use of the mb-0 (margin-bottom: 0) utility class. Additionally, it introduces some minor code style and readability improvements in the Python component definitions.

Styling and Spacing Consistency:

• Added mb-0 (margin-bottom: 0) classes to various headings, paragraphs, and other elements in multiple templates to ensure consistent vertical spacing, especially in blog, client card, carousel, counter, CTA panel, features, and footer components. [1] [2] [3] [4] [5] [6] [7] [8] [9] [10] [11] [12] [13] [14] [15] [16]

• Removed the global paragraph margin override and related margin-bottom rules from the main SCSS overrides to allow for more granular control using utility classes.

Python Code Quality and Readability:

• Improved import ordering and formatting for clarity in cms_theme/cms_components.py.

• Reformatted long argument lists and help texts for better readability in slot and field definitions. [1] [2] [3]

• Added frontend_editable_fields to a component's Meta class for better inline editing support.

• Refactored some methods and validation logic for improved readability and maintainability. [1] [2]

Summary by Sourcery

Standardize typography spacing across templates and improve CMS component configurability and readability.

New Features:

• Enable inline editing for CTA panel headings by adding frontend_editable_fields and inline_field usage.

Enhancements:

• Align vertical spacing across headings and paragraphs by adding mb-0 utility classes in multiple blog and CMS templates.

• Remove global paragraph and heading margin overrides from SCSS in favour of utility-class-based spacing control.

• Tidy CMS component definitions by reordering imports and reformatting field, slot, and validation logic for clarity.