CODEWITHSUNDEEP
javascriptdjangotinymcetinymce-4django-tinymce
Flobin
Flobin

Reputation: 708

Django-tinymce not loading javascript

I have (tried to) set up django-tinymce in my Django project. However, in the inspector, I don’t see the tinymce.min.js being loaded.

This is in my settings:

STATIC_URL = '/static/'
STATIC_ROOT = os.path.join(BASE_DIR, 'static')
os.environ['DJANGO_LIVE_TEST_SERVER_ADDRESS'] = 'localhost:8123'

# TinyMCE configuration
TINYMCE_JS_ROOT = os.path.join(STATIC_ROOT, "articles/build/lib/node_modules/tinymce")
TINYMCE_JS_URL = os.path.join(TINYMCE_JS_ROOT, "tinymce.min.js")
TINYMCE_COMPRESSOR = False
TINYMCE_DEFAULT_CONFIG = {
    'theme': "modern",
    'toolbar': "undo redo | bold italic | bullist numlist | blockquote | removeformat",
    'menubar': False,
    'statusbar': False,
    'schema': "html5",
    'max_height': 500,
    'max_width': 500,
    'min_height': 100,
    'min_width': 400
}

Removing the TINYMCE_DEFAULT_CONFIG and changing tinymce.min.js into tinymce.js does not change anything—still no tinymce js being loaded.

This is my file structure:

static
  |-src
  |  |-styles
  |  |-scripts
  |  |-images
  |-build
  |  |-css
  |  |-js
  |  |-img
  |  |-lib
  |  |  |-package.json
  |  |  |-node_modules
  |  |  |  |-tinymce
  |  |  |  |  |-tinymce.js
  |  |  |  |  |-more_tinymce_files_here
  |-node_modules
  |-gulpfile.js
  |-package.json

In my template I do have {{ form.media }}, but maybe that‘s the problem.

The full code with templates, settings, urls, etc. is available here.

How can I make sure that the tinymce javascript loads? Or: how can I debug this?

Upvotes: 0

Views: 2155

Answers (3)

Flobin
Flobin

Reputation: 708

As it turns out, the error was in settings.py. The tinymce location needs to be set like this:

TINYMCE_JS_ROOT = "articles/build/lib/node_modules/tinymce"
TINYMCE_JS_URL = os.path.join(TINYMCE_JS_ROOT, "tinymce.js")

Upvotes: 1

Jessamyn Smith
Jessamyn Smith

Reputation: 1649

Is jQuery available? I added adding your ArticleSubmitView into my working tinymce project, without your tinymce config, and I got an error that jQuery was not defined. When I added a script tag for jQuery above your {% block extra_head_stuff %} tag in base.html, the tinymce editor showed up.

Note that this is with the following, default settings:

TINYMCE_SPELLCHECKER = False
TINYMCE_COMPRESSOR = True
TINYMCE_DEFAULT_CONFIG = {
    'theme': "advanced",
    'theme_advanced_buttons3_add': "|,spellchecker",
}

Using your settings, I get an error that tinymce.min.js is not found (though this may be due to me not copying over your static setup).

Upvotes: 0

4140tm
4140tm

Reputation: 2088

From django-tinymce docs:

In your own templates containing a TinyMCE widget you must add the following to the HTML HEAD section (assuming you named your form ‘form’):

<head>
...
{{ form.media }}
</head>

Try {{ articleform.media }}

Upvotes: 0

Related Questions