【備忘録】WordPressの本文で特定の文字列をクリックするたびに表示／非表示（塗りつぶし）するコード

おもしろい効果を教えていただきましたので今後の備忘録として掲載しておきます。

「クリックすると青い帯上に文字列が表示されます」という文字列をクリックすると青いバックで黒い文字列が登場し、そこをクリックすると元の表示に戻るという動作をします。

投稿などの本文には

<span onclick="document.all.item('moji2').style.visibility='visible'">
クリックすると青い帯上に文字列が表示されます
</span>
<div id="moji2" style="visibility: hidden; background: blue; width: 400px;" onclick="document.all.item('moji2').style.visibility='hidden'">クリックすると表示が消えます</div>

を書き、テーマのfunctions.phpへ

function my_tiny_mce_before_init( $init_array ) {
$init_array['valid_elements'] = '*[*]';
$init_array['extended_valid_elements'] = '*[*]';

return $init_array;
}
add_filter( 'tiny_mce_before_init' , 'my_tiny_mce_before_init' ); 

を追記するだけです。

面白い表現で、今後何か使えそうなのでメモしておきます。