Skip to main content

CKEditor 5 for django labtrendig to s3.

Project description

Django CKEditor 5

CKEditor 5 for Django >= 2.0

Quick start

.. code-block:: bash

    pip install django-ckeditor-5

*** S3

AWS_STORAGE_BUCKET_NAME AWS_PUBLIC_MEDIA_LOCATION

  1. Add "django_ckeditor_5" to your INSTALLED_APPS setting like this:

.. code-block:: python

    INSTALLED_APPS = [
        ...
        'django_ckeditor_5',
    ]
  1. Include the app URLconf in your project urls.py like this:

.. code-block:: python

   urlpatterns += [ 
       path("ckeditor5/", include('django_ckeditor_5.urls')),
   ] + static(settings.MEDIA_URL, document_root=settings.MEDIA_ROOT)
  1. Add to your settings.py:

.. code-block:: python

  STATIC_URL = '/static/'
  MEDIA_URL = '/media/'
  MEDIA_ROOT = os.path.join(BASE_DIR, 'media')

  customColorPalette = [
        {
            'color': 'hsl(4, 90%, 58%)',
            'label': 'Red'
        },
        {
            'color': 'hsl(340, 82%, 52%)',
            'label': 'Pink'
        },
        {
            'color': 'hsl(291, 64%, 42%)',
            'label': 'Purple'
        },
        {
            'color': 'hsl(262, 52%, 47%)',
            'label': 'Deep Purple'
        },
        {
            'color': 'hsl(231, 48%, 48%)',
            'label': 'Indigo'
        },
        {
            'color': 'hsl(207, 90%, 54%)',
            'label': 'Blue'
        },
    ]

  CKEDITOR_5_CUSTOM_CSS = 'path_to.css' # optional
  CKEDITOR_5_CONFIGS = { 
    'default': {
        'toolbar': ['heading', '|', 'bold', 'italic', 'link',
                    'bulletedList', 'numberedList', 'blockQuote', 'imageUpload', ],

    },
    'extends': {
        'blockToolbar': [
            'paragraph', 'heading1', 'heading2', 'heading3',
            '|',
            'bulletedList', 'numberedList',
            '|',
            'blockQuote', 'imageUpload'
        ],
        'toolbar': ['heading', '|', 'outdent', 'indent', '|', 'bold', 'italic', 'link', 'underline', 'strikethrough',
        'code','subscript', 'superscript', 'highlight', '|', 'codeBlock',
                    'bulletedList', 'numberedList', 'todoList', '|',  'blockQuote', 'imageUpload', '|',
                    'fontSize', 'fontFamily', 'fontColor', 'fontBackgroundColor', 'mediaEmbed', 'removeFormat',
                    'insertTable',],
        'image': {
            'toolbar': ['imageTextAlternative', 'imageTitle', '|', 'imageStyle:alignLeft', 'imageStyle:full',
                        'imageStyle:alignRight', 'imageStyle:alignCenter', 'imageStyle:side',  '|'],
            'styles': [
                'full',
                'side',
                'alignLeft',
                'alignRight',
                'alignCenter',
            ]

        },
        'table': {
            'contentToolbar': [ 'tableColumn', 'tableRow', 'mergeTableCells',
            'tableProperties', 'tableCellProperties' ],
            'tableProperties': {
                'borderColors': customColorPalette,
                'backgroundColors': customColorPalette
            },
            'tableCellProperties': {
                'borderColors': customColorPalette,
                'backgroundColors': customColorPalette
            }
        },
        'heading' : {
            'options': [
                { 'model': 'paragraph', 'title': 'Paragraph', 'class': 'ck-heading_paragraph' },
                { 'model': 'heading1', 'view': 'h1', 'title': 'Heading 1', 'class': 'ck-heading_heading1' },
                { 'model': 'heading2', 'view': 'h2', 'title': 'Heading 2', 'class': 'ck-heading_heading2' },
                { 'model': 'heading3', 'view': 'h3', 'title': 'Heading 3', 'class': 'ck-heading_heading3' }
            ]
        }
    }
}
  1. Add to your models.py:

.. code-block:: python

    from django.db import models
    from django_ckeditor_5.fields import CKEditor5Field
    
    
    class Article(models.Model):
        title=models.CharField('Title', max_length=200)
        text=CKEditor5Field('Text', config_name='extends')

Includes the following ckeditor5 plugins:

        Essentials,
        UploadAdapter,
        Autoformat,
        Bold,
        Italic,
        Underline,
        Strikethrough, Code, Subscript, Superscript,
        BlockQuote,
        Heading,
        Image,
        ImageCaption,
        ImageStyle,
        ImageToolbar,
        ImageUpload,
        ImageResize,
        Link,
        List,
        Paragraph,
        Alignment,
        Font,
        PasteFromOffice,
        SimpleUploadAdapter,
        MediaEmbed,
        RemoveFormat,
        Table, TableToolbar,
        TableProperties, TableCellProperties,
        Indent, IndentBlock,
        Highlight,
        TodoList,
        ImageTitle

Project details


Download files

Download the file for your platform. If you're not sure which to choose, learn more about installing packages.

Source Distribution

ckeditor5_trendig-0.6.2.tar.gz (1.4 MB view details)

Uploaded Source

Built Distribution

ckeditor5_trendig-0.6.2-py3-none-any.whl (1.4 MB view details)

Uploaded Python 3

File details

Details for the file ckeditor5_trendig-0.6.2.tar.gz.

File metadata

  • Download URL: ckeditor5_trendig-0.6.2.tar.gz
  • Upload date:
  • Size: 1.4 MB
  • Tags: Source
  • Uploaded using Trusted Publishing? No
  • Uploaded via: twine/4.0.1 CPython/3.9.10

File hashes

Hashes for ckeditor5_trendig-0.6.2.tar.gz
Algorithm Hash digest
SHA256 c26d8d882b245cdf1da80af79af02111d0609c1aa0dc06d110e5497fe363fa58
MD5 1bdd7493c73d74af8c623871a06dbfd7
BLAKE2b-256 a87adb510d47b0960112480d4d08ef47dd988566fa1370e4fc2f01336893fcc0

See more details on using hashes here.

File details

Details for the file ckeditor5_trendig-0.6.2-py3-none-any.whl.

File metadata

File hashes

Hashes for ckeditor5_trendig-0.6.2-py3-none-any.whl
Algorithm Hash digest
SHA256 41f3d87528bc2469c76c22b4e7016d5d970bc30487b5995fc2bdabf2e701c196
MD5 ed4ec3ea1d1ccc0b3a42f26cafcebf37
BLAKE2b-256 050ce780646d89951e9018a1f6bc8029ebae6f9bcd0e469ac34cbfe6297f7111

See more details on using hashes here.

Supported by

AWS AWS Cloud computing and Security Sponsor Datadog Datadog Monitoring Fastly Fastly CDN Google Google Download Analytics Microsoft Microsoft PSF Sponsor Pingdom Pingdom Monitoring Sentry Sentry Error logging StatusPage StatusPage Status page