<![CDATA[ Howto use tinymce or other RTE in posting jot comments - My Forums]]> https://forums.modx.com/thread/?thread=43182 <![CDATA[Re: Howto use tinymce or other RTE in posting jot comments]]> https://forums.modx.com/thread/43182/howto-use-tinymce-or-other-rte-in-posting-jot-comments?page=2#dis-post-516662
I'll be writing a tutorial on this soon.]]> aaronkent Dec 12, 2014, 03:56 AM https://forums.modx.com/thread/43182/howto-use-tinymce-or-other-rte-in-posting-jot-comments?page=2#dis-post-516662 <![CDATA[Re: Howto use tinymce or other RTE in posting jot comments]]> https://forums.modx.com/thread/43182/howto-use-tinymce-or-other-rte-in-posting-jot-comments#dis-post-516660
Quote from: sottwell at May 13, 2010, 02:42 PM
Edit the path to your TinyMCE plugin's .js file
<div id="commentsAnchor"> 
<script type="text/javascript" src="/assets/plugins/tinymce3241/jscripts/tiny_mce/tiny_mce.js"></script> 
<script type="text/javascript">
 tinyMCE.init({ 
    theme : "advanced", 
    mode : "none", 
    theme_advanced_buttons1 : "bold,italic,underline,undo,redo,link,unlink,formatselect,removeformat,cleanup", 
    theme_advanced_buttons2 : "", 
    theme_advanced_buttons3 : "", 
    theme_advanced_toolbar_location : "top", 
    theme_advanced_toolbar_align : "center", 
    theme_advanced_styles : "Code=codeStyle;Quote=quoteStyle", 
    entity_encoding : "raw", 
    add_unload_trigger : false, 
    remove_linebreaks : false, 
    inline_styles : false, 
    convert_fonts_to_spans : false }
 ); 
</script>
 
[!Jot? &tplForm=`formTpl` &tplComments=`commentsTpl` &tplModerate=`moderateTpl` &pagination=`0` &canpost=`Site Admins`!] 

<script type="text/javascript"> 
 tinyMCE.execCommand('mceToggleEditor',false,'comment'); 
</script> 
</div>

And in your form tpl chunk
<label for="comment">Comment:

<textarea tabindex="[+jot.seed:math=`?+2`+]" name="content" cols="50" rows="8" id="comment">[+form.field.content:esc+]</textarea>
</label>
The ID of the textarea has to be the same as the last parameter in the javascript tinyMCE.execCommand function.

I am having trouble implementing this for my forms. Some questions...

Where do I put this...

<div id="commentsAnchor"> 
<script type="text/javascript" src="/assets/plugins/tinymce3241/jscripts/tiny_mce/tiny_mce.js"></script> 
<script type="text/javascript">
 tinyMCE.init({ 
    theme : "advanced", 
    mode : "none", 
    theme_advanced_buttons1 : "bold,italic,underline,undo,redo,link,unlink,formatselect,removeformat,cleanup", 
    theme_advanced_buttons2 : "", 
    theme_advanced_buttons3 : "", 
    theme_advanced_toolbar_location : "top", 
    theme_advanced_toolbar_align : "center", 
    theme_advanced_styles : "Code=codeStyle;Quote=quoteStyle", 
    entity_encoding : "raw", 
    add_unload_trigger : false, 
    remove_linebreaks : false, 
    inline_styles : false, 
    convert_fonts_to_spans : false }
 ); 
</script>
 
[!Jot? &tplForm=`formTpl` &tplComments=`commentsTpl` &tplModerate=`moderateTpl` &pagination=`0` &canpost=`Site Admins`!] 

<script type="text/javascript"> 
 tinyMCE.execCommand('mceToggleEditor',false,'comment'); 
</script> 
</div>


In it's own chunk? Before the form, or after the form?

I can remove the Jot call right? If so, what do i put in the tabindex value?

Will [+form.field.content+] still store the content of the textarea or do I need to set that placeholder again in my snippet? I notice it's only single [] encapsulated.]]> aaronkent Dec 12, 2014, 03:19 AM https://forums.modx.com/thread/43182/howto-use-tinymce-or-other-rte-in-posting-jot-comments#dis-post-516660 <![CDATA[Re: Howto use tinymce or other RTE in posting jot comments]]> https://forums.modx.com/thread/43182/howto-use-tinymce-or-other-rte-in-posting-jot-comments#dis-post-249309 wirkkalaj May 18, 2010, 05:25 PM https://forums.modx.com/thread/43182/howto-use-tinymce-or-other-rte-in-posting-jot-comments#dis-post-249309 <![CDATA[Re: Howto use tinymce or other RTE in posting jot comments]]> https://forums.modx.com/thread/43182/howto-use-tinymce-or-other-rte-in-posting-jot-comments#dis-post-249308 Quote from: pranawebdesign at May 18, 2010, 09:04 PM

remove the :esc modifier from your comments template !!

esc means escape html, the default template has this modifier on the content field.

I was having trouble with this myself....

