Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Add html format support for CKeditor #83

Merged

Conversation

pdelboca
Copy link
Member

@pdelboca pdelboca commented May 26, 2020

Storing the output of the CKEditor in Markdown format was causing lot of troubles. The major one is that ckeditor and other WYSIWYG editors, when creating an output in markdown format they also write some html tags for the style. Example, for images:

<figure class="image image-style-side">![](https://ckan:5000/uploads/showcase_image/2020-05-20-130051.617895Quebrada-Condorito.png)</figure>

This causes a particular problem which is: rendering to html markdown text inside already existing html tags. CKAN renders all the MD correctly but the link inside the figure html element is not rendered into an actual image tag. We can remove the already existing html tags in ckeditor’s output but that forces us to loose the style we give to it in the editor.

This problem of rendering markdown inside html tags is well documented and I have tried several approaches and none was successful so we opted to store data in plain HTML if ckeditor is loaded.

This PR:

  • Removes the option to write to MD from CKEditor
  • Stores the notes field in plain html to render it in the read view of the showcase
  • Adds a new div to render if ckeditor is enabled to use custom ckeditor css described here. (CKEditor uses some special classes that we need to integrate in our UI to actually get what we see)
  • Edit the webpack.config.js to create the minified css while running npx webpack --config webpack.config.js
  • Adds a new command markdown_to_html to migrate notes from existing showcases to an HTML format

Some images

New editor
New Read

Todo:

  • Add cli tool to migrate previous showcases with markdown notes to html notes
  • Add some tests
  • Update README

@pdelboca pdelboca changed the title [WIP] Add html format support for CKeditor Add html format support for CKeditor May 27, 2020
Copy link
Member

@amercader amercader left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Looks good @pdelboca , just some minor comments

README.rst Outdated Show resolved Hide resolved
ckanext/showcase/commands/migrate.py Outdated Show resolved Hide resolved
ckanext/showcase/commands/migrate.py Outdated Show resolved Hide resolved
ckanext/showcase/templates/showcase/read.html Outdated Show resolved Hide resolved
@pdelboca
Copy link
Member Author

Thanks @amercader ! I did those changes so let me know if anything else is needed! :)

@amercader amercader merged commit 00b019b into ckan:master Jun 1, 2020
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

2 participants