Remove advanced tab from Insert/Edit Media Dialog in TinyMCE 4 - tinymce

I want to remove advanced tab from media popup. How can I remove this advanced tab? Can anyone suggest me?
Example Image

Add below code to your editor configuration under init.
media_poster: false,
media_alt_source: false
Follow https://www.tiny.cloud/docs/plugins/media/#media_poster

There is no configuration to do this in TinyMCE. You can certainly modify the Media plugin's JavaScript file to remove this from the dialog.
If you look in the ../plugins/media folder within TinyMCE you will find the JavaScript for the plugin. If you look at plugin.js file you will find a section that defines the window/dialog:
win = editor.windowManager.open({
...
body: [
...
{
title: 'Advanced',
type: "form",
items: advancedFormItems
}
]
The body array contains the tabs for the dialog. If you remove the object that defines the Advanced tab it will no longer appear.

Related

TinyMCE - Custom Button for inserting a specific template

I am using Prestashop. I have made several templates. Is it possible to prepare a button that will insert the selected template?
For example, I have 4 templates and I want to make 4 buttons.
the first button inserts the first template.
the second button inserts the second template and so on.
I tried to use this code in the file \js\admin\tinymce.inc.js but my new button is not displaying :(
toolbar2: 'customInsertButton',
setup: function (editor) {
editor.ui.registry.addButton('customInsertButton', {
text: 'My Button',
onAction: function (_) {
editor.insertContent('My button works!');
}
});
},
Perhaps Prestashop has some limited version of this editor?
I ask because for example it is possible to add templates. but I would like to be able to insert them faster, with one button...
TinyMCE itself already has a template plugin:
https://www.tiny.cloud/docs/plugins/opensource/template/
Have you considered using that functionality?
I have already found a solution. It is possible by adding a custom plugin.
Everything is beautifully described on the TinyMCE website :
https://www.tiny.cloud/docs/advanced/creating-a-plugin/
then we modify tinymce.inc.js and add plugin support and a defined button in the toolbar.

GUI settings for adding borders to images in TinyMCE editor of Connections 6

We switched from CKEditor to the new TinyMCE editor in Connections 6 CR5. This was a huge improvement. But out of the box, TinyMCE misses some of the features from CKEditor. For example setting borders on images in a way that could be handled by end users (so no manual HTML/CSS changes).
How can we add such a feature to TinyMCE, that the users get some image property dialog that allows setting image borders?
The image plugin has a configuration property image_advtab, which is set to false by default. I tried to enable it and now we see the advanced tab in the image propertys, which allows setting a border (and also advanced attributes) easily:
To enable it, we need to re-add the plugin, since this allows to override it's variables. Add the following to the externalPlugins array in config.js (which is located in ${CUSTOMIZATION_DIR}/javascript/tiny/editors/connections/config.js):
{
name: "image",
url: pluginBaseDir + "image/plugin.min.js",
settings: {
image_advtab: true
}
}
pluginBaseDir is defined above the editor config:
var pluginBaseDir = "/connections/resources/web/tiny.editors.connections/tinymce/plugins/";

How to remove section from TinyMCE link plugin

In my app I using tinymce plugin for adding some files from local machine - link plugin. And it works great, but, there is one section - target, that I want to hide from users.
Because I'm just using '_blank' as default and type 'none' make some troubles.
In documentation I can't find option for hide this section. So I try to hide this by css. Unfortunately id and classes are dynamic, so it was bad idea with css 'display:none'.
It's possible to hide this section somehow?
You can remove the target list altogether by placing this in your TinyMCE configuration:
target_list: false
That is documented here: https://www.tinymce.com/docs/plugins/link/#target_list
To disable the option dialog set target_list to false

Tinymce customize toobar with custom plugin

I am using Tinymce Version: 4.6.5 and i have a custom plugin added.
But i would like to know if it is possible to add custom plugin to 'insert' toolbar?
Please see screen shot here
Any help would be really appreciated.
Thanks
The documentation page for creating a custom plugin shows how to make a menu item:
https://www.tinymce.com/docs/advanced/creating-a-plugin/
Specifically https://www.tinymce.com/docs/advanced/creating-a-plugin/#exampleplugin includes code that shows how to do this ... look at the code that starts:
// Adds a menu item to the tools menu
editor.addMenuItem('example', {
EDIT: If you want to add something to the Insert menu look at the source code for any plugin that is already doing that (e.g. Link). From that plugin you will see code like this:
editor.addMenuItem('link', {
icon: 'link',
text: 'Link',
shortcut: 'Meta+K',
onclick: Actions.openDialog(editor),
stateSelector: 'a[href]',
context: 'insert',
prependToContext: true
});
Note the context setting - this is what places the item on a specific menu.

Plunker Readme.md does not show in embedded preview?

I have written some markdown text in the README.md of a plunk. If I open the Embedded View, and click View the project details button on the top right, the README.md text does not show, just the name of the Plunk and the creator are displayed.
Also, on the Info panel, the markdown does not display the code syntax highlighting - it puts it in a code block, but without the highlighting
```javascript
"use babel";
document.onload = (e) => {
alert('I just annoyed whoever visited this page! USING ES6!');
};
```
Anyone have any info or advice on this?
In order to create an embedded plunk that displays a rendered version of a Markdown (or other) file as the default view, two things need to be done:
show=preview - Tell the embed that the only pane to be shown should be the preview pane. You could also say show=script.js,preview to tell the embed to show the script.js file and the preview.
preview=README.md - Tell the embed that instead of opening the default / preview, to use a specific file. The filename specified does not need to be exact; preview=readme will also work.
For example, here is a link that demonstrates this for the plunk you provided: https://embed.plnkr.co/2mIgB8pGRO7pHXpKJWxj/?show=preview&preview=readme
These, and other supported configuration options, for the embed view are detailed in this gitbook page.