Author Topic: tinyMCE Update to v4.3.3  (Read 740 times)

Marble

  • Global Moderator
  • Veteran Member
  • *****
  • Posts: 1004
  • Karma: +56/-7
tinyMCE Update to v4.3.3
« on: February 03, 2016, 11:47:12 PM »
tinyMCE Update to v4.3.3

Free tinyMCE 4.3.3 upgrade available. To download go to: http://download.moxiecode.com/tinymce/tinymce_4.3.3.zip

1. Unzip the package

2. open the unzipped tinymce_4.3.3 folder and then move the folder named tinymce to www.yoursite.com/admin/js

3. edit www.yoursite.com/admin/skins/email_send.html

at around line 35 replace

Code: [Select]
<script language="javascript" type="text/javascript" src="js/tiny_mce/tiny_mce.js"></script>
<script language="javascript" type="text/javascript">
tinyMCE.init({
mode : "exact",
elements : "message_body",
theme : "advanced",
relative_urls : false,
convert_urls : false,
content_css : "../skins_site/def/styles/content.css"
});
</script>

with:

Code: [Select]
<script type="text/javascript" src="js/tinymce/tinymce.min.js"></script>
    <script type="text/javascript">
        tinymce.init({
            selector: "#message_body",
theme : "modern"

        });
    </script>
   

other files that you can update with this code:
newsletter.html
reject.html


There is not an advanced theme available. Here is an example of a customized editor that you can try out for yourself.

Code: [Select]
<script type="text/javascript" src="js/tinymce/tinymce.min.js"></script>
    <script type="text/javascript">
        tinymce.init({
            selector: "#message_body",
theme : "modern",
plugins: "emoticons,link,lists,image,anchor,advlist,autolink",
menubar: "file edit insert view format table tools",
advlist_bullet_styles: "default",
advlist_number_styles: "default",
browser_spellcheck: true,
toolbar1: 'emoticons | undo redo | styleselect | bold italic | link image',
toolbar2: 'alignleft aligncenter alignright justify | bullist numlist |  anchor'

 
});
 </script>

Another advanced theme format that contains all of the available buttons:
Code: [Select]
<script type="text/javascript" src="js/tinymce/tinymce.min.js"></script>
    <script type="text/javascript">
        tinymce.init({
            selector: "#message_body",
browser_spellcheck: true,

plugins: [
    "advlist autolink autosave link image lists charmap print preview hr anchor pagebreak",
    "searchreplace wordcount visualblocks visualchars code fullscreen insertdatetime media nonbreaking",
    "table contextmenu directionality emoticons template textcolor paste fullpage textcolor colorpicker textpattern"
  ],

  toolbar1: "newdocument fullpage | bold italic underline strikethrough | alignleft aligncenter alignright alignjustify | styleselect formatselect fontselect fontsizeselect",
  toolbar2: "cut copy paste | searchreplace | bullist numlist | outdent indent blockquote | undo redo | link unlink anchor image media code | insertdatetime preview | forecolor backcolor",
  toolbar3: "table | hr removeformat | subscript superscript | charmap emoticons | print fullscreen | ltr rtl | visualchars visualblocks nonbreaking template pagebreak restoredraft",

  menubar: false,
  toolbar_items_size: 'small',

  style_formats: [{
    title: 'Bold text',
    inline: 'b'
  }, {
    title: 'Red text',
    inline: 'span',
    styles: {
      color: '#ff0000'
    }
  }, {
    title: 'Red header',
    block: 'h1',
    styles: {
      color: '#ff0000'
    }
  }, {
    title: 'Example 1',
    inline: 'span',
    classes: 'example1'
  }, {
    title: 'Example 2',
    inline: 'span',
    classes: 'example2'
  }, {
    title: 'Table styles'
  }, {
    title: 'Table row 1',
    selector: 'tr',
    classes: 'tablerow1'
  }],

  templates: [{
    title: 'Test template 1',
    content: 'Test 1'
  }, {
    title: 'Test template 2',
    content: 'Test 2'
  }],
  content_css: [
    '//fast.fonts.net/cssapi/e6dc9b99-64fe-4292-ad98-6974f93cd2a2.css',
    '//www.tinymce.com/css/codepen.min.css'
  ]
});
 </script>

 source: https://www.tinymce.com/docs/plugins/

I have not tested this editor with other devices such as Android, iPhones or tablet computers.
I might go back into this some other day to play around with building a new skin.
If you see that I'm logged in forever... it just means I turned the page on my browser and forgot to logout.

Hornyflings

  • Prime Member
  • ****
  • Posts: 192
  • Karma: +3/-0
    • AsiasHeart
Re: tinyMCE Update to v4.3.3
« Reply #1 on: February 04, 2016, 01:39:04 AM »
Hi Marble,
what is the benefit to follow your advice ??

Marble

  • Global Moderator
  • Veteran Member
  • *****
  • Posts: 1004
  • Karma: +56/-7
Re: tinyMCE Update to v4.3.3
« Reply #2 on: February 04, 2016, 07:59:20 PM »
Hi Marble,
what is the benefit to follow your advice ??

This information can help. This is a comparison from version 3.x to 4.x. It's not imperative that you upgrade, but keep in mind that the version that Etano presently uses is version 2.1 from 1999.
https://www.tinymce.com/docs/advanced/migration-guide-from-3.x/
If you see that I'm logged in forever... it just means I turned the page on my browser and forgot to logout.

Hornyflings

  • Prime Member
  • ****
  • Posts: 192
  • Karma: +3/-0
    • AsiasHeart
Re: tinyMCE Update to v4.3.3
« Reply #3 on: February 05, 2016, 02:10:33 AM »
Quote
This information can help. This is a comparison from version 3.x to 4.x. It's not imperative that you upgrade, but keep in mind that the version that Etano presently uses is version 2.1 from 1999.
https://www.tinymce.com/docs/advanced/migration-guide-from-3.x/

Thanks Marble for detailed explanation.