wordpressでiframeタグが使えない - 解決方法


ワードプレスを使っていて、グーグルマップの地図の埋め込みコードをHTMLに埋め込もうとしても自動的に消去されて表示できないという経験をされたことはないでしょうか。

これは、埋め込みコード(HTML)の中にiframeというタグが使われていおり、ワードプレスではデフォルトでこのiframeタグを自動的に消去してしまうことによって生じます。
グーグルカレンダーも同じく埋め込みにiframeタグを使用しますし、他の多くの埋め込みサービスを行っているサイトでiframeが使われています。

どうしてもこれらのiframeタグをワードプレスで表示させたい方のために、その方法について説明します。


当方で確認した環境はwordpress3.1.1です。
(注意: 当記事に書かれている内容に従って発生したいかなる問題についても、当方では責任を負いかねますので了承ください。自己責任でおねがいします。)

【手順 : 利用しているテーマのfunctions.phpファイルを変更する】
テーマのディレクトリの下にあるfunctions.phpというファイルを編集します。
wp-includes/functions.phpではありませんのでご注意ください。
テーマの下なので、

wp-content/themes/<現在使用中のテーマディレクトリ>/functions.php

というファイルです。
このファイルの最後に以下のPHPコードを追加します。

function extended_enable_elements($init) {
$init['extended_valid_elements']="iframe[src|width|height|name|align|style|scrolling|marginwidth|marginheight|frameborder]";
return $init;
}
add_filter('tiny_mce_before_init', 'extended_enable_elements');

これでOKです。
実際、ビジュアルエディタではiframe部分が完全には表示されずスペースだけがとられているような表示になりますが、「プレビュー」を実行すると、ちゃんと表示されるようになりますので、筆者はこれで十分と思い使っています。
ビジュアルエディタでも完全に表示される方法が分かった方がいたら、フォローしていただけるとありがたいです。


大きな地図で見る

カテゴリー: WordPress
wordpressでiframeタグが使えない - 解決方法” への1件のコメント
  1. gurung より:

    なるほど、そんなことがあったのですね。どうりで貼れないわけです。
    デフォルトでこのiframeタグを自動的に消去してしまうとは知りませんでした。
    参考になりました。ありがとうございます。
    コードはあまり触りたくない(できない)ので、プラグインでできないか検討してみます。

    • tomiryu より:

      gurungさん

      プラグインの方が楽だし、安全ですし、その方が良いと思います。
      wordpressに組み込みのTinyMCEというエディタの機能なので、プラグインはないと思ってコードをいじったのですが、
      プラグインが見つかったら教えていただけるとうれしいです。

  2. gurung より:

    tomiryuさん

    私がその後使ってみたプラグインは2つです。

    Google Maps Anywhere
    http://wppluginsj.sourceforge.jp/googlemaps-anywhere/

    MapPress Easy Google Maps
    http://wordpress.org/extend/plugins/mappress-google-maps-for-wordpress/

    どちらも悪くなく、マップの挿入もスムーズにできるみたいですが、他に使いたい機能とかも考えると、結局LiveWriterというブログ投稿用ソフトを使うのが簡単だったので、しばらくはこれでやっていこうと思っています。

  3. Halley より:

    なるほど、そんなことがあったのですね。どうりで貼れないわけです。
    デフォルトでこのiframeタグを自動的に消去してしまうとは知りませんでした。
    参考になりました。ありがとうございます。
    コードはあまり触りたくない(できない)ので、プラグインでできないか検討してみます。

    +1

"wordpressでiframeタグが使えない - 解決方法" に 2 トラックバック・ピンバック
  1. […] 他にも書き方があるようなのでそちらも試してみます。 参考 : wordpressでiframeタグが使えない - 解決方法 […]

  2. […] 参考:wordpressでiframeタグが使えない - 解決方法 | トミリュウ・コム […]

Halley にコメントする コメントをキャンセル

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

*

次のHTML タグと属性が使えます: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <s> <strike> <strong>

カテゴリー