Styjun

Followed every step mentioned in https://django-ckeditor.readthedocs.io/en/latest/, but when I view the form, I don't get any editor. Also I did run "python manage.py collectstatic"

settings.py specific to ckeditor.

INSTALLED_APPS = [
 'ckeditor',
 'ckeditor_uploader',
]

STATIC_URL = '/static/' 
STATIC_ROOT = os.path.join(BASE_DIR,"static")
CKEDITOR_BASEPATH = STATIC_ROOT+"/ckeditor/ckeditor"

CKEDITOR_UPLOAD_PATH = "ck_uploads/"
CKEDITOR_IMAGE_BACKEND = "pillow"

MEDIA_URL = STATIC_URL+'media/'

MEDIA_ROOT = os.path.join(STATIC_ROOT,'media')

urls.py

url(r'^ckeditor/', include('ckeditor_uploader.urls')),

forms.py

from ckeditor.widgets import CKEditorWidget

class BlogPostForm(forms.ModelForm):
 class Meta():
 model = BlogPost
 fields = ('title','brief','content','accept_comments','is_public')

 brief = forms.CharField(widget=CKEditorWidget())
 content = forms.CharField(widget=CKEditorWidget())

No suggestions worked so far (including moving the widget definition out of Meta).

I am custom rendering the forms and this is how the field is getting rendered in the form.

 form.details 

Also rendering the whole form using form.as_p didn't make any difference.

This is what the HTML field shows when I use Chrome developer tools --> Elements.

<textarea cols="40" id="id_details" name="details" rows="10" required="" data-processed="0" data-config="&quot;skin&quot;: &quot;moono-lisa&quot;, &quot;toolbar_Basic&quot;: [[&quot;Source&quot;, &quot;-&quot;, &quot;Bold&quot;, &quot;Italic&quot;]], &quot;toolbar_Full&quot;: [[&quot;Styles&quot;, &quot;Format&quot;, &quot;Bold&quot;, &quot;Italic&quot;, &quot;Underline&quot;, &quot;Strike&quot;, &quot;SpellChecker&quot;, &quot;Undo&quot;, &quot;Redo&quot;], [&quot;Link&quot;, &quot;Unlink&quot;, &quot;Anchor&quot;], [&quot;Image&quot;, &quot;Flash&quot;, &quot;Table&quot;, &quot;HorizontalRule&quot;], [&quot;TextColor&quot;, &quot;BGColor&quot;], [&quot;Smiley&quot;, &quot;SpecialChar&quot;], [&quot;Source&quot;]], &quot;toolbar&quot;: &quot;Custom&quot;, &quot;height&quot;: 291, &quot;width&quot;: 835, &quot;filebrowserWindowWidth&quot;: 940, &quot;filebrowserWindowHeight&quot;: 725, &quot;toolbar_Custom&quot;: [[&quot;Bold&quot;, &quot;Italic&quot;, &quot;Underline&quot;], [&quot;NumberedList&quot;, &quot;BulletedList&quot;, &quot;-&quot;, &quot;Outdent&quot;, &quot;Indent&quot;, &quot;-&quot;, &quot;JustifyLeft&quot;, &quot;JustifyCenter&quot;, &quot;JustifyRight&quot;, &quot;JustifyBlock&quot;], [&quot;Link&quot;, &quot;Unlink&quot;], [&quot;RemoveFormat&quot;, &quot;Source&quot;]], &quot;language&quot;: &quot;en-us&quot;" data-external-plugin-resources="[]" data-id="id_details" data-type="ckeditortype"></textarea>

Ck editor

Step 1: pip install django-ckeditor

Step 2: INSTALLED_APPS = ['ckeditor',]

Step 3: GO TO==> models.py and add text field RichTextField

Like this:

from ckeditor.fields import RichTextField

class Post(models.Model):
 author = models.ForeignKey(settings.AUTH_USER_MODEL, on_delete=models.CASCADE)
 title = models.CharField(max_length=200)
 text = RichTextField(blank=True, null=True)

Step 4: python manage.py makemigrations and migrate

Step 5: Now check the admin page, ckeditor is apply in textfield

If you want to add ckeditor in html file

Step 6: in forms.py

class PostForm(forms.ModelForm):
 class Meta:
 model = Post
 fields = ('title','text',)

Step 7: in html file add two line of code:

 safe 
 form.media 

You placed wrong the following two lines.

brief = forms.CharField(widget=CKEditorWidget())
content = forms.CharField(widget=CKEditorWidget())

They must be out of Meta class, so it will be the following.

class BlogPostForm(forms.ModelForm):

 brief = forms.CharField(widget=CKEditorWidget())
 content = forms.CharField(widget=CKEditorWidget())

 class Meta():
 model = BlogPost
 fields = ('title','brief','content','accept_comments','is_public')