Wagtail Rich Editor 기능 추가

간단하게 Wagtail 에서 제공하는 RichEditor를 수정해보려고 한다. 

Draftail로 새로운 기능을 만들어서 적용하는 방법도 있지만 일단은 기본 RichEditor에 기능을 추가하는 것만 적어보려고한다.

 

https://docs.wagtail.io/en/stable/advanced_topics/customisation/page_editing_interface.html#rich-text-features

 

1. 모든 RichTextEditor 수정

settings/base.py

WAGTAILADMIN_RICH_TEXT_EDITORS = {
    'default': {
        'WIDGET': 'wagtail.admin.rich_text.DraftailRichTextArea',
        'OPTIONS': {
            'features': [
                'h2', 'bold', 'italic', 'link', 'document-link', 
                'code', 'image', 'embed', 'ol', 'ul'
                ]
        }
    },
    'legacy': {
        'WIDGET': 'wagtail.admin.rich_text.HalloRichTextArea',
    }
}

base.py에서 RichEditor의 features를 정할 수 있다. 

• h1, h2, h3, h4, h5, h6 - heading elements
• bold, italic - bold / italic text
• ol, ul - ordered / unordered lists
• hr - horizontal rules
• link - page, external and email links
• document-link - links to documents
• image - embedded images
• embed - embedded media (see Embedded content)
• code - inline code
• superscript, subscript, strikethrough - text formatting
• blockquote - blockquote

RichEditor에서 제공하는 기능들이다. 이외 필요한 기능이 있다면 직접 만들어서 쓰면 된다. 

관련 기능에 대한 정리는 https://vicapor.tistory.com/55 에서 확인이 가능하다. 

 

 

2. 한개만 적용

banner_subtitle = RichTextField(features=["bold", "italic"], null=True)

특정한 필드만 적용하고 싶을 때는 위와 같이 해주면 된다. 

 

 

추가) 옛날 Editor 적용

그리고 legacy는 RichEditor 옛날 버전이라고 보면 된다. 

적용방법은

body = RichTextField(editor='legacy')

처럼 해주면 된다. 

 

https://docs.wagtail.io/en/stable/reference/settings.html#id15