WordPress WYSIWYGがiframeを削除しないようにする

16

さまざまな理由でiframeを投稿に挿入する必要のあるブログがあります（なぜ私を信頼するのかを聞かないでください！）

「ビジュアル」ビューを使用して投稿を編集すると、WYSIWYGはiframeを継続的に削除します...

私は、しかし、私は思います...私は、「HTML」ビューを使用してのみ、「HTML」ビューから保存/表示する場合、私はポストに、アイフレームを保つことができます知って本当に編集私のポストに、通常のWYSIWYGを使用できるようにしたいです「html」ビューに頼る必要はありません。

この動作を無効にするためにできることはありますか？私はこの投稿を見ましたが、これは編集を示唆wp-includes/js/tinymce/tiny_mce_config.phpしていますが、アップグレードで壊れる可能性が高いようなことは本当に避けたいです！

wysiwyg iframe

— ジャスティン・ジェンキンス
ソース

リンクした投稿には、Ottoによる非編集フィルターソリューションもあります。やってみた？

— ラースト

もう少し明確にするために、それを行うためにPHPをハックする必要はありません（おそらく忘れて、アップグレードして、壊れます）...それが設定のものであれば（それがPHPであっても）またはたとえば、iframeの周りに少しのコードをラップして、うまくいくこともできます。この時点で、JavaScriptを使用してそれを実行する可能性がありますが、それは面倒です。

— ジャスティンジェンキンス

1

これには構成オプションはなく、エディターでそれをコード化する方法もありません（回避策が存在する場合、セキュリティホールになります）。上記のコードをプラグインに入れるのがこれを行う最良の方法であり、アップグレード後も存続します（アップグレード時にプラグインは削除されません）。

— ヤンファブリー

@Jan、私たちが知らない何かを知っている誰かがいることを願って...そうでない場合は、ありがとう。HTMLではなく、視覚的な部分にのみ存在するセカンドホールであると奇妙に思えますか？視覚モードでは、人の鼻の下に物を滑り込ませる方が簡単だと思います...しかし、それでも。

— ジャスティンジェンキンス

iframesビデオを埋め込むのに便利です。この<object>方法はフラッシュに依存してい<iframe>ますが、最近ではほとんどのビデオ共有サイトでサポートされている方法では、HTML5ビデオを使用できます。

— -TRiG

9

独自のコードを書きたくない場合は、埋め込みを許可するプラグインがあります<iframe>：

WordPress用のIFrameプラグインを埋め込む

次に、次のようなショートコードを使用します。

