How to create custom TinyMCE configurations May 21, 2011 / Updated: Apr 13, 2012
- Create in the root plugins folder a new folder called tiny_mce
- Inside the new tiny_mce folder create a new folder called config
- Go to zp-core/zp-extensions/tiny_mce/config and copy any or all of the existing config files to get you started.
- Place the copied files in your new /plugins/tiny_mce/config/ folder
- Rename your copied config file(s) to something unique for each file, e.g. add a prefix like my or anything else you wish to use.
- Open the new renamed config file and ensure the first javascript line is pointing to the correct location of the normal tiny_mce.js file, by default this should be
- Make any further edits you wish to make within the config file.
- If you want to use your own CSS file for the editor add a new line after the last theme_advanced_**** item and enter
content_css : "/themes/yourthemename/content.css", <- make sure you have the comma at the end. - Create your own content.css file in your theme folder or copy one of the tiny_mce theme css files located in
/zp-core/zp-extensions/tiny_mce/themes/advanced/skins/default and place that in your theme folder and then edit it to your desired requirements and styles. - Upload the new tiny_mce folder (and its contents) in the plugins directory and your new theme content.css file to your zenphoto site.
- Login to your zenphoto admin and go to Options, Plugins, Tiny_mce and then select from the drop down selects your new tiny_mce config files and apply (save).
Your tiny_mce editor for your articles etc should now be working and using your own config files and content.css file.
For more information of config options for tiny_mce go to http://tinymce.moxiecode.com/ and have a look at some of the examples to see what you can do.
This work by www.zenphoto.org is licensed under a Creative Commons Attribution-ShareAlike 3.0 Unported License.
For questions and comments please use the forum or discuss on the social networks.