В CKEditor, как сделать ссылку открытой в новом окне по умолчанию при удалении целевой вкладки?

Question

Я хочу, чтобы ссылки открывались в новом окне по умолчанию. Я старался:

CKEDITOR.on('dialogDefinition', function ( ev ){
   if(ev.data.name == 'link'){
      ev.data.definition.getContents('target').get('linkTargetType')['default']='_blank';
   }
});

Не работает Но я понял, что если я уберу следующую строку. Оно работает.

config.removeDialogTabs = 'image:advanced;image:Link;link:advanced;link:target';

Но тогда проблема в том, что теперь есть целевая вкладка, которая позволяет пользователю изменять цель ссылки.

Что я хочу сделать редактор максимально простым и не хочу, чтобы пользователи могли изменить цель ссылки. Тем не менее, я хочу установить цель по умолчанию в качестве цели:_blank. Какие-либо предложения? Спасибо!

Answer 1

Кажется, что если вы удалите вкладку "Цель", вы не сможете изменить значение по умолчанию на "новое окно".

Тем не менее, вы можете удалить все параметры в списке Target, кроме "нового окна", и установить его в качестве значения по умолчанию.

Попробуйте следующий код:

CKEDITOR.on('dialogDefinition', function(e) {
    if (e.data.name === 'link') {
        var target = e.data.definition.getContents('target');
        var options = target.get('linkTargetType').items;
        for (var i = options.length-1; i >= 0; i--) {
            var label = options[i][0];
            if (!label.match(/new window/i)) {
                options.splice(i, 1);
            }
        }
        var targetField = target.get( 'linkTargetType' );
        targetField['default'] = '_blank';
    }
});

В этом случае вкладка "Цель" все еще существует, но есть только одно значение ("новое окно") для выбора, поэтому пользователи не могут изменить это.

Надеюсь это поможет.

Answer 2

Вот как я обновил свои ссылки, чтобы они открывались в новой вкладке, не затрагивая никакие другие ссылки на странице, а только ссылки из ckEditor. Это в Angular, но вы можете использовать ту же идею в зависимости от вашей платформы.

Я создал канал, чтобы преобразовать ссылку, чтобы включить цель:

import { Pipe, PipeTransform } from '@angular/core';

@Pipe({
  name: 'setlinktarget'
})
export class SetLinkTarget implements PipeTransform {

  transform(value: any): any {
    return value.split('<a ').join('<a target="_new"');
  }

}

Затем я применил канал к своему контенту:

<div [innerHTML]="myRecord.commentsWithHTML | setlinktarget">

Это кажется намного проще, чем все другие варианты, в которых вам нужно изменить файлы ckeditor. Надеюсь, это кому-то поможет.

Answer 3

Другой способ сделать это для предоставления необходимых данных в функции onOk, см. Этот конкретный коммит

Вы добавляете целевой атрибут к объекту данных в функции onOk в plugins/link/dialogs/link.js

onOk: function() {
            var data = {};

            // Collect data from fields.
            this.commitContent( data );


            // Overwrite, always set target="_blank"
            data.target = {
                dependent: "",
                fullscreen: "",
                height: "",
                left: "",
                location: "",
                menubar: "",
                name: "_blank",
                resizable: "",
                scrollbars: "",
                status: "",
                toolbar: "",
                top: "",
                type: "_blank",
                width: ""
            };
     //more code below
     }

Answer 4

CKEDITOR.on('dialogDefinition', function (ev) { 
   var dialogName = ev.data.name;
   var dialog = ev.data.definition.dialog;
   var dialogDefinition = ev.data.definition;

   if(dialogName == 'link') {
      dialogDefinition.onLoad = function () {
         if(dialogName == 'link'){
             dialogDefinition.getContents('target').get('linkTargetType')['default']='_blank';
         }
         dialog.hidePage( 'target' );                   
    };
}
});

//And configure the below
 config.removeDialogTabs = 'image:advanced;link:advanced;link:upload;';

Answer 5

Перейти к ckeditor/plugins/link/dialogs/link.js и вставьте следующий код:

/* Here we are latching on an event ... in this case, the dialog open event */

CKEDITOR.on('dialogDefinition', function(ev) {
    try {    
        /* this just gets the name of the dialog */    
        var dialogName = ev.data.name;

        /* this just gets the contents of the opened dialog */
        var dialogDefinition = ev.data.definition;

        /* Make sure that the dialog opened is the link plugin ... otherwise do nothing */
        if(dialogName == 'link') {`enter code here`    
            /* Getting the contents of the Target tab */
            var informationTab = dialogDefinition.getContents('target');

            /* Getting the contents of the dropdown field "Target" so we can set it */
            var targetField = informationTab.get('linkTargetType');

            /* Now that we have the field, we just set the default to _blank
               A good modification would be to check the value of the
               URL field and if the field does not start with "mailto:" or a
               relative path, then set the value to "_blank" */
            targetField['default'] = '_blank';
        }
    } catch(exception) {
         alert('Error ' + ev.message);
    }
});