Installing a CKEditor plugin in Liferay - liferay

Question

I have followed these steps to add CKEditor YouTube plugin in Liferay 6.2 GA4 and I could able to add a plugin in Content section editor.
CKEditor YouTube plugin: http://ckeditor.com/addon/youtube
All plugins are located in ${LIFERAY_HOME}\tomcat-7.0.42\webapps\ROOT\html\js\editor\ckeditor\plugins folder.
1) Place the youtube plugin folder in plugins folder.
2) Add following change in the config.js file located in ${LIFERAY_HOME}\tomcat-7.0.42\webapps\ROOT\html\js\editor\ckeditor folder
CKEDITOR.editorConfig = function( config ) {
// Define changes to default configuration here. For example:
// config.language = 'fr';
// config.uiColor = '#AADC6E';
config.extraPlugins = 'youtube';
};
3) Add following 'youtube' entries in the ckconfig.jsp file located in ${LIFERAY_HOME}\tomcat-7.0.42\webapps\ROOT\html\js\editor\ckeditor folder
config.extraPlugins = 'ajaxsave,media,restore,scayt,wsc,youtube';
config.toolbar_liferayArticle = [
['Styles', 'FontSize', '-', 'TextColor','BGColor'],
['Bold', 'Italic', 'Underline', 'Strike'],
['Subscript', 'Superscript'],['Youtube'],
'/',['Undo', 'Redo', '-', 'Cut', 'Copy', 'Paste',
'PasteText', 'PasteFromWord', '-', 'SelectAll','RemoveFormat'],
4) Restart the Liferay.
I know that this can be achieved by using Liferay Hook project.
However when I am using Liferay Structures and Templates this plugin is not appeared in the CKEditor. What are the other changes need to do in Liferay server?

Answer 1

When using Structures and Templates in Liferay, it is consisted with different types of CKEditor toolbars.Those different toolbars are defined in ckconfig.jsp and you need to change all the toolbar sections.
config.toolbar_email = [
['FontSize', 'TextColor', 'BGColor', '-', 'Bold', 'Italic', 'Underline', 'Strike'],
['JustifyLeft', 'JustifyCenter', 'JustifyRight', 'JustifyBlock'],
['SpellChecker', 'Scayt'],
['Youtube'],
'/',
['Undo', 'Redo', '-', 'Cut', 'Copy', 'Paste', 'PasteText', 'PasteFromWord', '-', 'SelectAll', 'RemoveFormat'],
['Source'],
['Link', 'Unlink'],
['Image']
];
config.toolbar_liferay = [
['Bold', 'Italic', 'Underline', 'Strike'],
<c:if test="<%= inlineEdit %>">
['AjaxSave', '-', 'Restore'],
</c:if>
['Undo', 'Redo', '-', 'Cut', 'Copy', 'Paste', 'PasteText', 'PasteFromWord', ],
['Styles', 'FontSize', '-', 'TextColor', 'BGColor'],
['Youtube'],
'/',
['NumberedList', 'BulletedList', '-', 'Outdent', 'Indent'],
['JustifyLeft', 'JustifyCenter', 'JustifyRight', 'JustifyBlock'],
['Image', 'Link', 'Unlink', 'Anchor'],
['Flash', <c:if test="<%= XugglerUtil.isEnabled() %>"> 'Audio', 'Video',</c:if> 'Table', '-', 'Smiley', 'SpecialChar'],
['Find', 'Replace', 'SpellChecker', 'Scayt'],
['SelectAll', 'RemoveFormat'],
['Subscript', 'Superscript']
<c:if test="<%= !inlineEdit %>">
,['Source']
</c:if>
];
config.toolbar_liferayArticle = [
['Styles', 'FontSize', '-', 'TextColor', 'BGColor'],
['Bold', 'Italic', 'Underline', 'Strike'],
['Subscript', 'Superscript'],
['Youtube'],
'/',
['Undo', 'Redo', '-', 'Cut', 'Copy', 'Paste', 'PasteText', 'PasteFromWord', '-', 'SelectAll', 'RemoveFormat'],
['Find', 'Replace', 'SpellChecker', 'Scayt'],
['NumberedList','BulletedList','-','Outdent','Indent','Blockquote'],
['JustifyLeft', 'JustifyCenter', 'JustifyRight', 'JustifyBlock'],
'/',
['Source'],
['Link', 'Unlink', 'Anchor'],
['Image', 'Flash', <c:if test="<%= XugglerUtil.isEnabled() %>">'Audio', 'Video',</c:if> 'Table', '-', 'Smiley', 'SpecialChar', 'LiferayPageBreak']
];