Damn! Still not working.... Are you using the TinyMCE in your commentsform? Can you post your Comments tpl, Comments Form tpl, and your phx:bbcode snippet and your actual Jot callout? I’ll probably be able to figure it out from that if it’s working for you.]]> wirkkalaj May 18, 2010, 05:15 PM https://forums.modx.com/thread/43182/howto-use-tinymce-or-other-rte-in-posting-jot-comments#dis-post-249308 <![CDATA[Re: Howto use tinymce or other RTE in posting jot comments]]> https://forums.modx.com/thread/43182/howto-use-tinymce-or-other-rte-in-posting-jot-comments#dis-post-249307
esc means escape html, the default template has this modifier on the content field.

I was having trouble with this myself....]]> pranawebdesign May 18, 2010, 04:04 PM https://forums.modx.com/thread/43182/howto-use-tinymce-or-other-rte-in-posting-jot-comments#dis-post-249307 <![CDATA[Re: Howto use tinymce or other RTE in posting jot comments]]> https://forums.modx.com/thread/43182/howto-use-tinymce-or-other-rte-in-posting-jot-comments#dis-post-249306 Here’s my callout:
<div id="commentsAnchor">
<script type="text/javascript" src="/assets/plugins/tinymce3241/jscripts/tiny_mce/tiny_mce.js"></script>
<script type="text/javascript">
tinyMCE.init({
theme : "advanced",
mode : "none",
plugins : "bbcode",
theme_advanced_buttons1 : "bold,italic,underline,undo,redo,image,link,unlink,formatselect,removeformat,cleanup",
theme_advanced_buttons2 : "",
theme_advanced_buttons3 : "",
theme_advanced_toolbar_location : "top",
theme_advanced_toolbar_align : "left",
theme_advanced_styles : "Code=codeStyle;Quote=quoteStyle",
entity_encoding : "raw",
add_unload_trigger : false,
remove_linebreaks : false,
inline_styles : false,
convert_fonts_to_spans : false }
);
</script>

[!Jot? &tplForm=`commentsform` &tplComments=`comments` &pagination=`5` &moderated=`1` &canmoderate=`admin` &notify=`2` !]

<script type="text/javascript">
tinyMCE.execCommand(’mceToggleEditor’,false,’content’);
</script>

</div>

Here’s my comments template:

<a name="jc[+jot.link.id+][+comment.id+]"></a>
<div class="jot-row [+chunk.rowclass+] [+comment.published:is=`0`:then=`jot-row-up`+]">
<div class="jot-comment">

<div class="jot-user">
[+comment.createdby:isnt=`0`:then=`<b>`+][+comment.createdby:userinfo=`username`:ifempty=`[+comment.custom.name:ifempty=`[+jot.guestname+]`:esc+]`+][+comment.createdby:isnt=`0`:then=`</b>`+]

Reviews: [+comment.userpostcount+]
</div>

<div class="jot-content">

<div class="jot-posticon">
[+phx:userinfo=`lastlogin`:ifempty=`9999999999`:lt=`[+comment.createdon+]`:then=`
<img src="[(base_url)]assets/snippets/jot/templates/comment.gif" width="16" height="16" alt="New comment" border="0" />
`:else=`
<img src="[(base_url)]assets/snippets/jot/templates/comment_trans.gif" width="16" height="16" alt="Comment" border="0" />
`:strip+]
</div>

<div class="jot-mod">
[+jot.moderation.enabled:is=`1`:then=`
<a href="[+jot.link.delete:esc+][+jot.querykey.id+]=[+comment.id+]#jotmod[+jot.link.id+]" onclick="return confirm(’Are you sure you wish to delete this comment?’)" title="Delete Comment"><img src="[(base_url)]assets/snippets/jot/templates/delete.gif" width="16" height="16" alt="Delete Comment" border="0" /></a>
[+comment.published:is=`0`:then=`
<a href="[+jot.link.publish:esc+][+jot.querykey.id+]=[+comment.id+]#jotmod[+jot.link.id+]" onclick="return confirm(’Are you sure you wish to publish this comment?’)" title="Publish Comment"><img src="[(base_url)]assets/snippets/jot/templates/publish.png" width="16" height="16" alt="Publish Comment" border="0" /></a>
`+]
[+comment.published:is=`1`:then=`
<a href="[+jot.link.unpublish:esc+][+jot.querykey.id+]=[+comment.id+]#jotmod[+jot.link.id+]" onclick="return confirm(’Are you sure you wish to unpublish this comment?’)" title="Unpublish Comment"><img src="[(base_url)]assets/snippets/jot/templates/unpublish.png" width="16" height="16" alt="Unpublish Comment" border="0" /></a>
`+]
`:strip+]
[+jot.user.canedit:is=`1`:and:if=`[+comment.createdby+]`:is=`[+jot.user.id+]`:or:if=`[+jot.moderation.enabled+]`:is=`1`:then=`
<a href="[+jot.link.edit:esc+][+jot.querykey.id+]=[+comment.id+]#jf[+jot.link.id+]" onclick="return confirm(’Are you sure you wish to edit this comment?’)" title="Edit Comment"><img src="[(base_url)]assets/snippets/jot/templates/edit.gif" width="16" height="16" alt="Edit Comment" border="0" /></a>
`:strip+]
</div>

