Add-on Redactor Editor

Suppose we were to get a personal license, can someone please guide on how to implement this editor and replace the default tinymce?
 
Suppose we were to get a personal license, can someone please guide on how to implement this editor and replace the default tinymce?
It's not straight forward - you will need someone to make an add-on out of it.

Which, I'm kinda not doing, but I was interested in how it would look and work, and truly if it would be better than TinyMCE...

Well, it isn't.

TinyMCE is not our problem. Having a WYSIWYG editor is the problem.

Someone please correct me, but one of the biggest gripes about the editor is to do with copy and pasting content - especially with dark and light themes, where potentially content copy and pasted from a dark theme could potentially be invisible in a light theme.

Here's what I've found:

So, the editor works out of the box...

redactor1.webp

Looks good :D Don't be under the illusion that I have this as a working add-on, yet. This is just pretty much hacked in. So, on the top of things, it works.

redactor2.webp

What if I copy and paste this white text on a black background?

redactor3.webp
The editor displays it with the black background. That could work... I guess... But who wants to have forum posts looking like that? Not that it matters, because when it is posted...

redactor4.webp

Oops. Same problems as TinyMCE then...

redactor5.webp

The text is there when highlighted, but as expected, the text has taken on the same white colour as the source so usually will be invisible.

The other gripe about TinyMCE is customisability, but I'm really not that keen on progressing this much further when it has the same inherent problem as any other WYSIWYG editor.
 
Redactor should have a "remove" format tab, but it doesn't.

You have to give credit to redactor for three things over TinyMCE.

1.| More lightweight and faster.
2.| Works with iPads and other tablets.
3.| Buttons are easily customizable.
 
Also a massive plus is Redactor has an undo function that doesn't take out entire paragraphs with no redo :)
 
The buttons are relatively easily customisable in TinyMCE, it's just that XenForo's template system doesn't allow add-on developers to add new buttons very easily.

Also TinyMCE itself works fine with iPad and mobiles. XenForo devs have it deliberately disabled. This is the official TinyMCE demo working fine on iPhone:

f5cb9743-4bfb-4971-bf9a-51537e371a98
 
It's not straight forward - you will need someone to make an add-on out of it.

Which, I'm kinda not doing, but I was interested in how it would look and work, and truly if it would be better than TinyMCE...

Well, it isn't.

TinyMCE is not our problem. Having a WYSIWYG editor is the problem.

Someone please correct me, but one of the biggest gripes about the editor is to do with copy and pasting content - especially with dark and light themes, where potentially content copy and pasted from a dark theme could potentially be invisible in a light theme.

Here's what I've found:

So, the editor works out of the box...

View attachment 31573

Looks good :D Don't be under the illusion that I have this as a working add-on, yet. This is just pretty much hacked in. So, on the top of things, it works.

View attachment 31574

What if I copy and paste this white text on a black background?

View attachment 31575
The editor displays it with the black background. That could work... I guess... But who wants to have forum posts looking like that? Not that it matters, because when it is posted...

View attachment 31576

Oops. Same problems as TinyMCE then...

View attachment 31577

The text is there when highlighted, but as expected, the text has taken on the same white colour as the source so usually will be invisible.

The other gripe about TinyMCE is customisability, but I'm really not that keen on progressing this much further when it has the same inherent problem as any other WYSIWYG editor.
First, my apologies for resurrecting such an old thread. I was really curious to hear if you'd developed this any further.

I've never experienced issues with copy and pasting and TinyMCE. We've always had a group of styles that override any pasted content, ensuring everything is displayed with the correct color, background, font, etc.

Given how much leaner Redactor is, I think that alone makes it far more appealing than TinyMCE.
 
Apologies for bumping this thing yet again, but I'm really curious to hear if Chris or anyone has made further progress in integrating Redactor with Xenforo.


I've almost finished cleaning up the TinyMCE interface, and now hate it more than ever. The excessive markup, styles, and JS for a simple menu or button is just plain wrong.

It only takes a user clicking on any of the buttons (which trigger an iframe overlay) to see just how dysfunctional TinyMCE really is. I can't believe people still defend the editor and try to justify its continued use.

I wish we could completely replace this bloated old relic from the dark days of the web. Pretty please? Perhaps if we all work together? :)

Cheers, Trev
 
Hi. Sorry don't know how I missed this.

I did not do anything with this, not do I intend to in the foreseeable future.
 
Apologies for bumping this thing yet again, but I'm really curious to hear if Chris or anyone has made further progress in integrating Redactor with Xenforo.


I've almost finished cleaning up the TinyMCE interface, and now hate it more than ever. The excessive markup, styles, and JS for a simple menu or button is just plain wrong.

It only takes a user clicking on any of the buttons (which trigger an iframe overlay) to see just how dysfunctional TinyMCE really is. I can't believe people still defend the editor and try to justify its continued use.

I wish we could completely replace this bloated old relic from the dark days of the web. Pretty please? Perhaps if we all work together? :)

