Release

Our new text editor is now available on all communities!

Our new text editor is now available on all communities!
Userlevel 7
Badge +1

We are very proud to announce that our completely new editor is now available for all users on all communities! :grin::raised_hands::pencil2: We have invested a lot of time to give you and your users more options to create richer content in an easy way - so we hope that you will enjoy working with the new editor as much as we do!

We are investigating line-height / spacing inconsistencies as well as problems with selecting text on some viewports (e.g. Safari on iOS).

Polls are temporarily not available, but will be added again soon.

 Overview of improvements

There are many things which have improved with the new editor, just to name a few:

Improved existing features

  • Image upload
    • Drag & drop images into the editor instead of manual upload
    • Captions (descriptive text underneath uploaded images)
  • Code
    • In-line code is now possible (previously code was in an extra line)
    • Code syntax (code is not being stripped automatically anymore)
  • Lists
    • Multi-level lists are possible now
    • Better UX in working with lists (previously lists could not be interrupted by line breaks)
  • Text styling
    • Text styling within lists was not fully supported before

New features

  • Tables!
  • Callouts
  • Text color / background color
  • Horizontal lines

Of course not all of these features are available to end users, some of these (e.g. text color, header, callouts) are only available in the Control environment for now. We have plans to make this available to front-end users via user roles in the future, so that you are in control of who can make use of these features - please share your thoughts on this with us in the comments!

Feedback

Please let us know what you think of this improvement, also how your users are feeling about it. This way we can adjust and improve the editor even further in the future!


168 replies

Userlevel 5
Badge +3

Small update, we deployed a fix to the editor that should prevent a horizontal scroll bar in the editor [link to feedback@Suvi Lehtovaara 

Thanks @Yoeri! I tested this and it seems to be ok :relaxed:

Userlevel 5
Badge +3
This happens when editing the post.

Is this bug already on your lists? This is when editing a post, not publishing a new comment.

Userlevel 7

Yes, the ‘bouncing behaviour’ is known and on our list - thanks for the screencast, clear example!

Userlevel 6
Badge +4

What is the expected behaviour for image captions (the description text you can put under an uploaded image)? Is using editor formatting supposed to work?

Making the text bold, cursive oder underlined works as expected. But it’s not possible to put a link into the image caption. For us having the ability to put links into the image caption would be one of the most important use cases, because we want to put the image source and license there (which always means linking to the source or the creator and/or the license website).

Userlevel 7

Hi,

The expected behavior is to show plain text, as image captions are informative additions to images. There is an open idea to add URLs to images here. We’re not sure yet if we want to do this as clicking an image currently opens a lightbox to have a full-size view which we like 

Userlevel 6
Badge +4

I think the idea goes in another direction. The idea is about not linking an image to the lightbox, but to another (external) target.

A link in the image description wouldn’t interfere with the current lightbox functionality, in my opinion. You could still click on the image and get to the lightbox, but you could additionally have a clickable link in the image description to credit the creator / originator.

Userlevel 1

When writing a post/reply, if a user creates a hyperlink, but then decides they don’t want to link after all...how can they remove the URL?  Is removing and reinserting the text the only way?

Userlevel 7
Badge +3

Hi @triskaideka ,

I believe CKEditor4 does have support for a built-in Remove Hyperlink option, but it’s not turned on for the inSided platform right now. My manual hacks and keyboard shortcuts don’t seem to be enabled either. This should be fairly easy for inSided to enable though. It’s best done globally so that everyone gets access to it at once.

Can you help with that by any chance @daniel.boon ? You could do with earning a few honest Points...

Userlevel 6
Badge +1

When writing a post/reply, if a user creates a hyperlink, but then decides they don’t want to link after all...how can they remove the URL?  Is removing and reinserting the text the only way?

@triskaideka yes this is currently the only way to achieve this at the moment as an end user. I’d recommend submitting this as an idea - but in any case, I’ve logged your feedback for the appropriate team 🙂.

 

superb features !

Userlevel 4
Badge +2

Is it possible to change the font what is in use in the message editor? We would like to use our brand font in the message editor as well. And, is it possible to increase the font size as well?

Userlevel 4
Badge +2

Is it possible to change the font what is in use in the message editor? We would like to use our brand font in the message editor as well. And, is it possible to increase the font size as well?

How to do this?

Userlevel 2

Is it possible to change the font what is in use in the message editor? We would like to use our brand font in the message editor as well. And, is it possible to increase the font size as well?

How to do this?

 

Not sure about the text-editor, but when it comes to overall in the community - we just change it in custom css:

/* Font styles */

p {
font-size: 16px;
}

h1 {
font-size: 39px;
}

h2 {
font-size: 32px;
}

h3 {
font-size: 25px;
}

p, h4, h3, h2, h1 {
letter-spacing: -0.025em;
}

 

For specifically inside a topic, we use these commands:

/*font-sizes*/
.cke_panel_container h2, .post__content.post__content--new-editor h2 {
font-size: 31.25px;
}

.cke_panel_container h3, .post__content.post__content--new-editor h3 {
font-size: 20px;
}

.topic__title {
font-size: 25px;
}

 

Userlevel 4
Badge +2

Thanks @JeppePeppe. I think the font, what is in use in the text editor, isnt included in your codes. 

I think it can be changed because here inSpired the font is different than in our community.

Userlevel 2

I tried changing the text-editor, but didn’t manage to make it work i’m afraid 😕

Userlevel 4
Badge +2

I tried changing the text-editor, but didn’t manage to make it work i’m afraid 😕

Because there are different fonts so it means that this can be done. But probably this is something only inSided can do. I´ll create a ticket, let´s see.

Thanks.

Userlevel 7
Badge +1

Hi, 

apologies for the delay in response, I relayed this question to our support team last week, but I now noticed that we failed to share an update here. 😐

This is a bit too technical for my knowledge, but I will attempt to relay what I can see in internal discussions:

So the editor itself is currently not able to use custom fonts just yet. We do have a story ticket to have this improved, but I cannot communicate timelines at this moment I am afraid. 

It was pointed out that you should define a fallback font under Theme > Font. The fonts will be applied in the order they are put in the input field. If a font is not available the browser will try to apply the next one. So in the example image Roboto is the fallback font, and if that is not available it's Helvetica.

This fallback font ideally should be one which is being used in all browsers. I am not sure why, but I assume that this has to do with limitations in loading in custom fonts in the editor.

Hope this helps!

Userlevel 4
Badge +2

Yeah, thanks @Julian and I can confirm Support made this for me. Thanks again.

Reply