1. This site uses cookies. By continuing to use this site, you are agreeing to our use of cookies. Learn More.

How to add some plugins or custom buttons to Redactor 1.2

-

  1. cclaerhout

    cclaerhout Well-Known Member

    cclaerhout submitted a new resource:

    How to add some plugins or custom buttons to Redactor - -

    Read more about this resource...
     
    Last edited: Jun 21, 2013
    Shelley, Mirovinger and Dinh Thanh like this.
  2. Dinh Thanh

    Dinh Thanh Well-Known Member

    Another contribution for Xenforo editors!
     
  3. Despair

    Despair Active Member

    There may be a better way, but after playing around a bit, an easy way to manipulate the button positioning seems to be to overwrite the _adjustButtonConfig function for XenForo.BbCodeWysiwygEditor. It's a smaller function so it's not too bad. Before returning the config you can do something like this:
    Code:
          config.buttons = [
                ['switchmode'], ['removeformat'],
                ['bold', 'italic', 'underline', 'deleted'],
                ['fontcolor', 'fontsize', 'fontfamily'],
                ['createlink', 'unlink'],
                ['alignment'],
                ['unorderedlist', 'orderedlist'],
                ['smilies', 'image', 'media'],
                ['code', 'quote'],
                ['draft'],
                ['undo', 'redo']
            ];
    Those are the buttons by default, but you can add new buttons, remove certain ones, reposition them, add them to different groups, etc. by manipulating the array. If you're worried about other buttons being added/changed, you could probably splice the array or something instead. Works for me in the time being.
     
    rour, Mirovinger and cclaerhout like this.
  4. cclaerhout

    cclaerhout Well-Known Member

    @Despair, thank you, I will have a look this weekend.
     
  5. cclaerhout

    cclaerhout Well-Known Member

    Mirovinger likes this.
  6. allewreK

    allewreK Active Member

    @cclaerhout or anyone, how can you parse your custom bbcode tags, in javascript ?

    As you can see with redactor, if you hover a text and click on bold, italic, etc, the texte will be formatted. How can I do the same with my custom bbcodes ?
     
  7. cclaerhout

    cclaerhout Well-Known Member

    It's complicated, so I would recommend to forget this idea.
    1) You've to develop a Redactor Plugin using its API. Since the Redactor version used by XenForo is a former one, the API commands are not exactly the same. You need to be a customer to get access to the old apo
    2) Once you will have finished with your JS, you will have to convert the html to bbcode. The XenForo class doing this has no listener, so you will have to code in the php file.
    3) Once you will have finised with above two steps, you need to create a bbcode to get back the html. The XenForo class doing this has a listener.
     
  8. allewreK

    allewreK Active Member

    Ok great thanks you Cedric.

    One other thing, I know you said the TinyQuattro isn't supported, but it looks like it's not working with the attachment handler of xenforo's core : when you upload a file using the "Upload a file" button, the file is uploaded, but when you hit the button that include the
     
  9. cclaerhout

    cclaerhout Well-Known Member

    Please post in the correct thread (the one of TinyQuattro). I've tested, images are inserted inside the editor (both on XenForo 1.1/ XenForo 1.2).
     
  10. allewreK

    allewreK Active Member

    Ok thanks you, that's probably because of my custom attachment upload.
     
  11. allewreK

    allewreK Active Member

    Cedric, in your tutorial you showed us how to add a custom icon that will auto insert a tag into the editor.

    How can we load a modal, and then insert html content into the editor, like for your addon tinyquattro?

    Regards.
     
  12. cclaerhout

    cclaerhout Well-Known Member

    No idea, I haven't look at this part of the XenForo framework. But you probably just need to directly look inside the XenForo code to find this: upload\js\xenforo\full\bb_code_edit.js
     
  13. allewreK

    allewreK Active Member

    My problem is to extend it, I can modify the core file but that's not the best way to do it...
     
  14. cclaerhout

    cclaerhout Well-Known Member

    I haven't check how to create a custom editor command with the Redactor API (that can be used with execCommand). Just find this and this would be easy since the XenForo framework has an option to execute this (Check the first JS of the archive, there's a note about it: "You can instead of the "tag" key use the "exec" key to execute an execCommand").
     
  15. allewreK

    allewreK Active Member


    Do you think I can load a modal with the exec command ? Where can I define the exec function?

    I'll try to do it with the core files as an example, I'll post here if I find a way to do it ;)
     
    Mirovinger likes this.
  16. emc2

    emc2 Active Member

    In your demo, you have plugins: '['test', 'test2']'. Can you give us an example of them in use? Maybe just a simple command that triggers a alert() popup?
     
  17. cclaerhout

    cclaerhout Well-Known Member

    Sorry, I don't use this editor. I've done this basic tutorial after that some members ask me to make the button manager compatible with the new default editor and to provide some information to help developers to go continue on this topic.
     
  18. cclaerhout

    cclaerhout Well-Known Member

    cclaerhout updated How to add some plugins or custom buttons to Redactor with a new update entry:

    Version 1.2 released

    Read the rest of this update entry...
     
  19. tafreehm

    tafreehm Well-Known Member

    any idea how to add more fonts ? Google fonts maybe.
     
  20. wichern.k

    wichern.k Member

    Parse error: syntax error, unexpected T_STATIC in /home/hondamodif/domains/xxxxx.com/public_html/forum/library/Milano/Common/Install.php on line 31
     

Share This Page