On March 26, 2019 we launched new MODX Forums. Please join us at the new MODX Community Forums.
Subscribe: RSS
  • I'm trying to get templates to run. Template button in tinyMCE appears alright. Popup shows, but obviously doesn't load the template file ("blank.htm" in the source as src for the iframe), no error message.
    Evo 1.04
    TinyMCE 3.3.5

    My code in the head section of a chunk which lives in the (modx-)template:
    <script type="text/javascript" src="[(base_url)]/assets/plugins/tinymce/jscripts/tiny_mce/tiny_mce.js"></script >
    <script type="text/javascript">
        tinyMCE.init({
          templates : [
    	{
    		title : "Bilderkasten",
    		url : "[(base_url)]/assets/plugins/tinymce/custom/highslide.htm",
    		description : "Bild vergrößern  mit Bildunterschrift"
    	}
         ]
       });
       </script>

    Already tried to put the call somewhere in the body...
    also, to clear browser as well as modX cache

    Thank you

    This question has been answered by wishbone. See the first response.

    [ed. note: wishbone last edited this post 4 years, 6 months ago.]
    • I would STRONGLY recommend upgrading your site to 1.0.15, as there are multiple actively exploited holes in your current version. The upgrade may also address your particular problem as it does have an updated version of TinyMCE
        Patrick | Server Wrangler
        About Me: Website | TweetsMODX Hosting
      • thx for your reply! but upgrading is no option for me. There are a lot of core changes which I don't know exactly...
        What could be the reason to cause my problem? I don't think it's a problem of tnyMCE version.
        Where else could I have a look?
        • no idea anybody what could be th reason? I'm sure it's just something very little I forgot...
          • discuss.answer
            Solved by myself, after a long time. Problem was easy as I said.
            For the next to spend less time on that:
            I was trying to run tinyMCE in a page instead of in the manager ;-)


            TinyMCE templates are a great possibility to extend the editors' possibillities.
            For instance, insert an image with description, which floats as a whole and can be clicked to enlarge.


            1. create 2 files: imgBox.htm and template_list.js
            imgBox.htm:
            <div class="imgDesc">
            	<a href="[domain]/assets/images/blog/big_img.jpg" class="highslide" onclick="return hs.expand(this)">
            	<img src="[domain]/assets/images/blog/thumb_img.jpg">
            	</a>
            	<p class="small">description goes here</p>
            </div>
            

            template_list.js:
            var tinyMCETemplateList = [
                    // Name, Pfad, Beschreibung
                    ["enlargeable image", "[domain]/assets/plugins/tinymce/jscripts/tiny_mce/plugins/template/imgBox.htm", "floating Box with enlargeable img and description"]
            ];


            2. in modX, tab plugins, tinyMCE, configuration tab, field "parameter config", add:
            template_external_list_url : "[domain]/assets/plugins/tinymce/jscripts/tiny_mce/plugins/template/template_list.js"

            3. To be able to select an image via link in TinyMCE (default only "files"), exchange "files" to "all" in:
            \assets\plugins\tinymce\jscripts\tiny_mce\plugins\advlink\js\advlink.js : Z 31:
            document.getElementById('hrefbrowsercontainer').innerHTML = getBrowserHTML('hrefbrowser','href','all','advlink');


            and insert
            case "all":
            			type = '';
            			break;
               

            in:
            \assets\plugins\tinymce\js\modx_fb.js.inc : Z 21 (where all the "cases" are)

            (as for v 1.0.4)

            4. You can even give the editor a better experience and float the box also in the backend by inserting the style in:
            \assets\plugins\tinymce\styles\content.css :
            e.g.
            .imgDesc {
            	float:left;
            	width:174px;
            	border:#dcdcdc 6px solid;
            	padding:0;
            	margin:0 4px 3px 0;
            }
            .imgDesc img {
            	float:none;
            	border:none;
            	margin:0;
            }


            Of course, you have to add the highslide JS files (or whatever enlarging tool you choose) somewhere in the template.