I visited http://summernote.org/examples/#codemirror-as-codeview , but I still can't get codemirror to work. I'm getting 200 responses from all the codemirror css and javascript, but I still get blank when I press code view. Here's my SUMMER_NOTE config.
SUMMERNOTE_CONFIG = {
'toolbar': [
['cmds', ['undo', 'redo', 'clear']],
['style', ['style']],
['font', ['bold', 'italic', 'underline', 'strikethrough']],
['font2', ['superscript', 'subscript']],
['color', ['color']],
['para', ['ul','ol']],
['layout', ['hr', 'table']],
['insert', ['link', 'picture']],
['misc', ['codeview']],
],
'width': '100%',
'css': (
'//cdnjs.cloudflare.com/ajax/libs/codemirror/3.20.0/codemirror.css',
'//cdnjs.cloudflare.com/ajax/libs/codemirror/3.20.0/theme/monokai.css',
),
'js': (
'//cdnjs.cloudflare.com/ajax/libs/codemirror/3.20.0/codemirror.js',
'//cdnjs.cloudflare.com/ajax/libs/codemirror/3.20.0/mode/xml/xml.js',
'//cdnjs.cloudflare.com/ajax/libs/codemirror/2.36.0/formatting.js',
),
'codemirror': {
'theme': 'monokai',
}
}
Is this the right way to configure?
I found out that js
loads after default_js
, so you have to load all the codemirror scripts before summernote.min.js
. Here's the <head>
tags inside the <iframe>
loading those files both ways, I added the comments.
<!-- Loaded via js and css (doesn't work) -->
<head>
<title>django-summernote frame</title>
<!-- From default_css -->
<link href="//netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap.min.css" rel="stylesheet">
<link href="/static/django_summernote/summernote.css" rel="stylesheet">
<link href="/static/django_summernote/django_summernote.css" rel="stylesheet">
<!-- End default_css -->
<!-- From css -->
<link href="//cdnjs.cloudflare.com/ajax/libs/codemirror/3.20.0/codemirror.css" rel="stylesheet">
<link href="//cdnjs.cloudflare.com/ajax/libs/codemirror/3.20.0/theme/monokai.css" rel="stylesheet">
<!-- end css -->
<!-- From default_js -->
<script src="//code.jquery.com/jquery-1.9.1.min.js"></script>
<script src="//netdna.bootstrapcdn.com/bootstrap/3.1.1/js/bootstrap.min.js"></script>
<script src="/static/django_summernote/jquery.ui.widget.js"></script>
<script src="/static/django_summernote/jquery.iframe-transport.js"></script>
<script src="/static/django_summernote/jquery.fileupload.js"></script>
<script src="/static/django_summernote/summernote.min.js"></script>
<!-- end default_js -->
<!-- From js -->
<script src="//cdnjs.cloudflare.com/ajax/libs/codemirror/3.20.0/codemirror.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/codemirror/3.20.0/mode/xml/xml.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/codemirror/2.36.0/formatting.js"></script>
<!-- end js -->
</head>
<!-- Loaded via default_js and default_css (works) -->
<head>
<title>django-summernote frame</title>
<!-- From default_css -->
<link href="//netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap.min.css" rel="stylesheet">
<link href="//cdnjs.cloudflare.com/ajax/libs/codemirror/3.20.0/codemirror.css" rel="stylesheet">
<link href="//cdnjs.cloudflare.com/ajax/libs/codemirror/3.20.0/theme/monokai.css" rel="stylesheet">
<link href="/static/django_summernote/summernote.css" rel="stylesheet">
<link href="/static/django_summernote/django_summernote.css" rel="stylesheet">
<!-- end default_css -->
<!-- From default_js -->
<script src="//code.jquery.com/jquery-1.9.1.min.js"></script>
<script src="//netdna.bootstrapcdn.com/bootstrap/3.1.1/js/bootstrap.min.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/codemirror/3.20.0/codemirror.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/codemirror/3.20.0/mode/xml/xml.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/codemirror/2.36.0/formatting.js"></script>
<script src="/static/django_summernote/jquery.ui.widget.js"></script>
<script src="/static/django_summernote/jquery.iframe-transport.js"></script>
<script src="/static/django_summernote/jquery.fileupload.js"></script>
<script src="/static/django_summernote/summernote.min.js"></script>
<!-- end default_js -->
</head>
So I was able to make it work by structuring my SUMMERNOTE_CONFIG
as so:
SUMMERNOTE_CONFIG = {
'toolbar': [
['cmds', ['undo', 'redo', 'clear']],
['style', ['style']],
['font', ['bold', 'italic', 'underline', 'strikethrough']],
['font2', ['superscript', 'subscript']],
['color', ['color']],
['para', ['ul','ol']],
['layout', ['hr', 'table']],
['insert', ['link', 'picture']],
['misc', ['codeview']],
],
'width': '100%',
'css': (
'//cdnjs.cloudflare.com/ajax/libs/codemirror/3.20.0/codemirror.css',
'//cdnjs.cloudflare.com/ajax/libs/codemirror/3.20.0/theme/monokai.css',
),
'default_js': (
'//code.jquery.com/jquery-1.9.1.min.js',
'//netdna.bootstrapcdn.com/bootstrap/3.1.1/js/bootstrap.min.js',
'//cdnjs.cloudflare.com/ajax/libs/codemirror/3.20.0/codemirror.js',
'//cdnjs.cloudflare.com/ajax/libs/codemirror/3.20.0/mode/xml/xml.js',
'//cdnjs.cloudflare.com/ajax/libs/codemirror/2.36.0/formatting.js',
static_url('django_summernote/jquery.ui.widget.js'),
static_url('django_summernote/jquery.iframe-transport.js'),
static_url('django_summernote/jquery.fileupload.js'),
static_url('django_summernote/summernote.min.js'),
),
'codemirror': {
'theme': 'monokai',
}
}
PS static_url
is defined locally .
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.