Charles Belov
Charles Belov

Reputation: 653

CKEditor object styles not working in Drupal 7?

I have the following CKEditor 4 code in my Drupal 7 theme folder, in the file ckeditor.styles.js:

/*
Copyright (c) 2003-2013, CKSource - Frederico Knabben. All rights reserved.
For licensing, see LICENSE.html or http://ckeditor.com/license
*/
/* whenever upgrading CKeditor, this file has to be copied to replace it */

CKEDITOR.stylesSet.add( 'default',
[
  /* Block Styles */

  { name : 'Lead Paragraph'     , element : 'p', attributes : { 'class' : 'lead' } },

  /* Inline Styles */

  { name : 'Cited Work'     , element : 'cite' },

  /* Object Styles */

  {
    name : 'Image on Left',
    element : 'img',
    attributes :
    {
      'style' : 'padding: 5px; margin-right: 5px',
      'border' : '2',
      'align' : 'left'
    }
  },

  {
    name : 'Image on Right',
    element : 'img',
    attributes :
    {
      'style' : 'padding: 5px; margin-left: 5px',
      'border' : '2',
      'align' : 'right'
    }
  },

  {
    name : 'Fare table',
    element : 'table',
    attributes :
    { 
      'class' : 'rate-table'    
    }
  },

  {
    name : 'Featured row',
    element : 'tr',
    attributes :
    {
      'class' : 'super'
    }
  },

]); 

I edit a page that has a table in its body field. I click in the table, then click table on the tag list. CKEditor lists the active tags as being "body table". I click the Styles drop-down and the only style listed is "Lead Paragraph". I also expect to see "Fare table" offered.

I click in the table, then click tr on the tag list. CKEditor grays out the Styles drop-down, and clicking the down arrow does nothing. I expect the drop-down to be active, and to offer the style "Featured row".

How do I get the "Fare table" style to show when the table is selected and the "Featured row" style to show when the table row is selected?

Upvotes: 2

Views: 662

Answers (2)

hhvardan
hhvardan

Reputation: 57

You should double click on Object to select it. The styles will be visible when the Object is selected.

Upvotes: 1

pete80
pete80

Reputation: 545

I had the same problem, it was due to the browser cache as detailed in the following post on drupal.org https://www.drupal.org/node/1543970 renaming ckeditor.styles.js worked for me.

Upvotes: 0

Related Questions