私はiFrameを埋め込もうとしていますが、レスポンシブデザインを使用してCSSを設定しているので、width=""
およびheight=""
属性をまったく使用しないことを望みます。
これをHTMLエディタのフィールドに入力すると..
<iframe src="https://docs.google.com/document/pub?id=1fsm-cvpdfX-8tXauGrQgRmgWONTpX8J3almvZhzBeCA&embedded=true" class="scale-with-grid"></iframe>
それから私はビジュアルモードに切り替えて戻ってきます、それはすぐにclass="scale-with-grid"
を削除して、それをwidth="320" height="240"
に変更します
<iframe src="https://docs.google.com/document/pub?id=1fsm-cvpdfX-8tXauGrQgRmgWONTpX8J3almvZhzBeCA&embedded=true" width="320" height="240"></iframe>
どうすればこれを避けることができますか?私はこの「生のHTML」プラグインを使いましたが、このiframeの状況にはまったく当てはまりませんでした。
デフォルトではiframeタグはエディタでは使用できないタグです。このHTMLタグを許可するようにフィルタを変更する必要があります。フォローソースをプラグインにコピーし、エディタTinyMCE用のiframeを許可します。
add_filter( 'tiny_mce_before_init', 'fb_change_mce_options' );
function fb_change_mce_options( $tags ) {
// Comma separated string od extendes tags
// Command separated string of extended elements
$ext = 'iframe[align|longdesc|name|width|height|frameborder|scrolling|marginheight|marginwidth|src|id|class|title|style]';
if ( isset( $tags['extended_valid_elements'] ) )
$tags['extended_valid_elements'] .= ',' . $ext;
else
$tags['extended_valid_elements'] = $ext;
return $tags;
}
あなたはiframe-shortcodeを利用することができます。これを可能にする小さなプラグインがあります。
<?php
! defined( 'ABSPATH' ) AND exit;
/** Plugin Name: (#62729) Shortcode to display an iframe */
function wpse62729_allow_iframes_tinymce( $attr )
{
global $post;
$attr = shortcode_atts( array(
'src' => ''
,'width' => '100%'
,'height' => '100%'
,'name' => md5( $post->post_title )
,'scrolling' => 'no'
,'marginheight' => 0
,'marginwidth' => 0
,'frameborder' => 0
,'align' => is_rtl() ? 'right' : 'left'
), $attr );
$html = "<iframe";
foreach ( $attr as $key => $val )
{
$html .= " {$key}='{$val}'";
}
$html .= "><p>";
// Message if not possible to display iframe
$html .= sprinft(
'Displaying the iframe is not possible. View the %ssource following this link%s.'
,"<a href='{$attr['src']}' target='_blank'>"
,"</a>"
);
$html .= "</p></iframe>";
return $html;
}
add_shortcode( 'iframe', 'wpse62729_allow_iframes_tinymce' );