Forum

Thread tagged as: Question, Problem, CKEditor

CK Editor Styles

Hi,

I'm trying to add some custom styles to CK editor so the admin can use Foundations inbuilt helpers. Only my Block styles are showing up in the editor and I cleared the browser cache.

Can anyone see if I'm doing anything else wrong? I've downloaded the latest version of CK editor and not changed any other files

CKEDITOR.stylesSet.add( 'default', [
    /* Inline Styles */
    { name: 'Button Normal', element: 'a', attributes: { 'class': 'button' } },
    { name: 'Button Large', element: 'a', attributes: { 'class': 'large' } },
    { name: 'Button Expanded', element: 'a', attributes: { 'class': 'expanded' } },

    /* Block Styles */

    { name: 'Lead',         element: 'p', attributes: { 'class': 'lead' } },
    { name: 'Small',            element: 'p', attributes: { 'class': 'small' } },
    { name: 'H1 Subtitle',          element: 'h1', attributes: { 'class': 'subtitle' } },
    { name: 'H2 Subtitle',          element: 'h2', attributes: { 'class': 'subtitle' } },
    { name: 'H3 Subtitle',          element: 'h3', attributes: { 'class': 'subtitle' } },

    /* Object Styles */

    {
        name: 'Styled image (left)',
        element: 'img',
        attributes: { 'class': 'image-left' }
    },

    {
        name: 'Styled image (right)',
        element: 'img',
        attributes: { 'class': 'image-right' }
    },
    {
        name: 'Stacked Table',
        element: 'table',
        attributes: {'class': 'stack'}
    }

] );
Andrew Cetnarskyj

Andrew Cetnarskyj 0 points

  • 5 years ago
Rachel Andrew

Rachel Andrew 394 points
Perch Support

You may well be better asking on the ckeditor forum, but are there any JavaScript errors in your console?