will be seen in styles dropdown in the editor

/**— inserts the function button (dropdown styles for list below) –*/

add_filter( ‘mce_buttons_2’, ‘my_mce_buttons_2’ );

function my_mce_buttons_2( $buttons ) {

    array_unshift( $buttons, ‘styleselect’ );

    return $buttons;

}

/*— INSERTS THE STYLES —*/

add_filter( ‘tiny_mce_before_init’, ‘my_mce_before_init’ );

function my_mce_before_init( $settings ) {

    $style_formats = array(

        array(

                ‘title’ => ‘Blue’,

                ‘inline’ => ‘span’,

                ‘classes’ => ‘blue’

        ),

        array(

                ‘title’ => ‘Brown’,

                ‘inline’ => ‘span’,

                ‘classes’ => ‘brown’

        ),        

        array(

                ‘title’ => ‘Purple’,

                ‘inline’ => ‘span’,

                ‘classes’ => ‘purple’

        ),

        array(

                ‘title’ => ‘red’,

                ‘inline’ => ‘span’,

                ‘classes’ => ‘red’

        ),

        array(

                ‘title’ => ‘gold’,

                ‘inline’ => ‘span’,

                ‘classes’ => ‘gold’

        ),

                array(

                ‘title’ => ‘orange’,

                ‘inline’ => ‘span’,

                ‘classes’ => ‘orange’

        ),

         array(

                ‘title’ => ‘small’,

                ‘inline’ => ‘span’,

                ‘classes’ => ‘smallcontent’

        ), 

                 array(

                ‘title’ => ‘clear’,

                ‘inline’ => ‘span’,

                ‘classes’ => ‘clear’

        )       

    );

/*–json encoding makes styles tiny mce friendly —*/

    $settings[‘style_formats’] = json_encode( $style_formats );

    return $settings;

}

IN FUNCTIONS FILE

#content .blue,#content .entry-content h1.blue,#content h2.blue,#content h3.blue,#content h4.blue,#content h5.blue,#content h6.blue,#content p.blue{color:#0d0b4e;}

#content .brown,#content .entry-content h1.brown,#content h2.brown,#content h3.brown,#content h4.brown,#content h5.brown,#content h6.brown,#content p.brown{color:#8d3b0e;}

#content .purple,#content .entry-content h1.purple,#content h2.purple,#content h3.purple,#content h4.purple,#content h5.purple,#content h6.purple,#content p.purple{color:#410333;}

#content .red,#content .entry-content h1.red,#content h2.red,#content h3.red,#content h4.red,#content h5.red,#content h6.red,#content p.red{color:#741711;}

#content .gold,#content .entry-content h1.gold,#content h2.gold,#content h3.gold,#content h4.gold,#content h5.gold,#content h6.gold,#content p.gold{color:#5f5000;}

#content .orange, #content .entry-content h1.orange,#content h2.orange,#content h3.orange,#content h4.orange,#content h5.orange,#content h6.orange,#content p.orange{color:#a74008;}

IN CSS