<span class="jot-subject">[+comment.title:limit:esc+]</span>

<span class="jot-poster"><b>Posted on :</b> [+comment.createdon:date=`%a %B %d, %Y, %H:%M:%S`+]</span>
<hr />
<div class="jot-message">[+comment.content:bbcode:nl2br+]</div>
<div class="jot-extra">
[+comment.editedon:isnt=`0`:then=`
<span class="jot-editby">Last Edit: [+comment.editedon:date=`%B %d, %Y, %H:%M:%S`+] by [+comment.editedby:userinfo=`username`:ifempty=` * `+]</span>
&nbsp;`+] [+jot.moderation.enabled:is=`1`:then=`<a target="_blank" href="http://www.ripe.net/perl/whois?searchtext=[+comment.secip+]">[+comment.secip+]</a>`+]</div>
</div>

</div>

</div>]]> wirkkalaj May 18, 2010, 04:31 AM https://forums.modx.com/thread/43182/howto-use-tinymce-or-other-rte-in-posting-jot-comments#dis-post-249306 <![CDATA[Re: Howto use tinymce or other RTE in posting jot comments]]> https://forums.modx.com/thread/43182/howto-use-tinymce-or-other-rte-in-posting-jot-comments#dis-post-249305
I now have the tinyMCE editor working in my jot comments form, but when I post a comment, the html is not getting parsed and still shows <strong>Hello</strong> etc.. I looked around and found that I might need to edit a line in my comments template from [+comment.content:wordwrap:esc:nl2br+] to [+comment.content:bbcode:nl2br+]. So I did that and also made a new snippet called phx:bbcode. It still doesn’t parse the html in the comments. I also tried adding a plug-in called bbcode parser that I got from this website and added the event to it called onWebPagePreRender.
It still will not work!!
I’ve looked everywhere for an answer. I’m out of hope. Please help me!
Let me know if you want me to post my callouts and such.]]> wirkkalaj May 13, 2010, 11:49 AM https://forums.modx.com/thread/43182/howto-use-tinymce-or-other-rte-in-posting-jot-comments#dis-post-249305 <![CDATA[Re: Howto use tinymce or other RTE in posting jot comments]]> https://forums.modx.com/thread/43182/howto-use-tinymce-or-other-rte-in-posting-jot-comments#dis-post-249304 wirkkalaj May 13, 2010, 09:53 AM https://forums.modx.com/thread/43182/howto-use-tinymce-or-other-rte-in-posting-jot-comments#dis-post-249304 <![CDATA[Re: Howto use tinymce or other RTE in posting jot comments]]> https://forums.modx.com/thread/43182/howto-use-tinymce-or-other-rte-in-posting-jot-comments#dis-post-249303 
<div id="commentsAnchor"> 
<script type="text/javascript" src="/assets/plugins/tinymce3241/jscripts/tiny_mce/tiny_mce.js"></script> 
<script type="text/javascript">
 tinyMCE.init({ 
    theme : "advanced", 
    mode : "none", 
    theme_advanced_buttons1 : "bold,italic,underline,undo,redo,link,unlink,formatselect,removeformat,cleanup", 
    theme_advanced_buttons2 : "", 
    theme_advanced_buttons3 : "", 
    theme_advanced_toolbar_location : "top", 
    theme_advanced_toolbar_align : "center", 
    theme_advanced_styles : "Code=codeStyle;Quote=quoteStyle", 
    entity_encoding : "raw", 
    add_unload_trigger : false, 
    remove_linebreaks : false, 
    inline_styles : false, 
    convert_fonts_to_spans : false }
 ); 
</script>
 
[!Jot? &tplForm=`formTpl` &tplComments=`commentsTpl` &tplModerate=`moderateTpl` &pagination=`0` &canpost=`Site Admins`!] 

<script type="text/javascript"> 
 tinyMCE.execCommand('mceToggleEditor',false,'comment'); 
</script> 
</div>

And in your form tpl chunk
<label for="comment">Comment:

<textarea tabindex="[+jot.seed:math=`?+2`+]" name="content" cols="50" rows="8" id="comment">[+form.field.content:esc+]</textarea>
</label>
The ID of the textarea has to be the same as the last parameter in the javascript tinyMCE.execCommand function.
]]> sottwell May 13, 2010, 09:42 AM https://forums.modx.com/thread/43182/howto-use-tinymce-or-other-rte-in-posting-jot-comments#dis-post-249303 <![CDATA[Re: Howto use tinymce or other RTE in posting jot comments]]> https://forums.modx.com/thread/43182/howto-use-tinymce-or-other-rte-in-posting-jot-comments#dis-post-249302 Quote from: salik at Apr 21, 2008, 08:16 AM

Hi, I saw topic like mine a couple of months (at least) ago. Is there a possibility to include rte editor in posting jot coments?

Regards,

Mike

I’m looking for something similar myself.]]> wirkkalaj May 13, 2010, 12:52 AM https://forums.modx.com/thread/43182/howto-use-tinymce-or-other-rte-in-posting-jot-comments#dis-post-249302