Cheers, Trev

Well, sorry but I'm still going to defend TinyMce ^^ The editor is working fine, I don't have major problem with it. The slowness of the iframe overlay is annoying it's true, it's due to its inline popup plugin. But it's the choice of XenForo developers to use it. I'm pretty sure they can do it with the XenForo Ajax insertion template & the jQuery tools, but I'm not sure it's a priority. Now the XenForo html/bbcode parser has been built arround TinyMce, I'm really not sure it's possible to use it with another editor without changing it.

If you find any bugs with TinyMCE you can use the official bug report to help the developers.
 
Hi. Sorry don't know how I missed this.

I did not do anything with this, not do I intend to in the foreseeable future.
Thanks for the update Chris.

Was it not a feasible project? TinyMCE seems tightly integrated and customised for Xenforo, I can't imagine it being easy to swap out.
 
Well, sorry but I'm still going to defend TinyMce ^^ The editor is working fine, I don't have major problem with it. The slowness of the iframe overlay is annoying it's true, it's due to its inline popup plugin. But it's the choice of XenForo developers to use it. I'm pretty sure they can do it with the XenForo Ajax insertion template & the jQuery tools, but I'm not sure it's a priority. Now the XenForo html/bbcode parser has been built arround TinyMce, I'm really not sure it's possible to use it with another editor without changing it. ...
Respectfully (of course), I keep hearing the same general sentiment regarding TinyMCE. Essentially, it's "good enough" and gets the job done.

I would argue that TinyMCE is only "good enough" for the old-school web forum niche, who still believes an average site visitor wants to know anything about BBCode markup. They don't.

The majority of forum visitors today only require a full-featured editor toolbar with:
  • Bold
  • Italic
  • Underline
  • List (this is the first one I've used for a long time)
  • Link
  • Image (this should be combined functionality with the current upload attachement button)
  • Media (not really needed, inline links could be parsed like Facebook, etc)
  • Quote
  • Smilies (maybe)
In most cases some of these aren't even necessary. More importantly, forum users need this basic functionality to actually run smoothly on their iPad Mini, Nexus 7's, and whatever else the future brings. The markup behind TinyMCE looks like it was built for Internet Explorer 6, and it certainly feels (and runs) like it on mobile devices. It's not a smooth experience. Users are learning to cope with the editor and work around quirks more than benefitting from it.

I suppose the real question is: What will the future bring for Xenforo if we're still stuck with this editor?

I'd happily contribute funds to anyone who thinks they can strip out TinyMCE and integrate something better. What's your price Chris? :)

For those who are curious, I don't spend all of my time ranting. I've been putting a lot of effort in to improving the TinyMCE design and experience. My progress so far:

Screen%20Shot%202013-01-02%20at%2019.48.42.png
 
Nice integration !
Did you find one editor that was working nice on mobile devices or touch screen?... I've modified the markitup editor to make it smoother on them (replaces hover actions with click actions), but the text selection is something hard to deal with. There was the developer of an Russian editor who asked for a free XenForo license to port his editor. I'm going to search for his post.
 
I use redactor in projects however it is a HTML editor and not a BBCode editor. Obviously it would be possible to change this around to work but I doubt it would be worth it. This is easily the best HTML editor out there and I love using it... but bbcode editors could be even better, there is so much room for innovation when it comes to bbcode editors. If I had the time I would outline the many ways it could be improved but I would need to go into detail and I hate writing. Oneday I might make my own bbcode editor with dartlang.
 
I've just tested redactor... it's fast, that's for sure.
If XenForo developers decide to replace TinyMCE updating the parser shouldn't be a problem. But I'm not sure this editor has a lof of "hooks" to create our own addons.

For those who are curious to try with XenForo
Download redactor here, put the following files redactor.min.js & redactor.css inside a new "test" folder of the XenForo "js" directory
Open the template editor
Search for
Code:
    <xen:if is="{$showWysiwyg}">
        <xen:include template="editor_js_setup" />
    </xen:if>

Replace with
Code:
    <xen:if is="{$showWysiwyg}">
        <xen:require js="js/test/redactor.js" />
        <link href="js/test/redactor.css" rel="stylesheet">
        <script>$('#{$editorId}_html').redactor();</script>
    </xen:if>

But again, the XenForo parser is not built for the html ouput of this editor, so it can't be used.

Edit: by the way, even if I read Redactor is working on mobile devices, its color system is not optimized for them either: the text must be selected first, then the color must be clicked... and as I said above... select some text on mobile devices is not that easy to do. The system commands open a popup which often hide the editor buttons.
 
I'm curious, what is the purpose of the camera icon on the left of the post reply button? Is it the uploader?
It's the uploader button. We're currently at around 8000 attachements, and only a few of those are not photos.

The camera icon is a bit cheesy, but it's used in many iOS and Android apps to indicate that you can attach (or take) photos.
 
Top Bottom