0

Using Foundation 5's accordion, and the data-accordion html data attribute in:

<dl class="accordion" data-accordion>

gets removed when a user only edits a page with the Visual Editor.

Does anyone know of a way to keep this from happening?

I noticed this link that allows you to Register Additional HTML Attributes for TinyMCE and WP KSES, though I'm not sure where I'd place data-accordion in that code.

1 Answer 1

2

Here is an example of How to Update kses and TinyMCE to allow select data-* attributes in WordPress. Reference

add_action( 'after_setup_theme', 'x_kses_allow_data_attributes_on_links' );
function x_kses_allow_data_attributes_on_links() {
  global $allowedposttags;

    $tags = array( 'a' );
    $new_attributes = array(
        'data-foo' => array(),
        'data-bar' => array(),
    );

    foreach ( $tags as $tag ) {
        if ( isset( $allowedposttags[ $tag ] ) && is_array( $allowedposttags[ $tag ] ) )
            $allowedposttags[ $tag ] = array_merge( $allowedposttags[ $tag ], $new_attributes );
    }
}

add_filter( 'tiny_mce_before_init', 'x_tinymce_allow_data_attributes_on_links' );
function x_tinymce_allow_data_attributes_on_links( $options ) { 
    if ( ! isset( $options['extended_valid_elements'] ) ) 
        $options['extended_valid_elements'] = ''; 

    $options['extended_valid_elements'] .= ',a[data-foo|data-bar|class|id|style|href]';

    return $options; 
}
1
  • Thanks! Though, because Foundation uses data-attributes on <dl> and not <a>, should line 7 become $tags = array( 'dl' ); and line 24 changed to: ',dl[data-accordion|data-tab|class|id|style|href]'; ?
    – timmyg
    May 19, 2015 at 13:48

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.