WordPress video标签是插入视频时,自动加载了播放器而生成的标签,这个标签会根据 content_width
设置的宽度而生成视频宽度。
content_width
并不友好,设置宽度后,如果太小,那么桌面访问视频也是设置的宽度,当然太小。反之设置太大的话,移动端就太小了。
/** * Set the content width in pixels, based on the theme's design and stylesheet. * * Priority 0 to make it available to lower priority callbacks. * * @global int $content_width */ function info_content_width() { // This variable is intended to be overruled from themes. // Open WPCS issue: {@link https://github.com/WordPress-Coding-Standards/WordPress-Coding-Standards/issues/1043}. // phpcs:ignore WordPress.NamingConventions.PrefixAllGlobals.NonPrefixedVariableFound if( wp_is_mobile() ) { $GLOBALS['content_width'] = apply_filters( 'info_content_width', 280 ); } else { $GLOBALS['content_width'] = apply_filters( 'info_content_width', 640 ); } } add_action( 'after_setup_theme', 'info_content_width', 0 );
上诉方案是用了移动端 280px
宽度,其他终端显示 640px
宽度。同时,我们还需要把视频进行居中放置,需要增加css:
.wp-video{ margin-left: auto; margin-right: auto; }