{"id":12683,"date":"2021-06-13T06:54:59","date_gmt":"2021-06-13T11:54:59","guid":{"rendered":"httpss:\/\/www.powenko.com\/wordpress\/docs\/tinymce\/plugins%e8%87%aa%e8%a3%bd\/%e8%87%aa%e8%a3%bd%e5%a4%96%e6%8e%9b-easy\/"},"modified":"2021-06-13T19:13:39","modified_gmt":"2021-06-14T00:13:39","slug":"%e8%87%aa%e8%a3%bd%e5%a4%96%e6%8e%9b-easy","status":"publish","type":"docs","link":"https:\/\/www.powenko.com\/wordpress\/?docs=tinymce\/plugins%e8%87%aa%e8%a3%bd\/%e8%87%aa%e8%a3%bd%e5%a4%96%e6%8e%9b-easy","title":{"rendered":"\u81ea\u88fd\u5916\u639b-easy"},"content":{"rendered":"<pre class=\"brush: plain; title: ; notranslate\" title=\"\">\r\n&lt;!DOCTYPE html&gt;\r\n&lt;html lang=&quot;en&quot;&gt;\r\n&lt;head&gt;\r\n    &lt;!--\r\n    &lt;script src=&quot;httpsss:\/\/cdn.tiny.cloud\/1\/mott8ilewgbu1tryzfu9q7sdcmn5qfqt19jixbvaqgaz6kjc\/tinymce\/5\/tinymce.min.js&quot; referrerpolicy=&quot;origin&quot;&gt;&lt;\/script&gt;\r\n    --&gt;\r\n    &lt;script src=&quot;httpsss:\/\/code.jquery.com\/jquery-1.11.3.js&quot;&gt;&lt;\/script&gt;\r\n    &lt;script src=&quot;..\/..\/..\/system\/libs\/tinymce\/js\/tinymce\/tinymce.min.js&quot; referrerpolicy=&quot;origin&quot;&gt;&lt;\/script&gt;\r\n\r\n    &lt;script&gt;\r\n\r\n\r\n\r\n\r\n        tinymce.PluginManager.add('myplugin', function (editor) {\r\n            editor.ui.registry.addSidebar('myplugin', {\r\n                tooltip: 'My sidebarB',\r\n                icon: 'image',\r\n                onSetup: function (api) {\r\n                    console.log('Render panel', api.element());\r\n                },\r\n                onShow: function (api) {\r\n                    console.log('Show panel', api.element());\r\n                    api.element().innerHTML = 'Hello world!  BBBB';\r\n                },\r\n                onHide: function (api) {\r\n                    console.log('Hide panel', api.element());\r\n                }\r\n            });\r\n        });\r\n\r\n\r\n\r\n\r\n        tinymce.PluginManager.add('my-example-plugin', function (editor) {\r\n            editor.ui.registry.addMenuItem('image', {\r\n                icon: 'image',\r\n                text: 'Image',\r\n                onAction: function () {\r\n                    console.log('context menu clicked');\r\n                    alert('context menu clicked');\r\n                }\r\n            });\r\n\r\n            editor.ui.registry.addContextMenu('image', {\r\n                update: function (element) {\r\n                    return !element.src ? '' : 'image';\r\n                }\r\n            });\r\n        });\r\n\r\n\r\n\r\n        tinymce.init({\r\n            selector: 'textarea#richTextArea_ww_powenko_com',\r\n            contextmenu: 'image',\r\n            plugins: 'my-example-plugin myplugin mysidebar',\r\n            content_style: 'body { font-family:Helvetica,Arial,sans-serif; font-size:14px }',\r\n            toolbar: 'mysidebar myplugin my-example-plugin  ',\r\n            setup: function (editor) {\r\n                editor.ui.registry.addSidebar('mysidebar', {\r\n                    tooltip: 'My sidebarA',\r\n                    icon: 'comment',\r\n                    onSetup: function (api) {\r\n                        console.log('Render panel', api.element());\r\n                    },\r\n                    onShow: function (api) {\r\n                        console.log('Show panel', api.element());\r\n                        api.element().innerHTML = 'Hello world!';\r\n                    },\r\n                    onHide: function (api) {\r\n                        console.log('Hide panel', api.element());\r\n                    }\r\n                });\r\n            }\r\n        });\r\n\r\n\r\n\r\n    &lt;\/script&gt;\r\n&lt;\/head&gt;\r\n&lt;body&gt;\r\n&lt;textarea id=&quot;richTextArea_ww_powenko_com&quot;&gt;\r\n\r\n  &lt;p&gt;Right click on the example image below will show the newly configured context menu.&lt;\/p&gt;\r\n\r\n  &lt;p style=&quot;text-align: center;&quot;&gt;\r\n    &lt;img title=&quot;TinyMCE Logo&quot; src=&quot;\/\/www.tiny.cloud\/images\/glyph-tinymce@2x.png&quot; alt=&quot;TinyMCE Logo&quot; width=&quot;110&quot; height=&quot;97&quot; \/&gt;\r\n  &lt;\/p&gt;\r\n  &lt;p&gt;Right Clicking on text should not invoke the context menu&lt;\/p&gt;\r\n&lt;\/textarea&gt;\r\nwww.popwenko.comw\r\n&lt;\/body&gt;\r\n&lt;\/html&gt;\r\n<\/pre>\n<p><a href=\"httpss:\/\/www.powenko.com\/wordpress\/wp-content\/uploads\/2021\/06\/Screen-Shot-2021-06-13-at-7.55.38-PM-1.png\"><img loading=\"lazy\" decoding=\"async\" class=\"alignnone size-medium wp-image-12686\" src=\"httpss:\/\/www.powenko.com\/wordpress\/wp-content\/uploads\/2021\/06\/Screen-Shot-2021-06-13-at-7.55.38-PM-1-570x119.png\" alt=\"\" width=\"570\" height=\"119\" srcset=\"https:\/\/www.powenko.com\/wordpress\/wp-content\/uploads\/2021\/06\/Screen-Shot-2021-06-13-at-7.55.38-PM-1-570x119.png 570w, https:\/\/www.powenko.com\/wordpress\/wp-content\/uploads\/2021\/06\/Screen-Shot-2021-06-13-at-7.55.38-PM-1-768x160.png 768w, https:\/\/www.powenko.com\/wordpress\/wp-content\/uploads\/2021\/06\/Screen-Shot-2021-06-13-at-7.55.38-PM-1-300x62.png 300w, https:\/\/www.powenko.com\/wordpress\/wp-content\/uploads\/2021\/06\/Screen-Shot-2021-06-13-at-7.55.38-PM-1.png 2008w\" sizes=\"(max-width: 570px) 100vw, 570px\" \/><\/a><\/p>\n<p><iframe loading=\"lazy\" width=\"100%\" height=\"300\" src=\"\/\/jsfiddle.net\/powenko\/s21rf6e5\/1\/embedded\/\" allowfullscreen=\"allowfullscreen\" allowpaymentrequest frameborder=\"0\"><\/iframe><\/p>\n","protected":false},"featured_media":0,"parent":12682,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","doc_tag":[],"class_list":["post-12683","docs","type-docs","status-publish","hentry"],"comment_count":0,"_links":{"self":[{"href":"https:\/\/www.powenko.com\/wordpress\/index.php?rest_route=\/wp\/v2\/docs\/12683"}],"collection":[{"href":"https:\/\/www.powenko.com\/wordpress\/index.php?rest_route=\/wp\/v2\/docs"}],"about":[{"href":"https:\/\/www.powenko.com\/wordpress\/index.php?rest_route=\/wp\/v2\/types\/docs"}],"replies":[{"embeddable":true,"href":"https:\/\/www.powenko.com\/wordpress\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=12683"}],"version-history":[{"count":3,"href":"https:\/\/www.powenko.com\/wordpress\/index.php?rest_route=\/wp\/v2\/docs\/12683\/revisions"}],"predecessor-version":[{"id":12688,"href":"https:\/\/www.powenko.com\/wordpress\/index.php?rest_route=\/wp\/v2\/docs\/12683\/revisions\/12688"}],"up":[{"embeddable":true,"href":"https:\/\/www.powenko.com\/wordpress\/index.php?rest_route=\/wp\/v2\/docs\/12682"}],"next":[{"title":"\u8f38\u5165\u8a0a\u606fAnnotations","link":"https:\/\/www.powenko.com\/wordpress\/?docs=tinymce\/plugins%e8%87%aa%e8%a3%bd\/%e8%bc%b8%e5%85%a5%e8%a8%8a%e6%81%afannotations","href":"https:\/\/www.powenko.com\/wordpress\/index.php?rest_route=\/wp\/v2\/docs\/12689"}],"wp:attachment":[{"href":"https:\/\/www.powenko.com\/wordpress\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=12683"}],"wp:term":[{"taxonomy":"doc_tag","embeddable":true,"href":"https:\/\/www.powenko.com\/wordpress\/index.php?rest_route=%2Fwp%2Fv2%2Fdoc_tag&post=12683"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}