nav[aria-label="Primary Navigation"] { padding: 0; & ul { list-style: none; width: 100%; display: flex; flex-direction: row; justify-content: start; align-items: start; gap: 30px; padding: 0; & li { margin: 0; } & ul li { list-style: none; } } }

How to create custom html tags inTinyMCE

alex_assard

Hello,

We are running Interwoven TeamSite 6.7.2 Service Pack 2 with XSLT.

Our goal is to create a custom html tag for use in TinyMCE.

Scenario:
User selects text ("my text") and clicks on custom plugin button.
The plugin returns a set of custom tags around the selection the user made:
my text

We have declared extended_valid_elements in the custom_config.js:

IWTinyMCECustomConfig("CCcustom", "extended_valid_elements",
"exitlink[href|size|id|name|target|title]"); ----- where exitlink is our custom tag.

Any help is appreciated.

Could there be other files that we need to modify in order to get this to work?
We've seen examples for other systems (not TS) where these custom tags are created by using custom_elements. What is the format required by TS to accomodate this?

Find more posts tagged with

Comments

Bhargav Coca

Hello,

We are running Interwoven TeamSite 6.7.2 Service Pack 2 with XSLT.

Our goal is to create a custom html tag for use in TinyMCE.

Scenario:
User selects text ("my text") and clicks on custom plugin button.
The plugin returns a set of custom tags around the selection the user made:
my text

We have declared extended_valid_elements in the custom_config.js:

IWTinyMCECustomConfig("CCcustom", "extended_valid_elements",
"exitlink[href|size|id|name|target|title]"); ----- where exitlink is our custom tag.

Any help is appreciated.

Could there be other files that we need to modify in order to get this to work?
We've seen examples for other systems (not TS) where these custom tags are created by using custom_elements. What is the format required by TS to accomodate this?

Making changes to custom_config.js will not make the functionality to be available for you. Follow the instructions mentioned in the documentation to create a new plugin for tinyMCE.

Thanks

(Topic_35563)OS_BIRT_2.6.2_AddColumnToExistingScriptedDataSet.rptdesign

alex_assard

Thank you. We did create a plug-in and it is actually working in FireFox. We're now looking getting it to work in IE as well.

ChangeChartXAxisType.rptdesign

namithapai

can you please share more details of your solution? That way it will be more helpful for others who read this post.
Thanks

alex_assard

Basically, we declaring a new plugin by registering it in the custom_config.js found under /httpd/iw/tinymce/config/. We now also declare the new custom tag we want to create under valid_extended_elements:

IWTinyMCECustomConfig("Custom-configuration", "extended_valid_elements",
"custom-tag[attribute1|attribute2...]");

We then create an actual plugin folder with the new plugin name by making a copy of the provided example folder under /httpd/iw/tinymce/jscripts/tiny_mce/plugins.
The user input is gathered by the html dialog and processed through javascript in the dialog.js file.
Applying the commands provided by the tintmce api, we are able to wrap selected content in our new tags, using the InsertRawHTML command.

We still have to get around some funky behavior of the tags inside the tinymce editor depending on the browser we use. It appears that FF handles this very differently from IE.

Thanks