hectorguo / ckeditor-markdown-plugin Goto Github PK
View Code? Open in Web Editor NEWMarkdown Plugin for CKEditor
Home Page: http://hectorguo.github.io/CKEditor-Markdown-Plugin/
Markdown Plugin for CKEditor
Home Page: http://hectorguo.github.io/CKEditor-Markdown-Plugin/
when used mathjax ,then switch markdown mode,and then switch back, mathjax will missing ''
We can edit text area content for disabled field if we click markdown plugin on editor.
It would be nice to be able to download this plugin through bower.
When I have Markdown mode enabled I cannot save new data when I submit my form. It is only able to convert HTML -> Markdown as an update. Event when updaing, new data cannot be included, only the conversion function is executed.
I was hoping to allow users to either utilize the standard CKEditor or Markdown plugin (saving all form data converted to Markdown in the DB). Is there a way to enable the Markdown plugin to add new data as opposed to simple conversion? Or is this an issue that is the result of improper configuration on my end?
markdown seems to depend on the maximize plugin, but it isn't mentioned anywhere, is it? I tried without, didnt work out very well because I couldn't get back to normal view. Here is the codeline that uses maximize:
In the demo I could not add a link.
Like:
[Google](www.google.com)
Thanks!
Hi,
I get this error in the console after I click on the Markdown button in the editor:
Uncaught InvalidCharacterError: Failed to execute 'add' on 'DOMTokenList': The token provided ('cke_source cke_reset cke_enable_context_menu') contains HTML space characters, which are not valid in tokens.
I tracked it down to the line 49 in plugin.js: textarea.addClass('cke_source cke_reset cke_enable_context_menu');
it seems that markdown plugin uses
**bold**
for bold but
_italic_
for italic, why is that? Even if both is allowed following Common Mark, its a mixing of two styles.
If I use either CodeSnippets or manually write the markdown for a multi-line code block (fenced or indented), when viewing the text as markdown, the plugin removes all line breaks and forgets which language was being used.
e.g.
```c#
bool Foo()
{
return false;
}
```
becomes:
bool Foo(){ return false;}
This in turn removes all syntax highlighting and formatting when switching back to WYSIWYG.
When i pasting some code in the markdown as show below
this is working fine. when we are editing the code using markdown plugin the original structure is getting messed up. you will find in below screen shot.
Is there any way we can retails the original structure, if we want to edit the code in markdown. Please reply.
Thank you,
S.P.Sriharsha
The design pre and code work incorrectly
With CKEditor 4.6.1, when I clink on the Markdown button the text disappears and the button can not be toggled after that.
Just having this one included in the standard CKEditor configuration and running their "samples" area. When I switch to Markdown mode I get the following error:
Uncaught InvalidCharacterError: Failed to execute 'add' on 'DOMTokenList': The token provided ('cke_source cke_reset cke_enable_context_menu') contains HTML space characters, which are not valid in tokens.
Modifying line 49 (plugin.js) fixes the issue:
textarea.addClass('cke_source cke_reset cke_enable_context_menu'.split(' '));
when i load a html file into a textarea and click on the markdown button, i get my html in markdown code. But when i have a empty wysiwyg area and paste html into it and clicking the markdown button, the markdown mode window is empty. what im doing wrong?
As a developer, I usually write blog in markdown format. Sometimes I need insert a code block in the article and as we know github flavor markdown is very friendly to programmers.
So I just wonder we can enable GFM in this markdown plugin?
Hello,
if I use the inline editor, the markdown button is not displayed:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>A Simple Page with CKEditor</title>
<!-- Make sure the path to CKEditor is correct. -->
<script src="ckeditor.js"></script>
</head>
<body>
<form>
<div id="editor1" rows="10" cols="80" contenteditable="true">
This is my textarea to be replaced with CKEditor.
</div>
<script>
// Replace the <textarea id="editor1"> with a CKEditor
// instance, using default configuration.
CKEDITOR.inline( 'editor1' );
</script>
</form>
</body>
</html>
and the config.js
/**
* @license Copyright (c) 2003-2015, CKSource - Frederico Knabben. All rights reserved.
* For licensing, see LICENSE.md or http://ckeditor.com/license
*/
CKEDITOR.editorConfig = function( config ) {
// Define changes to default configuration here.
// For complete reference see:
// http://docs.ckeditor.com/#!/api/CKEDITOR.config
// The toolbar groups arrangement, optimized for two toolbar rows.
config.toolbarGroups = [
{ name: 'styles' },
// { name: 'clipboard', groups: [ 'clipboard', 'undo' ] },
// { name: 'editing', groups: [ 'find', 'selection', 'spellchecker' ] },
// { name: 'insert' },
// { name: 'forms' },
{ name: 'tools' },
// { name: 'document', groups: [ 'mode', 'document', 'doctools' ] },
// '/',
{ name: 'basicstyles', groups: [ 'basicstyles', 'cleanup' ] },
{ name: 'paragraph', groups: [ 'list' ] },
{ name: 'links' },
// { name: 'markdown'}
{ name: 'others' }
//
// { name: 'colors' },
// { name: 'about' }
];
config.removePlugins = 'stylescombo';
// Remove some buttons provided by the standard plugins, which are
// not needed in the Standard(s) toolbar.
config.removeButtons = 'Subscript,Superscript,Anchor,Strike';
config.extraPlugins = 'markdown'; // adding the markdown plugin
// Set the most common block elements.
config.format_tags = 'p;h1;h2;h3';
// Simplify the dialog windows.
config.removeDialogTabs = 'image:advanced;link:advanced';
};
There was mention in your description that a system could get markdown output while in wysiwyg mode. I'm doing a standard .getData()
call while in wysiwyg mode, but always get html formatted output.
What needs to happen to get this to output markdown but while editing in wysiwyg.
similar to #11
if you have a pre
block all newlines in it are removed when switching to markdown.
Reproduce
goto demo
http://hectorguo.com/CKEditor-Markdown-Plugin/
enter multi line text, highlight, click format combo change to formatted
switch to markdown and see that all formatting is removed, newlines are gone text becomes single line inline looking.
switching to markdown removes comments from source
调试了一下午没有解决,不知道郭神能否指点一二。
I tried adding the extraPlugins setting to the instance of CKEditor and to the config.js file, like so:
CKEDITOR.replace('inbox-reply-input', { customConfig: 'config.js', extraPlugins: 'markdown' });
config.js
`CKEDITOR.editorConfig = function(config) {
config.extraPlugins = 'markdown';
config.toolbar = [
{ name: 'clipboard', items: ['Undo', 'Redo'] },
{ name: 'editing', items: [ 'Scayt'] },
{ name: 'links', items: ['Link', 'Unlink', 'Anchor'] },
{ name: 'insert', items: ['Image', 'Table', 'HorizontalRule', 'SpecialChar'] },
{ name: 'tools', items: ['Maximize'] },
{ name: 'document', items: ['Source', 'Markdown'] },
'/',
{ name: 'basicstyles', items: ['Bold', 'Italic', 'Strike', '-', 'RemoveFormat'] },
{ name: 'paragraph', items: ['NumberedList', 'BulletedList', '-', 'Outdent', 'Indent', '-', 'Blockquote'] },
{ name: 'styles', items: ['Font', 'FontSize', 'TextColor'] }
];
config.skin = 'bootstrapck';
config.height = '100px';
};`
Neither method presents the "Markdown" button/option up top. Here is a screenshot.
http://i.imgur.com/Of8IOFX.png
I assume this whole thing is done to enable non-tec users like grandma to edit things.
But grandma has Libreoffice and she knows how to do tables, believe me.
Unfortunately grandma can not find any way to create or copy paste a table into this editor.
She would be happy, if she had a way to import a csv file.
I am now teaching her markdown - but then we do not need this editor anymore. Also she is laughing at me because she does not believe that tables with markdowns are so primitive, plus she just wants to copy-paste.
Conclusion: please do not stop development just because the most ultra-simplistic things are implemented - a product like this should also support tables.
Is there a way to load markdown data into the editor and then have it set to display in WYSIWYG mode?
I'm trying something like this:
CKEDITOR.on( 'instanceReady', function( ev ) {
ev.editor.setData("[link](http://google.com)")
ev.editor.setMode("markdown");
ev.editor.setMode("wysiwyg");
});
This seems to throw errors:
Uncaught TypeError: Cannot read property 'toTextArea' of undefinedCKEDITOR.tools.createClass.proto.detach @ plugin.js:162CKEDITOR.editor.editable @ editable.js:1207CKEDITOR.editor.setMode @ themedui.js:195(anonymous function) @ sample.js:45
selection.js:500 Uncaught TypeError: Cannot read property 'getBody' of undefined
If I run these commands one at a time from the console after loading the page changing out ev for CKEDITOR.instances['instanceName'] it seems to work fine.
Sorry if I am missing something trivial.
Hello,
As an improvement, is it possible in markdown mode to disable horizontal scroll bar, in the aim to break the text et get it in ckeditor width ?
In markdown mode, the text is NOT broken, so it is difficult to format the text :
In preview mode, it is broken, better to format the text :
[EDIT]
It's really crippling, I would mark it as a bug.
Thank you in advance,
Emilie
It seems that the plugin does not work on Internet Explorer?
Even the Demo stops working in IE 11 ...
use markdown to save content to db,when get content from db and show content in ckditor ,the content format is disorder
Hi man,
I created a table but this does not convert to markdown
Thanks in advance, Nicholls
A declarative, efficient, and flexible JavaScript library for building user interfaces.
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
An Open Source Machine Learning Framework for Everyone
The Web framework for perfectionists with deadlines.
A PHP framework for web artisans
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
Some thing interesting about web. New door for the world.
A server is a program made to process requests and deliver data to clients.
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Some thing interesting about visualization, use data art
Some thing interesting about game, make everyone happy.
We are working to build community through open source technology. NB: members must have two-factor auth.
Open source projects and samples from Microsoft.
Google ❤️ Open Source for everyone.
Alibaba Open Source for everyone
Data-Driven Documents codes.
China tencent open source team.