WBCE CMS Forum

losttrip

Member

[solved] modify ckeditor default table width

By default, all tables have a width of 500 (500px), which is an inline style.

I would like to change the default (e.g., 100% ), or have no value set as the default.  That way I can control the table widths with CSS (without having to use !important hacks).

I found this code on several sites, so I added it to the end of my /editor/wb_ckconfig.js file.  Cleared cache, shutdown browser, and still "500" is used as the default.

CKEDITOR.on( 'dialogDefinition', function( ev ) {
    // Take the dialog name and its definition from the event data.
    var dialogName = ev.data.name;
    var dialogDefinition = ev.data.definition;
    // Check if the definition is from the dialog we're
    // interested in (the "Table" dialog).
    if ( dialogName == 'table' ) {
        // Get a reference to the "Table Info" tab.
        var infoTab = dialogDefinition.getContents( 'info' );
        txtWidth = infoTab.get( 'txtWidth' );
        txtWidth['default'] = '100%';
    
});

Any suggestions.

losttrip

Member

Re: [solved] modify ckeditor default table width

Found it!  Adding this to wb_ckconfig.js worked:

CKEDITOR.on('dialogDefinition', function( ev ) {

      var diagName = ev.data.name;
      var diagDefn = ev.data.definition;

      if(diagName === 'table') {
        var infoTab = diagDefn.getContents('info');

        var width = infoTab.get('txtWidth');
        width['default'] = "100%";
      }
});

Because I do not want anything set as the default Table Width, I adjusted to:

CKEDITOR.on('dialogDefinition', function( ev ) {

      var diagName = ev.data.name;
      var diagDefn = ev.data.definition;

      if(diagName === 'table') {
        var infoTab = diagDefn.getContents('info');

        var width = infoTab.get('txtWidth');
        width['default'] = "";
      }
});

Last edited by losttrip (12.09.2021 02:45:04)