A Django app that seamlessly integrates EditorJS, a powerful block-styled editor with a clean, intuitive interface.
Project description
django_editorjs2
A Django app that seamlessly integrates EditorJS, a powerful block-styled editor with a clean, intuitive interface.
Django EditorJS2
A Django app that seamlessly integrates EditorJS, a powerful block-styled editor with a clean, intuitive interface.
Features
- Easy integration with Django projects
- Full support for EditorJS block-style editing
- Customizable configuration
- File upload and preprocessing capabilities
- Extensible with custom preprocessors and callbacks
Requirements
- Python 3.8+
- Django 3.2+
Installation
1. Install the Package
pip install django-editorjs2
2. Configure Django Settings
Add django_editorjs2 to your INSTALLED_APPS:
INSTALLED_APPS = [
...
'django_editorjs2',
...
]
3. Configure URL Routing
In your project's urls.py:
from django.urls import path, include
urlpatterns = [
...
path('editorjs/', include('django_editorjs2.urls')),
...
]
4. Configure Media and Static Files
Ensure your MEDIA_URL and STATIC_URL are properly configured in settings.py.
5. Run Migrations
python manage.py migrate
python manage.py collectstatic
6. Add static tag
<head>
....
{{form.media}}
....
</head>
Configuration
Advanced Configuration Options
In your settings.py, you can customize the EditorJS2 behavior:
DJANGO_EDITORJS2_CONFIG = {
# Preprocessors for preview generation
"image_link_preprocessor": "django_editorjs2.blogapp.utils.image_link_preprocessor",
"download_link_preprocessor": "django_editorjs2.blogapp.utils.download_link_preprocessor",
# Custom styling and attributes for different block types
"extra_attributes": {
"list": {"style": "list-style: none"},
"checklist": {"style": "list-style: none"},
"paragraph": {},
"header": {},
"quote": {},
"code": {},
"image": {},
"embed": {},
"table": {},
"delimiter": {},
"attaches": {},
},
# before saving the file, djanog model object EditorJsUploadFiles is passed to this function
"callback_before_file_save": "django_editorjs2.blogapp.utils.callback_before_file_save",
# before returning the response, the response object is passed to this function
"callback_before_return_response": "django_editorjs2.blogapp.utils.callback_before_return_response",
# widget
"editorjs_field_preview_callback": "django_editorjs2.blogapp.utils.editorjs_field_preview_callback",
"editorjs_field_save_callback": "django_editorjs2.blogapp.utils.editorjs_field_save_callback",
"max_attachment_size_bytes": 5 * 1024 * 1024, # 5 MiB
"attachment_file_extensions": ["zip","doc","docx",]
}
Usage Example
from django_editorjs2.fields import EditorJsField
from django.db import models
class Article(models.Model):
title = models.CharField(max_length=200)
content = EditorJsField()
# you can get preview like this
article = Article.objects.first()
# this will render html
article.content_preview()
Customize new EditorJS(Config) Variable
// Override default configuration => new EditorJS(Config)
window.updateEditorJsConfig(config)=>{
return config
}
Custom Preprocessors and Callbacks
You can create custom preprocessors and callbacks to:
- Modify image links
- Handle file downloads
- Add custom processing before file save
- Modify response handling
Troubleshooting
- Ensure all static files are collected
- Check that
MEDIA_URLandSTATIC_URLare correctly configured - Verify path to preprocessors and callbacks
Contributing
Contributions are welcome! Please feel free to submit a Pull Request.
License
MIT License
Support
If you encounter any issues or have questions, please open an issue on GitHub.
Release history Release notifications | RSS feed
Download files
Download the file for your platform. If you're not sure which to choose, learn more about installing packages.
Source Distribution
Built Distribution
Filter files by name, interpreter, ABI, and platform.
If you're not sure about the file name format, learn more about wheel file names.
Copy a direct link to the current filters
File details
Details for the file django_editorjs2-0.3.8.tar.gz.
File metadata
- Download URL: django_editorjs2-0.3.8.tar.gz
- Upload date:
- Size: 171.2 kB
- Tags: Source
- Uploaded using Trusted Publishing? No
- Uploaded via: poetry/1.8.5 CPython/3.13.0 Linux/6.11.10-300.fc41.x86_64
File hashes
| Algorithm | Hash digest | |
|---|---|---|
| SHA256 |
2f66cbf0ac450dec393038fe72550e500ff015ab00afa7fc4bdeaa1f25b7f336
|
|
| MD5 |
4b037b668bb244d5263557f0ad35f32f
|
|
| BLAKE2b-256 |
83c046ed68a8974ad20b08b8a3ee98434e901baa1beef47aceb2b810e6314a6b
|
File details
Details for the file django_editorjs2-0.3.8-py3-none-any.whl.
File metadata
- Download URL: django_editorjs2-0.3.8-py3-none-any.whl
- Upload date:
- Size: 186.5 kB
- Tags: Python 3
- Uploaded using Trusted Publishing? No
- Uploaded via: poetry/1.8.5 CPython/3.13.0 Linux/6.11.10-300.fc41.x86_64
File hashes
| Algorithm | Hash digest | |
|---|---|---|
| SHA256 |
d78089c303bb4d9f8c17f12f77e697edbe03d3df6d56ba2c8015f43c89944564
|
|
| MD5 |
ca0f9b4012fa20ce4770c179fb61a245
|
|
| BLAKE2b-256 |
8f6726aebb876d3175de32b7f043fd5beb4e8a525984d06ab4f4ed4ea56813fb
|
