[WordPress]  ビジュアルエディタをインライン SVG に対応させる方法

[WordPress] ビジュアルエディタをインライン SVG に対応させる方法

WordPress の投稿などでテキストモードでインライン SVG を入力し、ビジュアルエディタに切り替えると描写されるはずのものは何も表示されない状態となり、そしてテキストエディタへ戻すと SVG タグが消えるという現象が起こってしまいます。

これは、エディタの tinymce が svg タグと SVG に関する属性を不正なものとみなして消してしまう為のようです。

解決する方法

これを解決するには、functions.php へ以下のコードを追加記入して、tiny_mce にすべてのタグと属性の表示を許可するようにします。

function elements_attributes( $init ) {
	$ext = '*[*]';
		if ( isset( $init['valid_elements'] ) ) {
			$init['valid_elements'] .= ',' . $ext;
		} else {
			$init['valid_elements'] = $ext;
		}
	return $init;
}

これで、ビジュアルエディタが svg タグとその属性にも対応できるようになりました。
ビジュアルエディタが svg タグとその属性にも対応された

参考元フォーラムのコードは [‘extended_valid_elements’] に対してすべての要素を許可するようにされていたのですが、それだと同フォーラムの質問者の方と同じく、svg タグが消えてしまうのが何故か解決しませんでした…。

もしこのコードで解決しない場合は、[‘valid_elements’] を [‘extended_valid_elements’] にするとよいかもしれません(参考元と同じコード)。

Related Article

1 Comments & Tracbacks

  • Steffi 2016-07-20 6:05 PM

    That’s the best answer by far! Thanks for cotubirtning.

    Reply

Leave a Comment

Emailは公開されません。*は必須項目です。


*


Categorys

Tags

CSS3 ダッシュボード ヘッダー jQueryプラグイン スライドショー トラブル コードサンプル コンテンツ Facebook 素材 php 引っ越し お知らせ JavaScript カテゴリー Shareボタン CSS IE 投稿タイプ レスポンシブ Photoshop seo Macアプリ サイドバー タクソノミー HTML5 WPセキュリティ Git カスタムメニュー ナビゲーション PHPリファレンス SVG API query_posts RSS WP使い方 iTunes データベース コメント function 条件分岐 get_posts() スマートフォン Sass/Compass moreタグ