Giter VIP home page Giter VIP logo

django-redactor's Introduction

Django-Redactor

This package helps integrate the Redactor Javascript WYSIWYG-editor in Django.

Installation

  1. Add the redactor directory to your Python path.
  2. Add the redactor application to your INSTALLED_APPS setting.

Usage

The redactor app provides a Django widget called RedactorEditor. It is a drop-in replacement for any TextArea widget. Example usage:

from django import forms
from django.db import models

from redactor.widgets import RedactorEditor

class MyForm(forms.Form):
    about_me = forms.CharField(widget=RedactorEditor())

You can also customize any of the Redactor editor's settings when instantiating the widget:

class MyForm(forms.Form):

    about_me = forms.CharField(widget=RedactorEditor(redactor_settings={
        'autoformat': True,
        'overlay': False
    }))

Django-redactor also includes a widget with some some customizations that make it function and look better in the Django admin:

class MyAdmin(admin.ModelAdmin):
    formfield_overrides = {
            models.TextField: {'widget': AdminRedactorEditor},
    }

Finally, you can connect a custom CSS file to the editable area of the editor:

class MyForm(forms.Form):
    about_me = forms.CharField(widget=RedactorEditor(
        redactor_css="styles/text.css")
    )

Paths used to specify CSS can be either relative or absolute. If a path starts with '/', 'http://' or 'https://', it will be interpreted as an absolute path, and left as-is. All other paths will be prepended with the value of the STATIC_URL setting (or MEDIA_URL if static is not defined).

For the sake of convenience, there is also a form field that can be used that accepts the same inputs. This field can be used anywhere forms.CharField can and accepts the same arguments, but always renders a Redactor widget:

from redactor.fields import RedactorField

class MyForm(forms.Form):
    about_me = RedactorField(
        in_admin=True,
        redactor_css="styles/text.css",
        redactor_settings={'overlay': True}
    )

jQuery

The redactor javascript library requires jQuery 1.7 or better to function. By default, jQuery is included as part of the field and widget media. However, this can cause issues where other widgets or forms on a page are using a different version of jQuery. It is possible to exclude jQuery from the media of the redactor field and wdiget if you wish to handle JavaScript dependency management yourself:

class MyForm(forms.Form):
    about_me = RedactorField(include_jquery=False)

Templating

If you are using a redactor widget outside the admin, you'll need to be sure that you render the form's media. Redactor widgets need to include some CSS and JavaScript to work properly:

<form>
    {{ myform.media }}
    {{ myform.as_p }}
    <input type="submit"/>
</form>

Internationalization

If you wish to use Redactor in other languages, you only need to specify the lang setting. The correct javascript language files will be loaded automatically:

class MyForm(forms.Form):

    about_me = forms.CharField(widget=RedactorEditor(redactor_settings={
        'autoformat': True,
        'lang': 'es',
        'overlay': False
    }))

Note

This is a change from version 1.2.1, where the javascript language files needed to be specified by the user.

Django-Redactor is licensed under a Creative Commons Attribution-NonCommercial 3.0 license. However, the noncommercial restrictions of the license (e.g., Section 4(b)) are waived for any user who purchases a legitimate commercial license to the redactor.js library. Open source users are still under the noncommercial clause, but legitimate Imperavi license holders are not.

django-redactor's People

Contributors

hcarvalhoalves avatar mazelife avatar prudnikov avatar

Watchers

 avatar  avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.