TinyMCE in Submit Step 2: Small help needed

[nothingman]

I've added the following lines of code in submit_step2.php just after line 73 but TinyMCE editor just fails to show up in submit step 2, just wondering where I'm going wrong.

Line 73 of submit_step2.php

<?php if ($hotaru->post->useContent) { ?>

The code I have added:

<script language="javascript" type="text/javascript" src="<my tiny_mce js path>/tiny_mce.js"></script>
<!-- change src according to your needs -->

<script language="javascript" type="text/javascript">
  tinyMCE.init({
    theme : "advanced",
    mode: "exact",
    elements : "elm1",
    theme_advanced_toolbar_location : "top",
    theme_advanced_buttons1 : "bold,italic,underline,strikethrough,separator,"
    + "justifyleft,justifycenter,justifyright,justifyfull,formatselect,"
    + "bullist,numlist,outdent,indent",
    theme_advanced_buttons2 : "link,unlink,anchor,image,separator,"
    +"undo,redo,cleanup,code,separator,sub,sup,charmap",
    theme_advanced_buttons3 : "",
    height:"350px",
    width:"600px",
    file_browser_callback : 'myFileBrowser'
  });

  function myFileBrowser (field_name, url, type, win) {
    var fileBrowserWindow = new Array();
    fileBrowserWindow['title'] = 'File Browser';
    fileBrowserWindow['file'] = "my_cms_script.php" + "?type=" + type;
    fileBrowserWindow['width'] = '420';
    fileBrowserWindow['height'] = '400';
    tinyMCE.openWindow(fileBrowserWindow, { window : win, resizable : 'yes', inline : 'yes' });
    return false;
  }
</script>

[Nick]

Excuse me if I'm stating the obvious, but did you change the src line at the top of the JavaScript?

<script language="javascript" type="text/javascript" src="<my tiny_mce js path>/tiny_mce.js"></script>
<!-- change src according to your needs -->

[nothingman]

<my tiny_mce js path>
Yep, put this thing path on purpose

[Nick]

Okay, I downloaded TinyMCE and got it working. The tricky part was making sure the file path was correct. I think this would be better as a plugin, but in the meantime...

1. Download and unzip tinymce_3_27.zip

2. Open tinymce_3_2_7/tinymce/jscripts/ and you should find a tiny_mce folder.

3. Move tiny_mce into /content/libs/extensions/ in Hotaru so you have this: /content/libs/extensions/tiny_mce

4. Open /content/plugins/submit/templates/submit_step2.php and copy it to /content/themes/YOUR_THEME/ so you have this: /content/themes/YOUR_THEME/submit_step2.php

5. Open that file and find:

<form name= 

6. Immediately before that line, paste this:

    <script type="text/javascript" src="<?php echo BASEURL; ?>libs/extensions/tiny_mce/tiny_mce.js"></script>
    
    <script type="text/javascript">
    tinyMCE.init({
    theme : "advanced",
    mode : "textareas",
    theme_advanced_buttons3_add : "fullpage"
    });
    </script>

7. Save and test. You might need to do a hard refresh on the page.

That worked for me. You'll want to edit the JavaScript with the TinyMCE code you want to use, and you should also add the code to submit_edit_post.php, too.

Note: If it doesn't work, view the source of the page and find the line which includes the tiny_mce.js file. Check that link in your browser to see if it can find the file or not.

[nothingman]

Sorry for the delay in replying. Correct me if I'm wrong but in the following should /content/libs/extensions/ be /libs/extensions/ instead? I can't find any libs folder under /content/ *lost look*

3. Move tiny_mce into /content/libs/extensions/ in Hotaru so you have this: /content/libs/extensions/tiny_mce

[Nick]

should /content/libs/extensions/ be /libs/extensions/ instead?

Yes. Sorry about that.

[nothingman]

Thanks Nick, it worked.
But:-
- Using bold/italic HTML tags don't have any effect on the main post (yes, the HTML tags are enabled - i, b, em, strong etc). As an example, I've enabled the 'embed' and img HTML tags but the video/image won't show up in the main post.
- When I set the mode in TinyMCE to "exact", TinyMCE won't show up (just curious)

[Nick]

Hmm, I can see some of the problems:

Bold is represented by <strong>, but it doesn't show up because <strong> inherits its font-weight from nowhere in reset-fonts-grids.css (Yahoo's css file included in Hotaru's libs/extensions/YUI-CSS/ folder). I'm pretty weak at CSS so am not sure how you'd fix that. Maybe doing this in your theme's style.css file will help?

strong { font-weight: bold; }

In my test, italics and underline aren't represented by <i> and <u>, but by <em> and <span style="text-decoration: underline">. I haven't checked, but <em> might need declaring in style.css like <strong> above, i.e.

em { font-style: italic; }

I'm not sure about the <span> for underline. Maybe you can specify in TinyMCE which code is supposed to represent each button. You'd have to read through the TinyMCE manual for that.

Finally, I tried an IMG tag and it worked okay for me.

So to summarize, the solution seems to be:
1. Tell TinyMCE how to repesent each button, e.g. underline as <u>
2. Allow those HTML tags to be used in the Submit plugin
3. Specify the CSS for those tags in your stylesheet, or even better in submit.css, so that it doesn't default to Yahoo's reset CSS. Something like this maybe?

.show_post_content strong { font-weight: bold; }
.show_post_content em { font-style: italic; }

One final note. If using summaries on list pages (e.g. "Top Stories" and "Latest"), all tags are stripped to prevent broken tags when the content is truncated. They are not stripped from post pages, though.

[nothingman]

Added the following snippets to style.css and bold/italics work fine. I'm still unable to embed Youtube/videos even after adding 'embed' in the list of allowable HTML tags.
EDIT: I'm using tinymce in my current swcms site and I've enabled <embed> and the videos show fine. I wonder where I'm going wrong.

strong     { font-weight: bold; }
em     { font-style: italic; }

[Nick]

Hotaru uses 3rd party htmLawed together with Inspekt to filter and sanitize HTML and any malicious code. The answer to your problem is probably this:

http://www.bioinformatics.org/phplab...opic.php?id=91

If you'd like to experiment, this is what you'll need to play with:

class getHtmLawed extends AccessorAbstract {

   /**
    * a function to filter HTML
    *
    * @return string
    */
    protected function inspekt($text)
    {
        $config = array('safe' => 1);
        
        require_once(EXTENSIONS . 'htmLawed/htmLawed.php');
        
        if (!get_magic_quotes_gpc()) {
            return htmLawed($text, $config);
        }
        else 
        {
            return htmLawed(stripslashes($text), $config);
        }
        return false;
   }
} 

You can find that at the bottom of HotaruInspekt.php in the /libs folder.