Lokking through the documentation of CKEditor5, I could not find instructions on how to allow <br> tags.
I read somewhere online that you can use inline styles like style = "margin:0px" but it strips those as well.
Any help would be greatly appreciated.
The soft line break feature is on the project's TODO list. Please leave your comment in the GitHub issue so we can understand your use–case better and provide the best possible solution.
Saw somewhere online where you can use inline styles like style="margin:0px" but it strips those as well!
Read why the editor does so in the project's FAQ. Anyway, I strongly advise you to use global styles sheets instead of inline styles because they are against the idea of the semantic content. All the more that your style is associated with the layout (margin, spacing), not the content itself (font color, font size). CKEditor 5 is a content editor, not a layout editor.
Related
I'm using Full HTML filter, with CKEditor. The following filters are enabled:
Align images
Caption images
Track images uploaded via a Text Editor
Collapsible text blocks
Note that Limit allowed HTML tags and correct faulty HTML is NOT enabled.
when I add a style attribute to a table element in Ckeditor using the Source view, specifically "width=75%", it is stripped when the page is rendered. When I edit the page again and go to Source view, the style tag is there.
What is stripping it on render?
I believe inline styles are removed by default for security reasons. But, there has been a lot of discussion about this issue on Drupal.org over the past few years. If you're looking for a workaround and accept the risk, here are two approaches I have found:
How to fix: CKEditor is removing style attributes. Drupal 8.
Refactor Xss::attributes() to allow filtering of style attribute values
Fair warning: I have not personally implemented either of these.
Inline style is stripped by default with Basic HTML formatter. Unless you have a specific reason why you don't want to turn on Limit allowed HTML tags I highly recommend that you do because it gives you a lot of control over what tags you and others can use in the wysiwyg. In addition, it allows you to add a "Styles" button with pre-configured styles so you don't have to insert inline CSS code repetitively.
Simple blog in Django (1.11.7 - Python3) in which I have impemented the Markdownx plugin. The plugin works for most of the markdown in preview in my 'edit_article' page, and in the normal view where users can read an article. BUT some of the markup isn't working in either:
Not working:
blockquotes using >
headers using one or more # or _
double-space and carriage return doesn't add a line-break
Links, images, numbered lists, emphasis and bold etc all work.
I posted my markdown in here, but of course it all worked here...
Don't really have any code to post, because most things work, so I'm guessing there isn't any problem with my model/view etc.
Anyone experienced this?
# So, let's try a header
doesn't work, neither does
> this type of blockquote
but they shoud produce
So, lets try a header
and
this type of blockquote
So I found the answer to this myself. I am using a CSS framework that resets the styling on the 'broken' markup tags. Until I add back the framework's CSS classes to the H1-H6 tags for example, the reset makes all headers appear as plain text.
So I have to add some custom CSS to the css framework's styling for those tags that are being overridden, or use html in the textarea in the form which should also work.
We are using Quill for basic formatting (Bold, Italic, Link, BlockQuote). However Quill.min.js is the largest file that we've in our page.
We are looking to cut the size of the file by including the necessary modules only (for e.g. remove Syntax and Formula).
What is the way to get them removed? Do we need to setup the environment as described in Development page? Would it be possible to comment or remove the codes in quill.js? Appreciate any guidance
You can use quill.core.js and quill.core.css instead which will not have extra modules like Syntax and Formula. These files are not minified for you however. If you want to customize further then you will have to build Quill yourself.
I have added a styles list with the config.styleSet.add function and now i can add this style list to the CKeditor with the config.stylSet function, but i can't find anything in the manual about how to implement that to a specific editor.
Any ideas?
Thanks!
Sorry that was a dumb question. the simple answer is:
Add stylesSet: 'stylesName'
To that editor configs.
The reason i didn't success with that is that i was mistakenly writing "styleSet" instead of "stylesSet" :~
We are having a problem with CKEditor (ver 4.1.1.5) stripping out some of our css classes when we are editing in the FULL HTML mode using SOURCE. From looking at some of the other questions posed on this, the Advanced Content Filter is the place we should be going. And, if I read this correctly, we need to edit the config.js file to add: CKEDITOR.config.allowedContent=true;
Am I going in the right direction? I want the WYSIWYG to still work for people with no html experience. However, when we go into source, I want all classes to remain and not be stripped out, no matter what.
You are partially right:
Yes, Advanced Content Filter (ACF) is the mechanism responsible for this.
But no, setting config.allowedContent to true is not a correct solution.
In short, ACF is a useful mechanism that lets you easily control the content that your users add to your site with CKEditor. Instead of disabling it, however, you should extend the filter configuration to accept whatever additional elements, classes, styles, attributes you want to allow.
In your case, if you want to additionally allow all classes for all elements, use this in your editor configuration:
config.extraAllowedContent = '*(*)';
Read more about ACF here:
Content Filtering (ACF) - introduction
Demo of Automatic Mode and Custom Mode
Advanced Content Filter - more advanced
Allowed Content Rules - syntax for ACF rules