Fontawesome icon vanishes in editor while switching text and visual mode

2 Views

While switching between text editor mode or updating post fontawesome icon vanishes.Please do not refer to use any plugin.I think i tag is stripped by editor,how can I overcome this?
My code in editor text mode 

<span><i class="fa fa-user"></i></span>

or

Read More
<i class="fa fa-user"></i>

As long as I am in text mode everything is well but when I switch to visual mode all of my code gets vanish.

Post Views: 2

Related posts

Leave a Reply

2 comments

  1. I think you should first enable i tags.Then you should enable class id or span whatever you like.To do so add this code.

    function add_mce_markup( $initArray ) {
    $ext = 'i[id|name|class|style]';
    if ( isset( $initArray['extended_valid_elements'] ) ) {
        $initArray['extended_valid_elements'] .= ',' . $ext;
    } else {
        $initArray['extended_valid_elements'] = $ext;
    }
    return $initArray;
}
add_filter( 'tiny_mce_before_init', 'add_mce_markup' );

  2. This help me to fix this issue
    Try to inser blank spave &nbsp; or comment code <!--ex--> in between i tag like <i class="fa fa-linkedin-square" aria-hidden="true"><!--tr--></i> So that wordpress did not recognize it as empty tag.