We launched new forums in March 2019—join us there. In a hurry for help with your website? Get Help Now!
    • 42562
    • 1,145 Posts
    ANNOUNCEMENT
    TinyMCE users. If your numlist and bullist have suddenly stopped working, as of TinyMCE official core 4.5.0, USE quick fix - or simply downgrade CDN link ...
    tinymce.init({
      plugins: 'lists advlist'
    });

    https://github.com/tinymce/tinymce/issues/3342

    TinyMCE official core 4.5.1 promises to include a permanent fix
      TinymceWrapper: Complete back/frontend content solution.
      Harden your MODX site by passwording your three main folders: core, manager, connectors and renaming your assets (thank me later!)
      5 ways to sniff / hack your own sites; even with renamed/hidden folders, burst them all up, to see how secure you are not.
      • 42562
      • 1,145 Posts
      TIP OF THE HOUR

      OK GOOGLE, How Do I use NewsPublisher with TinymceWrapper? - (without the magic)
      TinyMagicPublisher!

      Find this code and working demo in tw_traditional_create_page.html, a demo resource optionally installed by TinymceWrapper
      Note! TinyMagicPublisher takes property sets. Go easy on your sight.

      [[!TinyMagicPublisher?
      
      //tame the Magic, force ordinary NewsPublisher mode
      &npPureMagicNonTraditional=`0`
      
      //insert any TinyMCE init as promised by tinymce.com
      //takes multiple inits; user can have different config for different text fields - see below below
      //img/file fields are handled automatically as per custom filetpl tpl below
      &npTraditionalTinyChunk=`TinymceWrapperNPtraditional`
      
      &usetabs=`0`
      &tabs=`{
          "Main" :    ["pagetitle","introtext","content"],
          "Dates" :   ["pub_date", "unpub_date"],
          "Publish" : ["publish"]
      }`
      
      &cssfile=``
      &tinymceCDN=`//cdn.tinymce.com/4/tinymce.min.js`
      
      //optional browser stuff
      &autoFileBrowser=`responsivefilemanagerBrowser`
      &elFinderBrowserRTEurl=`mainSite.com/elFinder.html`
      &responsivefilemanagerBrowserRTEurl=`[[++assets_url]]components/tinymcewrapper/responsivefilemanager/filemanager/dialog.php?type=1`
      &responsivefilemanagerBrowserRTEtitle=`Responsive FileManager`
      &roxyFilemanBrowserRTEtitle=`Roxy Fileman`
      &roxyFilemanBrowserRTEurl=`[[++assets_url]]components/tinymcewrapper/fileman/roxy.php`
      
      
      &parentid=`12`
      &templateid=`templateNameOrID`
      &show=`pagetitle,introtext,content,TinymceWrapperMiscTV2,TinyJSONGalleryTV,longtitle,hidemenu,published,description,menutitle,pub_date,unpub_date,parent`
      &required=`pagetitle,content`
      &initdatepicker=`1`
      
      //for auto latching of custom browsers
      &filetpl=`twBROWSERnpFileTpl`
      &imagetpl=`twBROWSERnpImageTpl`
      
      &deletebutton=`1`
      &duplicatebutton=`1`
      &confirmdelete=`1`
      &modxGalleryAssetsUrl =`[[++assets_url]]`
      &TinyJSONGalleryJS = `[[++assets_url]]components/tinymcewrapper/gallery/js/TinyJSONGallery.js`
      &galleryBackUpRTEskin = `[[++assets_url]]/components/tinymcewrapper/tinymceskins/modxPericles`
      ]]


      TinymceWrapperNPtraditional

      1. You can mirror the exact TinyMCE settings you have in the backend. Cool!
      2. As usual, selector takes all kinds of querying. Use jQuery-style wildcards .. take this thing to town!
      3. If you want to use MODX Native filebrowser, write up a JS bridge and use file_browser_callback: autoFileBrowser,
      4. You can have as many TinyMCE inits to affect different text fields differently
      tinymce.init({
        selector: "#np-introtext",
        skin_url: '[[++assets_url]]components/tinymcewrapper/tinymceskins/modxPericles',
        menubar: false,
        statusbar: false,
        external_plugins: {
          twAceEditor: "[[++assets_url]]components/tinymcewrapper/tinymceplugins/twAceEditor.js",
          // twCodeMirror: "[[++assets_url]]components/tinymcewrapper/tinymceplugins/twCodeMirror.js",
          //bubbleBar: "[[++assets_url]]components/tinymcewrapper/tinymceplugins/tinymceBubbleBar.js",
          // twExoticMarkdownEditor: "[[++assets_url]]components/tinymcewrapper/tinymceplugins/twExoticMarkdownEditor.js",
          modxMagicHoverLink: "[[++assets_url]]components/tinymcewrapper/tinymceplugins/modxMagicHoverLink.js",
          twPreCodeManager: "[[++assets_url]]components/tinymcewrapper/tinymceplugins/twPreCodeManager.js"
        },
        file_browser_callback: autoFileBrowser,
        plugins: "contextmenu,charmap,paste,link,preview,code,insertdatetime",
        toolbar: "twPreCodeManager | undo redo | newdocument | preview code | styleselect | blockquote | bold | italic | bullist numlist | link unlink | charmap | insertdatetime",
        contextmenu: "twPreCodeManager link code styleselect",
        resize: true
      });
      
      
      
      tinymce.init({
        selector: "#np-description",
        skin_url: '[[++assets_url]]components/tinymcewrapper/tinymceskins/modxPericles',
        menubar: false,
        statusbar: false,
        image_advtab: true,
        external_plugins: {
          twAceEditor: "[[++assets_url]]components/tinymcewrapper/tinymceplugins/twAceEditor.js",
          // twCodeMirror: "[[++assets_url]]components/tinymcewrapper/tinymceplugins/twCodeMirror.js",
          //bubbleBar: "[[++assets_url]]components/tinymcewrapper/tinymceplugins/tinymceBubbleBar.js",
          // twExoticMarkdownEditor: "[[++assets_url]]components/tinymcewrapper/tinymceplugins/twExoticMarkdownEditor.js",
          modxMagicHoverLink: "[[++assets_url]]components/tinymcewrapper/tinymceplugins/modxMagicHoverLink.js",
          twPreCodeManager: "[[++assets_url]]components/tinymcewrapper/tinymceplugins/twPreCodeManager.js"
        },
        file_browser_callback: autoFileBrowser,
        plugins: "contextmenu,charmap,paste,preview,code,insertdatetime",
        toolbar: "twPreCodeManager | undo redo | newdocument | preview code | styleselect | blockquote | bold | italic | bullist numlist | link unlink | charmap | insertdatetime",
        contextmenu: "twPreCodeManager link code styleselect",
        resize: true
      });


      Cheers [ed. note: donshakespeare last edited this post 7 years, 3 months ago.]
        TinymceWrapper: Complete back/frontend content solution.
        Harden your MODX site by passwording your three main folders: core, manager, connectors and renaming your assets (thank me later!)
        5 ways to sniff / hack your own sites; even with renamed/hidden folders, burst them all up, to see how secure you are not.
        • 52741
        • 4 Posts
        Hi, donshakespeare!
        Did you know how to add Bootstrap grid to TinyMCE?
        I found that https://github.com/Frontwise/grid-editor, but don't know how to add it to tinyMCE.
        Maybe you know a better solution?

        Thanks!
          • 42562
          • 1,145 Posts
          RE: tim.yusupov
          ... but don't know how to add it to tinyMCE.

          Great plugin you found there.
          I have not played with it enough, but in the demo it seems CDN TinyMCE's config in the core can be extended
          $('#myGrid').gridEditor({
              tinymce: {
                  config: { paste_as_text: true }
              }
          });


          Are you asking how to use this within MODX?
            TinymceWrapper: Complete back/frontend content solution.
            Harden your MODX site by passwording your three main folders: core, manager, connectors and renaming your assets (thank me later!)
            5 ways to sniff / hack your own sites; even with renamed/hidden folders, burst them all up, to see how secure you are not.
            • 50864
            • 8 Posts
            Hello! Installed addition TinymceWrapperDIY, I added plugin link, but I want to be able to establish a link to the existing documents, as in the picture. How to set up such a decision?
            [ed. note: arimanr last edited this post 7 years, 2 months ago.]
              • 42562
              • 1,145 Posts
              PLEASE READ
              https://www.tinymce.com/docs/plugins/link/#link_list
              tinymce.init({
                ...
                plugins: "link",
                toolbar: "link",
                link_list: [
                  {title: 'My page 1', value: 'http://www.tinymce.com'},
                  {title: 'My page 2', value: 'http://www.ephox.com'}
                ]
              });

              Now how do we automatically auto-populate link_list in MODX?
                link_list: [
                // PLACE MODX CODE HERE (direct code or [[$chunk]] or [[!snippet]] call)
                ]

              Use getResources or pdoTools Extra.

              pdoTools
              [[pdoMenu?
                &context=`web`
                &parents=`39,5,9` //change this
                &level=`100`
                &limit=`1000`
                &showHidden =`1`
                &showUnpublished =`1`
                &tplOuter=`@INLINE [[+wrapper]]`
                &tpl=`@INLINE {title: "[[+menutitle]]", value: "\[\[~[[+id]]\]\]"},`
                &tplParentRow=`@INLINE {title: "[[+menutitle]]", value: "\[\[~[[+id]]\]\]", menu:[ [[+wrapper]] ]},`
                &sortby=`menuindex`
                &sortdir=`ASC`
                &checkPermissions=`load,list,view`
              ]]


              getResources
              https://forums.modx.com/thread/97694/support-comments-for-tinymcewrapper?page=29#dis-post-544434
              [[getResources? 
                &parents=`0` 
                &depth=`0` 
                &limit=`0` 
                &sortby=`{"menuindex":"ASC"}` 
                &tpl=`@INLINE {title: "[[+pagetitle]]", value: "\[\[~[[+id]]\]\]"},`
              ]]
                TinymceWrapper: Complete back/frontend content solution.
                Harden your MODX site by passwording your three main folders: core, manager, connectors and renaming your assets (thank me later!)
                5 ways to sniff / hack your own sites; even with renamed/hidden folders, burst them all up, to see how secure you are not.
                • 50864
                • 8 Posts
                Thank you very much!

                P.S.: I use this call, as there is a page with the same name and different parents

                [[pdoResources? 
                  &parents=`0` 
                  &depth=`0` 
                  &limit=`0` 
                  &sortby=`{"menuindex":"ASC"}` 
                  &tpl=`@INLINE {title: "[[+pagetitle]] / [[+id:pdofield=`{"top":1,"field":"pagetitle"}`]]", value: "\[\[~[[+id]]\]\]"},`
                ]]
                
                [ed. note: arimanr last edited this post 7 years, 2 months ago.]
                  • 47717
                  • 144 Posts
                  Hi,

                  I love the cleanliness and the html-editing of "Tiny MCE Wrapper".

                  However, I installed it on latest modx version sites, and all of them give an error when I want to insert an image:

                  elFinder Awesome Browser:
                  Invalid backend response.
                  Data is not JSON.



                  Any help woudl be greatly appreciated, as I had to sadly uninstall this great plugin due to this malfunction !

                  thanks !
                    • 40041
                    • 36 Posts
                    I'm wracking my brain on this - I can't for the life of me get this tool to STOP replacing entities, specifically in image URLS. I'm trying to use pthumb/phpthumbof for images, but the editor keeps replacing the html entities in the URL of the call, effectively breaking it.

                    for example:

                    <img src="[[!pthumb? &input=`/images/img2.jpg`]] />


                    gets converted to

                    <img src="[[!pthumb? & amp;input=& #96;/images/img2.jpg& #96;]]" />


                    (spaces added after &s above to stop html rendering)


                    Effectively breaking the snippet call. I have tried applying all the config settings in the corresponding tinymcewrapper chunks as per https://www.tinymce.com/docs/configure/content-filtering/ without affect. I have cleared cache.

                    Is this overridden somewhere that is not readily apparent?
                      • 42562
                      • 1,145 Posts
                      RE: Ananda
                      Invalid backend response.
                      Data is not JSON.


                      Please check your snippet elfinderConnector preferably your own property set

                      Check for at least

                      1. location1
                      2. location1Path
                      3. location1AccessUserGroup
                        TinymceWrapper: Complete back/frontend content solution.
                        Harden your MODX site by passwording your three main folders: core, manager, connectors and renaming your assets (thank me later!)
                        5 ways to sniff / hack your own sites; even with renamed/hidden folders, burst them all up, to see how secure you are not.