Drupal and CKEditor, setting default values in the image properties dialog

Copy this file to the root of your theme directory:

/sites/all/modules/ckeditor/ckeditor.config.js

Edit the file and add the following code which will give a default value to HSpace, VSpace and ensure Bootstrap’s “img-responsive” class will be added to all images:

CKEDITOR.on( 'dialogDefinition', function( ev )
  {
    var dialogName = ev.data.name;
    var dialogDefinition = ev.data.definition;
 
    if ( dialogName == 'image' )
    {
      //set the margins
      var infoTab = dialogDefinition.getContents( 'info' );
      var hspaceField = infoTab.get( 'txtHSpace' );
      var vspaceField = infoTab.get( 'txtVSpace' );
      hspaceField['default'] = '10';     
      vspaceField['default'] = '10';

      //set the default class for images
      var advTab = dialogDefinition.getContents( 'advanced' );
      var stylesheetClassesField = advTab.get( 'txtGenClass' );
      stylesheetClassesField['default'] = 'img-responsive';
    }
  });

Lastly, edit your CKEditor profiles and set “Load ckeditor.config.js from theme path” to “Yes”:

/admin/config/content/ckeditor/edit/Advanced

Done.