Several questions in one here but I suspect will all have the same answer.
Using the CKEditor in a CakePHP project where the content being edited is to make the html part of an email.
Most email applications don't fully support HTML net alone true HTML5.
An example of which is to center text in an email paragraph you use either <p align=center> or <center></center>
In the CKEditor when in source mode editing if do a <p align=center> and save it (or just toggle the source edit mode) it removes the align=center because in HTML5 that's no longer valid.
How can I allow this in the CKEditor?
Can I enable HTML4 validation instead of HTML5?
I also have a table in the template where half of it is edited in a field(textbox) called Header (the header of the email template) and another field called footer.
In the Header I want <table><tr><td>
In the Footer I want </td></tr></table>
Then my message content is placed in the TD cell between the header and footer.
However the CKEditor won't allow me to have an HTML TAG and not its closing TAG.
Any ideas on how to make this happen as well?
Regards
Ian
To change the HTML that it's accepted by CKEditor, adjust its ACF settings. The simplest way is to allow everything:
config.allowedContent = true;
That won't solve the halve tables part.
For that you can try to use config.protectedSource, defining a rule for both the opening and closing parts, but taking care to add also something there that allows you to target only that table and not any other table that might be in the content.
(Of course the best solution would be to but that table outside the editor when you create the mail with all the parts)
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.
I have a text_area field in a form which allows some text formatting through a very simple WYSIWYG (bold / underline / bullet points). This was aimed at having a consistent formatting in the description profile of the users.
<%= l.text_area :access, value: "#{t('.access_placeholder_html')}" %>
Nevertheless, some users usually filled the text_area by copy / pasting directly from their website. And their specific formatting "hypertext links", font size, etc. is after reflected on my website, which makes it a bit dirty.
How can I solve this problem. Ideally I would love that when saving the form it gets rid of all the HTML code that is not allowed instead of not allowing copy / paste. Is this possible? Was wondering if should use Sanitize but if so how? (Sorry new to code, I guess you would have understood).
You didn't say which version of Rails, but you could use #sanitize from ActionView::Helpers::SanitizeHelper module to strip all the HTML formatting. It scrubs HTML from text with a scrubber. The default scrubber allows optional whitelisting of attributes. You can even build your own custom scrubber to modify the string if you need more control over what is output. The module also contains #strip_tags and #strip_links, which are very simple scrubbers that remove all HTML tags and all HTML link tags (leaving the link text).
Note that you can wind up with malformed text if the user's input wasn't valid HTML.
Quick examples from the docs:
// remove all HTML tags except <strong> <em> <a> and the
// <href> attributes from #text
nomarkup_text = sanitize #text, tags: %w(strong em a), attributes: %w(href)
// remove all HTML markup
strip_tags("<b>Bold</b> no more! <a href='more.html'>See more here</a>...")
returns the string Bold no more! See more here...
// remove just the link markup
strip_links('Please e-mail me at me#email.com.')
returns the string Please e-mail me at me#email.com.
More detail at the API page for SantizeHelper
How can I show documents created with Ckeditor in read only so that they as much as possible like in the editing mode but without having to create the editor for each message?
In my project users can send messages to each other among many other things and they create the messages using Ckeditor. I would to render message threads in readonly mode without having to create the Ckeditor for each message. Doing that would be slow and would consume a lot of vertical space. Another problem with that approach is that removing the toolbar removes formatting. I would like to just have the messages in div tags and add a class to them and then include Ckeditor css file. Or also acceptable would be to have one element with certain class whose children would get the Ckeditor styles. Before putting the messages in the html response I do whitelisting on the server so the docs are safe to put inside for example a div tag.
I solved this by wrapping the message in an iframe element and added dynamically a style element that links to the Ckeditor style sheet. Now the message gets Ckeditor styles and I don't need to create the editor at all in the read only state and the rest of my page unaffected by the Ckeditor styles.
I have a custom module that works with a custom data type and part.
In my edit view I have some textareas but these are no rendered by CKEditor.
Only BodyPart html text areas are rendered (like in pages & blog posts).
How can I do this?
References: https://orchardckeditor.codeplex.com/
CKEditor needs to be initialized, either sneak in somewhere this javascript line
CKEDITOR.replace(textarea);
or append class ckeditor for auto-initialization
<textarea class="ckeditor"></textarea>
If it doesn't work you may also need to add script requirement to your edit view
Script.Require("CKEditor");
We have additional placeholders, which are embeded in conent edited by CKEditor and we need to be possible to place such placeholders before and after TR-tag, so we could organize repeating of data in the table. But CKEditor probably find that is not valid HTML and take out repeater placeholders before the table.
For example I write next html in source mode:
<table><tbody>{start}<tr><td>...</td></tr>{end}</tbody></table>
I switch to html mode and back to source, now my html is treated to the next view:
<p>{start}{end}</p> <table><tbody><tr><td>...</td></tr></tbody></table>
Possibly there is a CKEditor switch to turn off all syntax cleanup or specially for tables?
Try Adding this line to Config.js file:
config.allowedContent = true;
CKEditor is not a source code editor, but a WYSIWYG editor which uses browsers' contenteditable implementations for its editing feature. Therefore, it needs to work on valid and real HTML.
Although, check the config.protectedSource setting. You'll be able to hide those {start|end} tags from parser.