JSFiddle - React, Tailwind, and code Playground

HTML

<script src="//cdn.ckeditor.com/4.5.7/standard/ckeditor.js"></script>
<textarea name="editor1">
</textarea>

JavaScript

// Set the callback function 
var setLandscapeClass = {
  exec: function(editor) {
    editor.getSelection().getStartElement().addClass('ckLandscape')
  }
}

//Create the plugin
CKEDITOR.plugins.add('setLandscapeClass', {
  init: function(editor) {
    editor.addCommand('setLandscapeClass', setLandscapeClass);
    editor.ui.addButton("setLandscapeClass", {
      label: 'Set Landscape Class', 
      icon: '',
      command: 'setLandscapeClass'
    });
	
  	// Add the context-menu
    if (editor.addMenuItem) {
      editor.addMenuGroup('testgroup');
      editor.addMenuItem('setLandscapeItem', {
        label: 'Set landscape class',
        command: 'setLandscapeClass',
        group: 'testgroup'
      });
    }

		// On contextmenu - set the item as "visible" by the menu
    if (editor.contextMenu) {
      editor.contextMenu.addListener(function(element, selection) {
      	if (element.hasClass('ckLandscape') === false) {
        	return { setLandscapeItem: CKEDITOR.TRISTATE_ON };
        }
      });
    }
  }
}); 

// Create the instance and add the plugin
CKEDITOR.replace( 'editor1', {
  extraPlugins: 'setLandscapeClass',
  allowedContent: true
});

// enable/disable the button based on the selection of the text in the editor
CKEDITOR.instances.editor1.on( 'selectionChange', function( evt ) {
  var landscapeButton = this.getCommand( 'setLandscapeClass' )
  if ( evt.data.path.lastElement.is( 'img' ) ) { 
    landscapeButton.enable();
  } else {
    landscapeButton.disable();
  }
});