ckeditor / ckeditor4-angular

Official CKEditor 4 Angular component.
Other
54 stars 32 forks source link

Plugins support. #185

Closed knz237 closed 3 years ago

knz237 commented 3 years ago

Are you reporting a feature request or a bug?

Provide detailed reproduction steps (if any)

WE took the latest of CKEditor4-anglar WE want to add our custom plugin to the Editor Chedked in the node modules folder of the library couldnot find where to add the plugins / plugin folder as suggested in official ckeditor site.

Expected result

A Plugin folder sould be abailable to add custom plugins

Actual result

Not able to add any plugins

Other details

Thanks

Dumluregn commented 3 years ago

Hello, you need to use CKEDITOR.plugins.addExternal() method and include the plugin in the custom config.

Please note that our GitHub issue tracker serves for reporting bugs and new features only, so I'm closing this issue.

ronaldohoch commented 3 years ago

Have this issue too. I have a custom build with custom made plugins.

Here my files:

<ckeditor 
    data="<p>Hello, world!</p>"
    [config]="config"
    (ready)="onReady($event)"
    ></ckeditor>

Tried on the ngOnInit using the CKEDITOR variable. Tried on the (ready)="" function using event.editor.plugins.addExternal("dinux_links","http://localhost:8080/plugins/dinux_links/plugin.js") Tried on the (ready) using the CKEDITOR variable.

import { Component, OnInit } from '@angular/core';

import { CKEditor4 } from 'ckeditor4-angular/ckeditor';

declare var CKEDITOR:any;

@Component({
  selector: 'dinamize-nx-workspace-ckeditor',
  templateUrl: './ckeditor.component.html',
  styleUrls: ['./ckeditor.component.css']
})
export class CkeditorComponent implements OnInit {
  config={
    language: "pt-br",
    extraPlugins: 'dinux_links',
    toolbar: [
        {name: 'basicstyles', groups: ['basicstyles', 'cleanup'], items: ['Bold', 'Italic', 'Underline', '-', 'RemoveFormat']},
        {name: 'paragraph', groups: ['align'], items: ['JustifyLeft', 'JustifyCenter', 'JustifyRight', 'JustifyBlock']},
        {name: 'styles', items: ['Format', 'Font', 'FontSize']},
        {name: 'Adds', groups: ['addons_dinux'], items: ['dinux_links', 'Source']},
    ]
  }
  constructor() {

  }

  ngOnInit(): void {
    CKEDITOR.plugins.addExternal("dinux_links","http://localhost:8080/plugins/dinux_links/plugin.js");
  }

  onReady(event: CKEditor4.EventInfo){
    // console.log("editor",event.editor);
    CKEDITOR.plugins.addExternal("dinux_links","http://localhost:8080/plugins/dinux_links/plugin.js");
    // event.editor.plugins.addExternal("dinux_links","http://localhost:8080/plugins/dinux_links/plugin.js")
  }
}

Don't work :/