[iframe http://example.com 400 500]

— イーサン・サイフェルト
ソース

@Ethan Seifert-いい答えです！

— MikeSchinkel

これは本当に私の質問に当てはまり、「ハッキング」は必要ありません。HTMLビューを使用する必要がありますが...ありがとう。

— ジャスティンジェンキンス

この回答のプラグインは最新ではありませんが、代わりにこれは見栄えが良いです：wordpress.org/plugins/iframe

— Tim Malone

23

TinyMCEのフィルターをカスタマイズできます。TinyMCE <iframe>内でGoogleマップを使用するsおよびその他のタグについては、次の例を参照してください。

function fb_change_mce_options( $initArray ) {

    // Comma separated string od extendes tags.
    // Command separated string of extended elements.
    $ext = 'pre[id|name|class|style],iframe[align|longdesc|name|width|height|frameborder|scrolling|marginheight|marginwidth|src]';

    if ( isset( $initArray['extended_valid_elements'] ) ) {
        $ext = ',' . $ext;
    }
    $initArray['extended_valid_elements'] = $ext;

    // Maybe, set tiny parameter verify_html
    //$initArray['verify_html'] = false;

    return $initArray;
}
add_filter( 'tiny_mce_before_init', 'fb_change_mce_options' );

これをテーマのカスタムプラグインまたはfunctions.phpに追加します。また、あなたは私の投稿で詳細を読むことができます：http : //wpengineer.com/1963/customize-wordpress-wysiwyg-editor/

— ブエルトゲ
ソース

@bueltge-いい答えです。私はあなたのサイトで、今日のその前の記事を読んでいました。ご存知のように、TinyMCEのWeb上のほとんどの例はWordPressのコンテキストではなく、WordPressのコンテキストではかなり複雑です。よく理解できます。TinyMCEについて説明できることは他にもたくさんあります。一連のブログ投稿を検討しましたか？

— MikeSchinkel

私の最大の問題は時間です。しかし、私は私のドラフトでこのトピックに関する別の投稿を用意しており、多分私はこれを次の週に投稿します。敬意を表します。

— bueltge

1

私はwordpress 3.2.1にアップグレードし、Embed Iframeをインストールする必要がありました。

WordPressでHTMLからVisualに切り替えたときにiframeタグが削除されなくなりました。

— WordpressDude
ソース

1

マルチサイト環境では、superadmin以外のすべてのユーザーがHTMLフィルタリングを取得します（潜在的なセキュリティの脆弱性のため）。基づき、この、あなたは編集者にunfiltered_html機能を追加することができます。

/**
 * Enable unfiltered_html capability for Editors.
 *
 * @param  array  $caps    The user's capabilities.
 * @param  string $cap     Capability name.
 * @param  int    $user_id The user ID.
 * @return array  $caps    The user's capabilities, with 'unfiltered_html' potentially added.
 */
function km_add_unfiltered_html_capability_to_editors( $caps, $cap, $user_id ) {
    if ( 'unfiltered_html' === $cap && user_can( $user_id, 'editor' ) ) {
        $caps = array( 'unfiltered_html' );
    }
    return $caps;
}
add_filter( 'map_meta_cap', 'km_add_unfiltered_html_capability_to_editors', 1, 3 );

— ドッカー
ソース

0

ショートコードソリューションに追加のプラグインを使用したくない場合は、これらの行に沿って何かをテーマ、プラグイン、またはfunctions.phpに追加して、手動で追加できます。必要な場合は、キー配列にさらにキーを追加する必要があります。

add_shortcode( 'iframe' , 'mycustom_shortcode_iframe' );
function mycustom_shortcode_iframe($args, $content) {
    $keys = array("src", "width", "height", "scrolling", "marginwidth", "marginheight", "frameborder");
    $arguments = mycustom_extract_shortcode_arguments($args, $keys);
    return '<iframe ' . $arguments . '></iframe>';
}

function mycustom_extract_shortcode_arguments($args, $keys) {
    $result = "";
    foreach ($keys as $key) {
        if (isset($args[$key])) {
            $result .= $key . '="' . $args[$key] . '" ';
        }
    }
    return $result;
}

次に、投稿ページでの使用方法は次のようになります。

[iframe width="425" height="350" frameborder="0" scrolling="no" marginheight="0" marginwidth="0" src="https://maps.google.de/maps?f=q&amp;source=s_q&amp;hl=de&amp;geocode=&amp;q=New+York+City,+New+York,+USA&amp;aq=0&amp;oq=new+york&amp;sll=51.238455,6.81435&amp;sspn=0.373151,1.056747&amp;ie=UTF8&amp;hq=&amp;hnear=New+York+City,+New+York,+Vereinigte+Staaten&amp;t=m&amp;z=11&amp;iwloc=A&amp;output=embed"]

— サニーレッド
ソース

動いていない。そのちょうど同じ内容としてはiframeを掲示

— Ankit Agrawalさん

私はあなたがコードに何をしたいのかわかりませんが、あなたが書いたとおりにコンテンツにiframeを投稿することが、コードが何をすべきかです。したがって、iframeがフロントエンドビューに表示される場合、すべてが期待どおりに機能します。

— SunnyRed

0

Fusion Editorプラグインを使用してWordpressでページを作成すると、うまく機能することがわかりました。

このビデオは、Fusion Builderの使用方法を示しています（コンテナー、列、要素、コードブロックの追加については4:15までスキップしてください）：https : //www.youtube.com/watch?v= UDyNsnB_COA

クリックしてコンテナを追加し、次に要素の追加をクリックして、テキストブロックの代わりにコードブロックを追加します（テキストブロックはiframeを削除しますが、コードブロックは削除しません）。コードブロックにiframeコードを貼り付けて公開します。うまく機能し、PHPファイルを変更する必要はありません！

— ブランドンバーニー
ソース