We launched new forums in March 2019—join us there. In a hurry for help with your website? Get Help Now!
    • 3749
    • 24,544 Posts
    This code in a snippet produces a textarea with ’SomeValue’ in it, but no RTE. TinyMCE is installed, enabled, and set in which_editor. I get the same result with a rich text TV, BTW -- textarea but no editor.
    $id = 'content';
    $w= $params['w'] ? $params['w'] : '100%';
    $h= $params['h'] ? $params['h'] : '400px';
    
    $richtexteditor = 'TinyMCE';
    $value = 'SomeValue';
    
    $o= '<div class="MODX_RichTextWidget"><textarea id="' . $id . '" name="' . $id . '" style="width:' . $w . '; height:' . $h . ';">';
    $o .= htmlspecialchars($value);
    $o .= '</textarea></div>';
    $replace_richtext= array (
        $id
    );
    // setup editors
    if (!empty ($replace_richtext) && !empty ($richtexteditor)) {
        // invoke OnRichTextEditorInit event
        $evtOut= $modx->invokeEvent("OnRichTextEditorInit", array (
            'editor' => $richtexteditor,
            'elements' => $replace_richtext,
            'forfrontend' => 1,
            'width' => $w,
            'height' => $h
        ));
        if (is_array($evtOut))
            $o .= implode("", $evtOut);
    }
    
    return $o;


    Here’s the source of the page:

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
    <head>
    <title>MODx Revolution - NewsPublisher</title>
    <base href="http://localhost/gitclone/" />
    <script type="text/javascript" src="/gitclone/assets/components/tinymce/jscripts/tiny_mce/tiny_mce.js"></script>
    <script type="text/javascript" src="/gitclone/assets/components/tinymce/xconfig.js"></script>
    <script type="text/javascript" src="/gitclone/assets/components/tinymce/tiny.js"></script>
    <script type="text/javascript">Tiny.lang = {"toggle_editor":"Toggle Editor: ","setting_css_selectors":"CSS Selectors","setting_css_selectors_desc":"Here you can enter a list of selectors that should be available in the editor. Enter them as follows:<br \/>\"displayName=selectorName;displayName2=selectorName2\"<br \/>For instance, say you have <b>.mono<\/b> and <b>.smallText<\/b> selectors in your CSS file, you could add them here as:<br \/>\"Monospaced text=mono;Small text=smallText\"<br \/>Note that the last entry should not have a semi-colon after it.","setting_custom_buttons1":"Custom Buttons Row 1","setting_custom_buttons1_desc":"Enter the buttons to use as a comma separated list for the first row. Be sure that each button has the required plugin enabled in the \"Custom Plugins\" setting.","setting_custom_buttons2":"Custom Buttons Row 2","setting_custom_buttons2_desc":"Enter the buttons to use as a comma separated list for the second row. Be sure that each button has the required plugin enabled in the \"Custom Plugins\" setting.","setting_custom_buttons3":"Custom Buttons Row 3","setting_custom_buttons3_desc":"Enter the buttons to use as a comma separated list for the third row. Be sure that each button has the required plugin enabled in the \"Custom Plugins\" setting.","setting_custom_buttons4":"Custom Buttons Row 4","setting_custom_buttons4_desc":"Enter the buttons to use as a comma separated list for the fourth row. Be sure that each button has the required plugin enabled in the \"Custom Plugins\" setting.","setting_custom_buttons5":"Custom Buttons Row 5","setting_custom_buttons5_desc":"Enter the buttons to use as a comma separated list for the fifth row. Be sure that each button has the required plugin enabled in the \"Custom Plugins\" setting.","setting_custom_plugins":"Custom Plugins","setting_custom_plugins_desc":"A comma-separated list of TinyMCE plugins to use.","setting_editor_theme":"Editor Theme","setting_template_list":"Template List","setting_template_list_desc":"Specify a list of templates for the template plugin. They must be comma-separated, and then have the format name:URL:description. For example, MyTemp:assets\/templates\/mytemp.html:My very own template","setting_path_options":"Path Options","setting_path_options_desc":"Either \"rootrelative\", \"docrelative\", or \"fullpathurl\".","setting_theme_advanced_blockformats":"HTML Block Elements","setting_theme_advanced_blockformats_desc":"This option should contain a comma separated list of formats that will be available in the format drop down list. This option is only available if the advanced theme is used."};</script>
    <script type="text/javascript" src="/gitclone/assets/components/tinymce/tinymce.panel.js"></script>
    <script type="text/javascript">
    // <[CDATA[
    Ext.onReady(function() {
        Tiny.config = {"accessibility_warnings":true,"apply_source_formatting":true,"browserUrl":"\/gitclone\/manager\/index.php?a=3","button_tile_map":false,"cleanup":true,"cleanup_on_startup":false,"compressor":"","content_css":"","convert_fonts_to_spans":true,"convert_newlines_to_brs":false,"element_format":"xhtml","element_list":"","entities":"","entity_encoding":"","execcommand_callback":"Tiny.onExecCommand","file_browser_callback":"Tiny.loadBrowser","force_p_newlines":true,"force_br_newlines":false,"forced_root_block":false,"formats":{"alignleft":{"selector":"p,h1,h2,h3,h4,h5,h6,td,th,div,ul,ol,li,table,img","classes":"justifyleft"},"alignright":{"selector":"p,h1,h2,h3,h4,h5,h6,td,th,div,ul,ol,li,table,img","classes":"justifyright"},"alignfull":{"selector":"p,h1,h2,h3,h4,h5,h6,td,th,div,ul,ol,li,table,img","classes":"justifyfull"}},"frontend":false,"height":"400px","invalid_elements":"","nowrap":false,"path_options":"","plugin_insertdate_dateFormat":"%Y-%m-%d","plugin_insertdate_timeFormat":"%H:%M:%S","preformatted":true,"resizable":true,"relative_urls":true,"remove_linebreaks":false,"remove_script_host":true,"resource_browser_path":"\/gitclone\/manager\/controllers\/browser\/index.php?","skin":"cirkuit","skin_variant":"","table_inline_editing":true,"template_external_list_url":"\/gitclone\/assets\/components\/tinymce\/template.list.php","theme_advanced_disable":"","theme_advanced_resizing":true,"theme_advanced_resize_horizontal":true,"theme_advanced_statusbar_location":"bottom","theme_advanced_styles":"","theme_advanced_toolbar_align":"left","theme_advanced_toolbar_location":"top","width":"100%","convert_urls":true,"dialog_type":"window","directionality":"ltr","force_hex_style_colors":true,"indentation":"30px","object_resizing":true,"remove_trailing_nbsp":false,"theme_advanced_path":true,"editor":"TinyMCE","elements":["content"],"forfrontend":1,"theme_advanced_blockformats":"p,h1,h2,h3,h4,h5,h6,div,blockquote,code,pre,address","theme_advanced_font_sizes":"80%,90%,100%,120%,140%,160%,180%,220%,260%,320%,400%,500%,700%","buttons1":"undo,redo,selectall,separator,pastetext,pasteword,separator,search,replace,separator,nonbreaking,hr,charmap,separator,image,modxlink,unlink,anchor,media,separator,cleanup,removeformat,separator,fullscreen,print,code,help","buttons2":"bold,italic,underline,strikethrough,sub,sup,separator,bullist,numlist,outdent,indent,separator,justifyleft,justifycenter,justifyright,justifyfull,separator,styleselect,formatselect,separator,styleprops","buttons3":"","buttons4":"","buttons5":"","css_path":"","plugins":"style,advimage,advlink,modxlink,searchreplace,print,contextmenu,paste,fullscreen,noneditable,nonbreaking,xhtmlxtras,visualchars,media","theme":"advanced","theme_advanced_buttons1":"undo,redo,selectall,separator,pastetext,pasteword,separator,search,replace,separator,nonbreaking,hr,charmap,separator,image,modxlink,unlink,anchor,media,separator,cleanup,removeformat,separator,fullscreen,print,code,help","theme_advanced_buttons2":"bold,italic,underline,strikethrough,sub,sup,separator,bullist,numlist,outdent,indent,separator,justifyleft,justifycenter,justifyright,justifyfull,separator,styleselect,formatselect,separator,styleprops","theme_advanced_buttons3":"","theme_advanced_buttons4":"","theme_advanced_buttons5":"","toolbar_align":"ltr","use_browser":"1","language":"en","document_base_url":"\/gitclone\/"};
        Tiny.config.setup = function(ed) { 
            ed.onInit.add(Tiny.onLoad);
            ed.onKeyUp.add(Tiny.onChange);
        };
        Tiny.templates = [];
    });
    // ]]>
    
    </script>
    </head>
    <body>
    <div class="MODX_RichTextWidget"><textarea id="content" name="content" style="width:100%; height:400px;">SomeValue</textarea></div>
    </body>
    </html>
      Did I help you? Buy me a beer
      Get my Book: MODX:The Official Guide
      MODX info for everyone: http://bobsguides.com/modx.html
      My MODX Extras
      Bob's Guides is now hosted at A2 MODX Hosting
      • 28215
      • 4,149 Posts
      I’m not sure the TinyMCE Extra supports a FE RTE at this time.
        shaun mccormick | bigcommerce mgr of software engineering, former modx co-architect | github | splittingred.com
        • 4172
        • 5,888 Posts
        I took together all files, what I did to integrate tiny for xdbedit, for the frontend.
        My Test did it inclusive file-browser loading and that.
        See:
        https://github.com/Bruno17/tinymcefe
          -------------------------------

          you can buy me a beer, if you like MIGX

          http://webcmsolutions.de/migx.html

          Thanks!
          • 11055 ☆ A M B ☆
          • 3,112 Posts
          wowwww... i’m sure i’ll try this.
          can’t you just drop this into the modx’s ’transport’er?
            Rico
            Genius is one percent inspiration and ninety-nine percent perspiration. Thomas A. Edison
            MODx is great, but knowing how to use it well makes it perfect!

            www.virtudraft.com

            Security, security, security! | Indonesian MODx Forum | MODx Revo's cheatsheets | MODx Evo's cheatsheets

            Author of Easy 2 Gallery 1.4.x, PHPTidy, spieFeed, FileDownload R, Upload To Users CMP, Inherit Template TV, LexRating, ExerPlan, Lingua, virtuNewsletter, Grid Class Key, SmartTag, prevNext

            Maintainter/contributor of Babel

            Because it's hard to follow all topics on the forum, PING ME ON TWITTER @_goldsky if you need my help.
            • 3749
            • 24,544 Posts
            Quote from: Bruno17 at Nov 10, 2010, 02:58 AM

            I took together all files, what I did to integrate tiny for xdbedit, for the frontend.
            My Test did it inclusive file-browser loading and that.
            See:
            https://github.com/Bruno17/tinymcefe
            Thanks Bruno. I’m trying your example but I’m getting the same result.

            There an error on this line:

            MODx.loadRTE = function(id) { 


            "MODx is undefined"

              Did I help you? Buy me a beer
              Get my Book: MODX:The Official Guide
              MODX info for everyone: http://bobsguides.com/modx.html
              My MODX Extras
              Bob's Guides is now hosted at A2 MODX Hosting
              • 4172
              • 5,888 Posts
              hmm...
              seems /manager/assets/modext/build/core/modx-min.js isn’t loaded.

              I load it here:
              https://github.com/Bruno17/tinymcefe/blob/master/core/components/tinymcefe/home.php
              (line 33)

              Did you try the complete example?

              created snippet loadrichtext with that code:
              https://github.com/Bruno17/tinymcefe/blob/master/core/components/tinymcefe/elements/snippets/snippet.loadrichtext.php

              and created resource with empty template and that content:
              https://github.com/Bruno17/tinymcefe/blob/master/core/components/tinymcefe/examplepage/example.html
                -------------------------------

                you can buy me a beer, if you like MIGX

                http://webcmsolutions.de/migx.html

                Thanks!
                • 3749
                • 24,544 Posts
                I’d swear I’ve done exactly that, but I’m still getting the "MODx is undefined" errors. If I click on any of the files in the regClient lines, the source comes up, so they’re all being included and modx-min.js is there. I get the same result in IE and FF. I’m sure it’s something stupid. TinyMCE works in the Manager.

                Here’s the source of the page I get:
                <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
                <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
                <head>
                <title>MODx Revolution - NewsPublisher</title>
                <base href="http://localhost/gitclone/" />
                <script type="text/javascript" src="/gitclone/manager/assets/ext3/adapter/ext/ext-base.js"></script>
                <script type="text/javascript" src="/gitclone/manager/assets/ext3/ext-all.js"></script>
                <script type="text/javascript" src="/gitclone/manager/assets/modext/build/core/modx-min.js"></script>
                <script type="text/javascript" src="/gitclone/manager/assets/modext/util/datetime.js"></script>
                <script type="text/javascript" src="/gitclone/assets/components/tinymce/jscripts/tiny_mce/tiny_mce.js"></script>
                <script type="text/javascript" src="/gitclone/assets/components/tinymce/xconfig.js"></script>
                
                <script type="text/javascript" src="/gitclone/assets/components/tinymcefe/tiny.js"></script>
                <script type="text/javascript">Tiny.lang = {"toggle_editor":"Toggle Editor: ","setting_css_selectors":"CSS Selectors","setting_css_selectors_desc":"Here you can enter a list of selectors that should be available in the editor. Enter them as follows:<br \/>\"displayName=selectorName;displayName2=selectorName2\"<br \/>For instance, say you have <b>.mono<\/b> and <b>.smallText<\/b> selectors in your CSS file, you could add them here as:<br \/>\"Monospaced text=mono;Small text=smallText\"<br \/>Note that the last entry should not have a semi-colon after it.","setting_custom_buttons1":"Custom Buttons Row 1","setting_custom_buttons1_desc":"Enter the buttons to use as a comma separated list for the first row. Be sure that each button has the required plugin enabled in the \"Custom Plugins\" setting.","setting_custom_buttons2":"Custom Buttons Row 2","setting_custom_buttons2_desc":"Enter the buttons to use as a comma separated list for the second row. Be sure that each button has the required plugin enabled in the \"Custom Plugins\" setting.","setting_custom_buttons3":"Custom Buttons Row 3","setting_custom_buttons3_desc":"Enter the buttons to use as a comma separated list for the third row. Be sure that each button has the required plugin enabled in the \"Custom Plugins\" setting.","setting_custom_buttons4":"Custom Buttons Row 4","setting_custom_buttons4_desc":"Enter the buttons to use as a comma separated list for the fourth row. Be sure that each button has the required plugin enabled in the \"Custom Plugins\" setting.","setting_custom_buttons5":"Custom Buttons Row 5","setting_custom_buttons5_desc":"Enter the buttons to use as a comma separated list for the fifth row. Be sure that each button has the required plugin enabled in the \"Custom Plugins\" setting.","setting_custom_plugins":"Custom Plugins","setting_custom_plugins_desc":"A comma-separated list of TinyMCE plugins to use.","setting_editor_theme":"Editor Theme","setting_template_list":"Template List","setting_template_list_desc":"Specify a list of templates for the template plugin. They must be comma-separated, and then have the format name:URL:description. For example, MyTemp:assets\/templates\/mytemp.html:My very own template","setting_path_options":"Path Options","setting_path_options_desc":"Either \"rootrelative\", \"docrelative\", or \"fullpathurl\".","setting_theme_advanced_blockformats":"HTML Block Elements","setting_theme_advanced_blockformats_desc":"This option should contain a comma separated list of formats that will be available in the format drop down list. This option is only available if the advanced theme is used."};</script>
                <script type="text/javascript">
                // <[CDATA[
                Ext.onReady(function() {
                    
                	Tiny.config = {"accessibility_warnings":true,"apply_source_formatting":true,"browserUrl":"\/gitclone\/manager\/index.php?a=3","button_tile_map":false,"cleanup":true,"cleanup_on_startup":false,"compressor":"","content_css":"","convert_fonts_to_spans":true,"convert_newlines_to_brs":false,"element_format":"xhtml","element_list":"","entities":"","entity_encoding":"","execcommand_callback":"Tiny.onExecCommand","file_browser_callback":"Tiny.loadBrowser","force_p_newlines":true,"force_br_newlines":false,"forced_root_block":false,"formats":{"alignleft":{"selector":"p,h1,h2,h3,h4,h5,h6,td,th,div,ul,ol,li,table,img","classes":"justifyleft"},"alignright":{"selector":"p,h1,h2,h3,h4,h5,h6,td,th,div,ul,ol,li,table,img","classes":"justifyright"},"alignfull":{"selector":"p,h1,h2,h3,h4,h5,h6,td,th,div,ul,ol,li,table,img","classes":"justifyfull"}},"frontend":false,"height":"400px","invalid_elements":"","nowrap":false,"path_options":"","plugin_insertdate_dateFormat":"%Y-%m-%d","plugin_insertdate_timeFormat":"%H:%M:%S","preformatted":true,"resizable":true,"relative_urls":true,"remove_linebreaks":false,"remove_script_host":true,"resource_browser_path":"\/gitclone\/manager\/controllers\/browser\/index.php?","skin":"cirkuit","skin_variant":"","table_inline_editing":true,"template_external_list_url":"\/gitclone\/assets\/components\/tinymce\/template.list.php","theme_advanced_disable":"","theme_advanced_resizing":true,"theme_advanced_resize_horizontal":true,"theme_advanced_statusbar_location":"bottom","theme_advanced_styles":"","theme_advanced_toolbar_align":"left","theme_advanced_toolbar_location":"top","width":"95%","convert_urls":true,"dialog_type":"window","directionality":"ltr","force_hex_style_colors":true,"indentation":"30px","object_resizing":true,"remove_trailing_nbsp":false,"theme_advanced_path":true,"theme_advanced_blockformats":"p,h1,h2,h3,h4,h5,h6,div,blockquote,code,pre,address","theme_advanced_font_sizes":"80%,90%,100%,120%,140%,160%,180%,220%,260%,320%,400%,500%,700%","buttons1":"undo,redo,selectall,separator,pastetext,pasteword,separator,search,replace,separator,nonbreaking,hr,charmap,separator,image,modxlink,unlink,anchor,media,separator,cleanup,removeformat,separator,fullscreen,print,code,help","buttons2":"bold,italic,underline,strikethrough,sub,sup,separator,bullist,numlist,outdent,indent,separator,justifyleft,justifycenter,justifyright,justifyfull,separator,styleselect,formatselect,separator,styleprops","buttons3":"","buttons4":"","buttons5":"","css_path":"","plugins":"style,advimage,advlink,modxlink,searchreplace,print,contextmenu,paste,fullscreen,noneditable,nonbreaking,xhtmlxtras,visualchars,media","theme":"advanced","theme_advanced_buttons1":"undo,redo,selectall,separator,pastetext,pasteword,separator,search,replace,separator,nonbreaking,hr,charmap,separator,image,modxlink,unlink,anchor,media,separator,cleanup,removeformat,separator,fullscreen,print,code,help","theme_advanced_buttons2":"bold,italic,underline,strikethrough,sub,sup,separator,bullist,numlist,outdent,indent,separator,justifyleft,justifycenter,justifyright,justifyfull,separator,styleselect,formatselect,separator,styleprops","theme_advanced_buttons3":"","theme_advanced_buttons4":"","theme_advanced_buttons5":"","toolbar_align":"ltr","use_browser":"1","language":"en","document_base_url":"\/gitclone\/"};
                    Tiny.templates = [];
                    
                });
                // ]]>
                </script>
                <script type="text/javascript" src="/gitclone/assets/components/tinymce/jscripts/tiny_mce/langs/en.js"></script>
                <script type="text/javascript" src="/gitclone/assets/components/tinymce/tiny.browser.js"></script>
                <script type="text/javascript">
                Ext.onReady(function() {
                
                MODx.loadRTE();
                
                
                });
                </script>
                </head>
                <body>
                
                <div class="MODX_RichTextWidget"><textarea class="modx-richtext" id="content" name="content" style="width:100%; height:400px;">SomeValue</textarea></div>
                
                </body>
                </html>
                  Did I help you? Buy me a beer
                  Get my Book: MODX:The Official Guide
                  MODX info for everyone: http://bobsguides.com/modx.html
                  My MODX Extras
                  Bob's Guides is now hosted at A2 MODX Hosting
                  • 4172
                  • 5,888 Posts
                  strange. It looks absolutely the same as mine.
                  Mine works on FF and also on IE (6!!)

                  in your firebug-DOM is the MODx - object there?
                    -------------------------------

                    you can buy me a beer, if you like MIGX

                    http://webcmsolutions.de/migx.html

                    Thanks!
                    • 3749
                    • 24,544 Posts
                    Quote from: Bruno17 at Nov 11, 2010, 09:45 AM

                    strange. It looks absolutely the same as mine.
                    Mine works on FF and also on IE (6!!)

                    I’m using the lastest dev. version of MODx from git (2.0.5) -- do you have that?

                    I can’t think what else could be different between us. I do have a not-so-up-to-date version of XAMPP. Upgrading XAMPP and uninstalling/reinstalling TinyMCE are the only things I can think of.
                      Did I help you? Buy me a beer
                      Get my Book: MODX:The Official Guide
                      MODX info for everyone: http://bobsguides.com/modx.html
                      My MODX Extras
                      Bob's Guides is now hosted at A2 MODX Hosting
                      • 4172
                      • 5,888 Posts
                      in your firebug-DOM is the MODx - object there?
                        -------------------------------

                        you can buy me a beer, if you like MIGX

                        http://webcmsolutions.de/migx.html

                        Thanks!