# 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](https://editorjs.io/), 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
```bash
pip install django-editorjs2
```
### 2. Configure Django Settings
Add `django_editorjs2` to your `INSTALLED_APPS`:
```python
INSTALLED_APPS = [
...
'django_editorjs2',
...
]
```
### 3. Configure URL Routing
In your project's `urls.py`:
```python
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
```bash
python manage.py migrate
python manage.py collectstatic
```
### 6. Add static tag
```html
<head>
....
{{form.media}}
....
</head>
```
## Configuration
### Advanced Configuration Options
In your `settings.py`, you can customize the EditorJS2 behavior:
```python
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
```python
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()
```
## 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_URL` and `STATIC_URL` are 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](https://github.com/surajsinghbisht054/django_editorjs2/issues) on GitHub.
Raw data
{
"_id": null,
"home_page": "https://github.com/surajsinghbisht054/django_editorjs2",
"name": "django-editorjs2",
"maintainer": null,
"docs_url": null,
"requires_python": ">=3.8",
"maintainer_email": null,
"keywords": "django, editorjs2, editorjs, django-editorjs",
"author": "Suraj Singh Bisht",
"author_email": "surajsinghbisht054@gmail.com",
"download_url": "https://files.pythonhosted.org/packages/53/be/7dad4388eb9a6a1a8b99004ff3fa49fb42a678b04e9d63de120333a50ef0/django_editorjs2-0.3.7.tar.gz",
"platform": null,
"description": "# django_editorjs2\nA Django app that seamlessly integrates EditorJS, a powerful block-styled editor with a clean, intuitive interface.\n\n\n\n\n# Django EditorJS2\n\nA Django app that seamlessly integrates [EditorJS](https://editorjs.io/), a powerful block-styled editor with a clean, intuitive interface.\n\n## Features\n\n- Easy integration with Django projects\n- Full support for EditorJS block-style editing\n- Customizable configuration\n- File upload and preprocessing capabilities\n- Extensible with custom preprocessors and callbacks\n\n## Requirements\n\n- Python 3.8+\n- Django 3.2+\n\n## Installation\n\n### 1. Install the Package\n\n```bash\npip install django-editorjs2\n```\n\n### 2. Configure Django Settings\n\nAdd `django_editorjs2` to your `INSTALLED_APPS`:\n\n```python\nINSTALLED_APPS = [\n ...\n 'django_editorjs2',\n ...\n]\n```\n\n### 3. Configure URL Routing\n\nIn your project's `urls.py`:\n\n```python\nfrom django.urls import path, include\n\nurlpatterns = [\n ...\n path('editorjs/', include('django_editorjs2.urls')),\n ...\n]\n```\n\n### 4. Configure Media and Static Files\n\nEnsure your `MEDIA_URL` and `STATIC_URL` are properly configured in `settings.py`.\n\n### 5. Run Migrations\n\n```bash\npython manage.py migrate\npython manage.py collectstatic\n```\n\n\n### 6. Add static tag\n```html\n<head>\n....\n{{form.media}}\n....\n</head>\n```\n\n## Configuration\n\n### Advanced Configuration Options\n\nIn your `settings.py`, you can customize the EditorJS2 behavior:\n\n```python\nDJANGO_EDITORJS2_CONFIG = {\n # Preprocessors for preview generation\n \"image_link_preprocessor\": \"django_editorjs2.blogapp.utils.image_link_preprocessor\",\n \"download_link_preprocessor\": \"django_editorjs2.blogapp.utils.download_link_preprocessor\",\n \n # Custom styling and attributes for different block types\n \"extra_attributes\": {\n \"list\": {\"style\": \"list-style: none\"},\n \"checklist\": {\"style\": \"list-style: none\"},\n \"paragraph\": {},\n \"header\": {},\n \"quote\": {},\n \"code\": {},\n \"image\": {},\n \"embed\": {},\n \"table\": {},\n \"delimiter\": {},\n \"attaches\": {},\n },\n \n # before saving the file, djanog model object EditorJsUploadFiles is passed to this function\n \"callback_before_file_save\": \"django_editorjs2.blogapp.utils.callback_before_file_save\",\n # before returning the response, the response object is passed to this function\n \"callback_before_return_response\": \"django_editorjs2.blogapp.utils.callback_before_return_response\",\n \n # widget\n \"editorjs_field_preview_callback\": \"django_editorjs2.blogapp.utils.editorjs_field_preview_callback\",\n \"editorjs_field_save_callback\": \"django_editorjs2.blogapp.utils.editorjs_field_save_callback\",\n\n \"max_attachment_size_bytes\": 5 * 1024 * 1024, # 5 MiB\n \"attachment_file_extensions\": [\"zip\",\"doc\",\"docx\",]\n\n}\n```\n\n## Usage Example\n\n```python\nfrom django_editorjs2.fields import EditorJsField\nfrom django.db import models\n\nclass Article(models.Model):\n title = models.CharField(max_length=200)\n content = EditorJsField()\n \n# you can get preview like this\narticle = Article.objects.first()\n# this will render html\narticle.content_preview()\n```\n\n## Custom Preprocessors and Callbacks\n\nYou can create custom preprocessors and callbacks to:\n- Modify image links\n- Handle file downloads\n- Add custom processing before file save\n- Modify response handling\n\n## Troubleshooting\n\n- Ensure all static files are collected\n- Check that `MEDIA_URL` and `STATIC_URL` are correctly configured\n- Verify path to preprocessors and callbacks\n\n## Contributing\n\nContributions are welcome! Please feel free to submit a Pull Request.\n\n## License\n\nMIT License\n\n## Support\n\nIf you encounter any issues or have questions, please [open an issue](https://github.com/surajsinghbisht054/django_editorjs2/issues) on GitHub.\n",
"bugtrack_url": null,
"license": "MIT",
"summary": "A Django app that seamlessly integrates EditorJS, a powerful block-styled editor with a clean, intuitive interface.",
"version": "0.3.7",
"project_urls": {
"Documentation": "https://github.com/surajsinghbisht054/django_editorjs2/blob/main/README.md",
"Homepage": "https://github.com/surajsinghbisht054/django_editorjs2",
"Repository": "https://github.com/surajsinghbisht054/django_editorjs2"
},
"split_keywords": [
"django",
" editorjs2",
" editorjs",
" django-editorjs"
],
"urls": [
{
"comment_text": "",
"digests": {
"blake2b_256": "333d6cf8ccb8e29a2c82a3e9c2b152956cc026e86739a4bfaee048136b869e54",
"md5": "67149a781c3a1426d8bdf44f6b43e1f3",
"sha256": "7fc32f5abbf87c7e61ed37892c0bc2ec865501035096a2e10210da832907d425"
},
"downloads": -1,
"filename": "django_editorjs2-0.3.7-py3-none-any.whl",
"has_sig": false,
"md5_digest": "67149a781c3a1426d8bdf44f6b43e1f3",
"packagetype": "bdist_wheel",
"python_version": "py3",
"requires_python": ">=3.8",
"size": 186102,
"upload_time": "2025-01-22T16:25:07",
"upload_time_iso_8601": "2025-01-22T16:25:07.758300Z",
"url": "https://files.pythonhosted.org/packages/33/3d/6cf8ccb8e29a2c82a3e9c2b152956cc026e86739a4bfaee048136b869e54/django_editorjs2-0.3.7-py3-none-any.whl",
"yanked": false,
"yanked_reason": null
},
{
"comment_text": "",
"digests": {
"blake2b_256": "53be7dad4388eb9a6a1a8b99004ff3fa49fb42a678b04e9d63de120333a50ef0",
"md5": "437a784a1a94350797ab3edc4f5b9420",
"sha256": "4aef1879ffffdeaf33238a6059e1b4970cf1608259bafe3839c83c55a2470eea"
},
"downloads": -1,
"filename": "django_editorjs2-0.3.7.tar.gz",
"has_sig": false,
"md5_digest": "437a784a1a94350797ab3edc4f5b9420",
"packagetype": "sdist",
"python_version": "source",
"requires_python": ">=3.8",
"size": 170531,
"upload_time": "2025-01-22T16:25:12",
"upload_time_iso_8601": "2025-01-22T16:25:12.546032Z",
"url": "https://files.pythonhosted.org/packages/53/be/7dad4388eb9a6a1a8b99004ff3fa49fb42a678b04e9d63de120333a50ef0/django_editorjs2-0.3.7.tar.gz",
"yanked": false,
"yanked_reason": null
}
],
"upload_time": "2025-01-22 16:25:12",
"github": true,
"gitlab": false,
"bitbucket": false,
"codeberg": false,
"github_user": "surajsinghbisht054",
"github_project": "django_editorjs2",
"travis_ci": false,
"coveralls": false,
"github_actions": false,
"lcname": "django-editorjs2"
}