Keep § when pasting from word - tinymce

I'm trying to paste content from a word doc into a tinymce instance. The content contains the § (paragraph) character, but TinyMce changes it into an li tag.
Is there a way to config TinyMce to allow special characters like §?

What you are seeing is behavior around the Paste plugin when a sentence starts with that character.
When it starts with that character the Paste plugin treats that like a list element. If the character is anywhere other than the first character TinyMCE does not create a list element.
The best thing to do is to open a bug report on the issue tracker for TinyMCE so the developers are aware of this issue.
https://github.com/tinymce/tinymce/issues

Related

Is there a way to use cursorWordPart*Select command w/o capturing underscore?

I'm a fan of sub-word captures, but I'm used to the sublime way where if you have a word with underscores, it will exclude the underscore from the capture like this:
In VScode, I setup my keyboard shortcuts to use the cursorWordPartLeftSelect and cursorWordPartRightSelect, but they include the underscore like this:
Here are the lines from my config:
Is there a way to change that?
Add the underscore character to the Editor: Word Separators list in the settings (just search for separators).
~!##$%^&*()-=+[{]}\|;:'",.<>/?_ // with the underscore added at the end
I am a little surprised it isn't already there but it isn't. Then your WordPart selectors won't include the underscores.
It looks like v1.44 adds a fix to this so that the cursorwordpartleft/right acts like Sublime Text with respect to underscores. See https://github.com/microsoft/vscode/issues/93239.
I'm experimenting with this extension, and removing underscores and hyphens from VS Code's word separators:
https://github.com/mlewand/vscode-select-part-of-word
Haven't had the time to dig into it and configure it to match Sublime Text yet but I'm praying this will be a part of the puzzle in getting VS Code to work like Sublime Text did!

Avoid losing format after selecting all text and start typing

We use TinyMCE as the wysiwyg editor for our content builder. You can drag and drop a text module and once you click an edit button an TinyMCE instance will open. This works really well.
Problem is now that the builder is made for designers so a lot of the times you add a text module just for a 1 word heading or other cases where you only have one block. (one h1, one p etc.) You can also see this behavior in the official demos: Just add an lonely h2 heading, select all text and start to write.
Now Tiny MCE has the default behavior that if you select the complete text (which is almost always the case if you for example change an 1 line / word heading) and you start typing you will lose your formats completely. ( in our case: color, font-size, font-weight, line-height etc.)
This makes editing an heading for example really painful. Best workaround so far is to leave 1 character to not lose the format and then delete the character in the end.
I never saw that behavior in other editors so my question is: Is there maybe an easy setting or workaround to avoid this?
If there are situations where you want a root element to be something specific (e.g. <h2>) you can use the forced_root_block setting on that instance of TinyMCE to force a specific element:
https://www.tinymce.com/docs/configure/content-filtering/#forced_root_block
Even if you delete all text the new text will be wrapped with that root element. See this TinyMCE Fiddle for examples:
http://fiddle.tinymce.com/SOfaab
I think this would address your one line issue?

How to display newline in TimelineItem control's text property?

We have a SAPUI5 timeline control, where we are showing the comments coming from server.
The issue is, if the comments contain a newline \n, then the Timeline control is not able to display the text in newline. Instead, it introduces space wherever \n is present.
We have tried formatting \n to unicode character also but that also didn't worked. Timeline control aggregates TimelineItem.
The control we are using is: https://ui5.sap.com/#/api/sap.suite.ui.commons.TimelineItem
Code snippet can be found at:
https://jsbin.com/kuluyehilu/edit?html,output
I inspected your example and came up with the following solution.
Since the text is embedded in a <span>, all unnecessary whitespace will be trimmed. What you can do is telling the span (via CSS) that it should display the whitespace anyway.
If you don't have a CSS file in your project yet, create one. Then add the following lines
div.sapSuiteUiCommonsTimelineItemShellBody>span {
white-space: pre;
}
This should do the trick.
JSBin: https://jsbin.com/feladeneso/1/edit?html,output
If you inspect the rendered element, you will see it actually put in the break:
<span id="__item0-realtext">x
y</span>
...but did not convert it to a <br/> tag. You cannot add the tag yourself since it will be escaped, either. Maybe you can try to override the renderer, and convert any line breaks to html breaks

tinymce removes line breaks so all text is in a continuous chunk with no paragraphs

I'm using TinyMce textarea editor and have a problem. As you probably know Tinymce transforms a standard html textarea into a rich text editor.
On our 'edit listing' page we call up some text from our db for the user to edit (previously in a standard textarea, now in the tinymce textarea.
Previously the standard textarea would preserve linebreaks and the user would get several paragraphs of text in the text area, now with tinyMCE they get a huge chunk of text with no linebreaks. (I have pasted an example of an entry in our db below - as you can see it has line breaks in it by tinymce seems to be ignoring them when it displays them in the editor).
Just to clarify my issue is now that tinymce is stripping something when I submit the form, it's that when I pull text (that contains line breaks) from the db and populate the tinymce textarea with that data (for the user to edit) in the tinymce textarea - the text appears (in the tinymce textarea) as one massive chunk of text with my paragraphs (whereas in a standard textarea it is nicely formatted with linebreaks)
Any help on how to resolve this would be greatly appreciated - do I need to use some sort of populate() type function to put the text in, or maybe I need to replace all the linebreaks with a different special character that tinyMCE will recognise as a line break and preserve?..
Thanks in advance.
Nick
example from db:
Here is line one
Here is line two
And here is line three
Which appears in tinymce as:
Here is line one Here is line two And here is line three
I faced a similar a problem, a while back and had questions just like yours. Also I finally ended up on SE just like you.
Anyway, I think I have the solution to your problem. If you are using PHP as your server side language, then you should use nl2br() PHP function.
Suppose you have stored your content fetched from the database in a php variable. Something like this:
$content = $row['content'];
Now when displaying it on to your screen, use the nl2br() function.
echo nl2br("<p>".$content."<p>");
Now, this part inside () depends on how you want to output the data. And I will leave it to you to figure that part out.
Hope this helps.

Plone - TinyMCE editor - line breaks with double instead single line spacing

We are using Plone 4.1.3 and the default TinyMCE editor. When we press the Enter key in TinyMCE, it produces a double line spacing instead of single line. We found a few similar questions and answers on this issue in the forum but don't know and cannot find the TinyMCE configuration file to modify to make line break into single line spacing. There is also nothing in Site Setup or ZMI to configure this for TinyMCE.
We found this the forum but it is not pertaining to plone.
Decrease the line spacing in TinyMCE textarea
Thank you very much in anticipation
cmgui
CSS. These are just paragraph elements (<p> tags). -- style them!
http://plone.293351.n2.nabble.com/TinyMCE-Plone-4-customizing-the-styles-for-own-CSS-classes-td5954678.html
As sdupton pointed out, this is indeed on purpose; enter is supposed to be a paragraph break, and behaves the same way in applications like Word. You can insert line breaks by shift-enter, but it's not encouraged to do that on the web, since text flows differently depending on font size and window size (and OS!).
If you want paragraphs to have less spacing, use CSS to reduce the margin/padding.