Introduction
django-inline-media allows insertion of inline media content in your text fields. Based on django-basic-apps/inlines, it provives the following features:
- Inserts pictures and collection of pictures into your texts using the TextAreaWithInlines widget.
- Positions media content at different places and sizes (mini/small/medium/large at left/right or full at the left/center/right).
- Facilitates administration with thumbnails and search by tags, author and license.
- Shows a customised control to insert media content in text fields.
- Uses jquery prettyPhoto to show pictures and galleries when clicking on them.
- Replaces django-wysihtml5 insertImage command with a custom insertInlinePicture.
The following sample shows a centered inline picture set inserted in a text, on mouseover event the first 3 photos unfold:
Run the demo project to see django-inline-media in action.
Quick start
- Get the dependencies:
- In your settings.py:
- Add inline_media, sorl.thumbnail and tagging to INSTALLED_APPS.
- Add THUMBNAIL_BACKEND = "inline_media.sorl_backends.AutoFormatBackend"
- Add THUMBNAIL_FORMAT = "JPEG"
- Create a model with a field of type TextFieldWithInlines.
- Create an admin class for that model by inheriting from both inline_media.admin.AdminTextFieldWithInlinesMixin and Django’s admin.ModelAdmin.
- Optionally, customise inline_media templates by copying them from inline_media/templates/inline_media/ to your inline_media/ folder in your templates directory.
- Run manage.py commands: syncdb, collectstatic, runserver.
- Create two InlineType objects, one for the Picture model and one for the PictureSet model.
- Upload some pictures and create some picture sets.
- Add content to the model using the field TextFieldWithInlines and see that you can insert inline content in the textarea. It will be rendered in the position indicated by the CSS class selected in the dropdown box.
- Hit your app’s URL!
Run the demo in django-inline-media/examples/demo to see an example.
If you prefer to use Wysihtml5 for your textareas (beta):
- Get the widget from Django Wysihtml5.
- In your settings.py:
- Add wysihtml5 to ``INSTALLED_APPS.
- Add WYSIHTML5_CMD_INSERT_IMAGE = "insertInlinePicture"
- Add WYSIHTML5_FUNC_INSERT_IMAGE_DIALOG = "inline_media.widgets.render_insert_inline_picture_dialog"
- Add url(r'^inline-media/', include('inline_media.urls')) to your urls module.
- Create a model with a field of type Wysihtml5TextField.
- Create an admin class for that model by inheriting from both inline_media.admin.AdminWysihtml5TextFieldMixin and Django’s admin.ModelAdmin.
- Hit your app’s URL!
Run the wysihtml5_demo in django-inline-media/examples/demo_wysihtml5 to see an example.