{"result":{"depiction_url":null,"edges":{"references":{"objects":[{"created":"2021-03-14T16:51:57Z","object_id":{"id":1342,"is_a":["text","documentation","reference","template_filter"],"name":"doc_template_filter_filter_show_media","title":"show_media","uri":"https:\/\/zotonic.com\/id\/1342"},"seq":1000000}],"predicate":{"id":332,"is_a":["meta","predicate"],"name":"references","title":{"_type":"trans","tr":{"en":"References"}},"uri":"https:\/\/zotonic.com\/id\/references"}},"refers":{"objects":[{"created":"2026-09-09T13:47:43Z","object_id":{"id":1342,"is_a":["text","documentation","reference","template_filter"],"name":"doc_template_filter_filter_show_media","title":"show_media","uri":"https:\/\/zotonic.com\/id\/1342"},"seq":1000000}],"predicate":{"id":2409,"is_a":["meta","predicate"],"name":"refers","title":{"_type":"trans","tr":{"en":"Refers"}},"uri":"https:\/\/zotonic.com\/id\/refers"}},"subject":{"objects":[{"created":"2026-09-09T13:47:43Z","object_id":{"id":2555,"is_a":["categorization","keyword","keyword_information_type"],"name":"zotonic_topic_reference","title":"Reference","uri":"https:\/\/zotonic.com\/id\/2555"},"seq":1},{"created":"2026-09-09T13:47:43Z","object_id":{"id":2561,"is_a":["categorization","keyword","keyword_audience"],"name":"zotonic_topic_content_editor","title":"Content editor","uri":"https:\/\/zotonic.com\/id\/2561"},"seq":2},{"created":"2026-09-09T13:47:43Z","object_id":{"id":2570,"is_a":["categorization","keyword","keyword_domain"],"name":"zotonic_topic_content_authoring","title":"Content authoring","uri":"https:\/\/zotonic.com\/id\/2570"},"seq":3},{"created":"2026-09-09T13:47:43Z","object_id":{"id":2635,"is_a":["categorization","keyword","keyword_architecture"],"name":"zotonic_topic_module","title":"Module","uri":"https:\/\/zotonic.com\/id\/2635"},"seq":4},{"created":"2026-09-09T13:47:43Z","object_id":{"id":2638,"is_a":["categorization","keyword","keyword_task"],"name":"zotonic_topic_edit","title":"Edit","uri":"https:\/\/zotonic.com\/id\/2638"},"seq":5}],"predicate":{"id":308,"is_a":["meta","predicate"],"name":"subject","title":{"_type":"trans","tr":{"en":"Keyword"}},"uri":"http:\/\/purl.org\/dc\/elements\/1.1\/subject"}}},"id":1756,"is_a":["text","documentation","reference","module"],"links":[{"rel":"self","target":"https:\/\/zotonic.com\/.zotonic\/websub\/topic\/1756"},{"rel":"hub","target":"https:\/\/zotonic.com\/.zotonic\/websub"}],"medium":null,"medium_url":null,"name":"doc_module_mod_editor_tinymce","page_url":{"en":"https:\/\/zotonic.com\/docs\/1756\/mod_editor_tinymce","x-default":"https:\/\/zotonic.com\/docs\/1756\/mod_editor_tinymce"},"preview_url":null,"resource":{"version":3339,"pivot_location_lat":null,"title":"mod_editor_tinymce","is_authoritative":true,"body":"<p>Adds wysiwyg tinyMCE editors to the admin.<\/p>\n<p>The module packs various versions, the version to be used can be selected on the <code>\/admin\/modules<\/code> page.<\/p>\n<p>Two additional tinyMCE plugins are added:<\/p>\n<ul><li>The plugin <code>zmedia<\/code> for selecting images, videos and other media items. In a dialog the centering, size, and optional caption can be choosen. The selected media are added to the page with a <code>depiction<\/code> connection.<\/li><li>The plugin <code>zlink<\/code> for adding links (<code>&lt;a href=&quot;...&quot;&gt;...&lt;\/a&gt;<\/code>) to Zotonic pages in the edited text. The title and URL to the page are automatically added.<\/li><\/ul>\n<p>Media are added as HTML comments in the body text. The filter <a href=\"\/id\/doc_template_filter_filter_show_media\" class=\"doc-reference doc-reference-filter\"><code>filter#show_media<\/code><\/a>\nis used to translate the HTML comment into a figure or other tags. This is done using the template <code>_body_media.tpl<\/code>,\nthough other templates can also be used.<\/p>\n<h2>Usage<\/h2>\n<p>Use TinyMCE by incluyding <code>_editor.tpl<\/code> in your template.<\/p>\n<p>This will, after page load, check all textarea tags with the class <code>z_editor-init<\/code>. These textarea tags are then\naugmented with a TinyMCE editor.<\/p>\n<p>Call the JavaScript function <code>tinymce.triggerSave();<\/code> to save all the TinyCME editor instances to their textarea tags. A\nwired submit action will save before submitting the form.<\/p>\n<h2>Options<\/h2>\n<p>All TinyMCE options are set in the global object <code>tinyInit<\/code>. This is done by the <code>tiny-init.js<\/code> file inside the version\nof TinyMCE. For example <code>priv\/lib\/js\/tinymce-5.10.2\/tiny-init.js<\/code><\/p>\n<p>This file is included by <code>editor.tpl<\/code>, which should be included in your template if you want to use the editor.<\/p>\n<p>Supply your own <code>tinyInit<\/code> object to change the default settings. This can be done before the include of <code>_editor.tpl<\/code>,\nas the <code>tiny-init.js<\/code> will not replace any existing <code>tinyInit<\/code> object.<\/p>\n<h2>Stylesheet<\/h2>\n<p>The default TinyMCE <code>tiny_init.js<\/code> included by <code>_editor.tpl<\/code> includes a stylesheet from <code>\/lib\/css\/tinymce-zotonic.css<\/code>.<\/p>\n<p>By adding a file <code>priv\/lib\/css\/tinymce-zotonic.css<\/code> in your site or module it is possible to use your own styles for the editor.<\/p>\n<p>Takes care of adding the styles for the images managed by the <code>zmedia<\/code> plugin. The default image styles are:<\/p>\n<pre class=\"notranslate\"><code class=\"notranslate language-css\">img.z-tinymce-media {\n    position: relative;\n    border: 1px solid #667;\n    height: auto;\n    cursor: pointer;\n    width: 270px;\n}\n\nimg.z-tinymce-media.z-active:hover {\n    border: 1px solid #039ed4;\n}\n\nimg.z-tinymce-media-align-block {\n    display: block;\n    margin: 1rem 0;\n    clear: both;\n}\n\nimg.z-tinymce-media-align-right {\n    float: right;\n    margin: 0.5rem;\n}\n\nimg.z-tinymce-media-align-left {\n    float: left;\n    margin: 0.5rem;\n}\n\nimg.z-tinymce-media-size-large {\n    width: 90%;\n}\n\nimg.z-tinymce-media-size-middle {\n    width: 50%;\n}\n\nimg.z-tinymce-media-size-small {\n    width: 25%;\n}\n<\/code><\/pre>\n<h2>Accepted Events<\/h2>\n<p>Delegate callbacks:<\/p>\n<ul><li><code>event\/2<\/code> (no explicit <code>#postback\/ #submit\/ #postback_notify<\/code> message clauses documented in this module).<\/li><\/ul>","slug":"mod_editor_tinymce","is_protected":false,"visible_for":0,"tz":"UTC","language":["en"],"doc_source_hash":"ef63d96654ab8e0bfda005faa83fab43b8ac499188932070b92837f3f4cfc58d","is_featured":false,"content_group_id":{"id":2551,"is_a":["meta","content_group"],"name":"content_group_imported_docs","title":"Imported documentation","uri":"https:\/\/zotonic.com\/id\/content_group_imported_docs"},"category_id":{"id":320,"is_a":["meta","category"],"name":"module","title":"Modules","uri":"https:\/\/test.zotonic.com\/id\/320"},"doc_source_path":"apps\/zotonic_mod_editor_tinymce\/src\/mod_editor_tinymce.erl","publication_start":"2023-01-30T19:23:54Z","github_url":"https:\/\/github.com\/zotonic\/zotonic\/blob\/master\/apps\/zotonic_mod_editor_tinymce\/src\/mod_editor_tinymce.erl","pivot_location_lng":null,"doc_source_kind":"module","name":"doc_module_mod_editor_tinymce","is_unfindable":false,"is_published":true,"pivot_geocode":null,"created":"2020-05-30T05:47:33Z","uri":null,"doc_status":"current","is_dependent":false,"erlang_app":"zotonic_mod_editor_tinymce","publication_end":"9999-06-01T00:00:00Z","modifier_id":{"id":1,"is_a":["person"],"name":"administrator","title":"Site Administrator","uri":"https:\/\/zotonic.com\/id\/1"},"privacy":0,"doc_source_commit":"7d09cc54bbfd466739d96b63e27f2f8760832463\n","creator_id":{"id":336,"is_a":["person","robot"],"name":"gitbot","title":"Git","uri":"https:\/\/zotonic.com\/id\/336"},"modified":"2026-10-06T10:51:46Z","title_slug":"mod_editor_tinymce"},"uri":"https:\/\/zotonic.com\/id\/1756","uri_template":"https:\/\/zotonic.com\/id\/:id","websub":{"hub":"https:\/\/zotonic.com\/.zotonic\/websub","topic":"https:\/\/zotonic.com\/.zotonic\/websub\/topic\/1756"}},"status":"ok"}