web-dev-qa-db-ja.com

ワードプレスのビデオにpreg_replaceを使用する方法？

私は私のアンプページのために私のワードプレスブログのビデオをフォーマットしようとしています。コンテンツエディタで使用しているコードは次のとおりです。

[video width="768" height="576" mp4="https://mywebsite.com/wp-content/uploads/20**/0*/video-name.mp4"][/video]

このビデオをAMPのページに次の形式で表示します。

<amp-video controls
width="640"
height="360"
layout="responsive">
  <source src="https://mywebsite.com/wp-content/uploads/20**/0*/video-name.mp4" />
</amp-video>

以下の機能を試してみましたが、うまくいきませんでした。

試してみる1： 

function am_video_amp_format($content){
            global $post;
            $pattern ="~<video(.*?)></video>~i";
            $replacement = '<amp-video controls
                              width="640"
                              height="360"
                              layout="responsive">
                              <source src="$2" />
                            </amp-video>';
            $content = preg_replace($pattern, $replacement, $content);
            return $content;
        }
        add_filter('the_content', 'am_video_amp_format');

試して2： 

function am_video_amp_format($content){
            global $post;
            $pattern ="~<iframe(.*?)>(.*?)<video(.*?)src=\"(.*?)\">(.*?)</video>(.*?)</iframe>~i";
            $replacement = '<amp-video controls
                              width="640"
                              height="360"
                              layout="responsive">
                              <source src="$4" />
                            </amp-video>';
            $content = preg_replace($pattern, $replacement, $content);
            return $content;
        }
        add_filter('the_content', 'am_video_amp_format');

試して3： 

function am_video_amp_format($content){
            global $post;
            $pattern ="~<video(.*?)><source(.*?)src=\"(.*?)\"(.*?)></video>~i";
            $replacement = '<amp-video controls
                              width="640"
                              height="360"
                              layout="responsive">
                              <source src="$2" />
                            </amp-video>';
            $content = preg_replace($pattern, $replacement, $content);
            return $content;
        }
        add_filter('the_content', 'am_video_amp_format');

高さと幅も取得できますか。

ありがとうございました！

plugin-developmentfunctionsvideos
2
Ramesh Pardhi

それで、あなたはエディタでデフォルトのWordPressビデオショートコードを使っていますね。そうであれば、コンテンツ全体をフィルタリングする必要はありません。特に、ビデオのマークアップは既にレンダリングされているため、非常に複雑です。

<div style="width: 960px;" class="wp-video"><!--[if lt IE 9]> 
     <script>document.createElement('video');</script><![endif]-->
     <video class="wp-video-shortcode" id="video-160186-1" width="960" height="600" preload="metadata" controls="controls">
        <source type="video/mp4" src="YOUR_VIDEO_URL" />
        <a href="YOUR_VIDEO_URL">YOUR_VIDEO_URL</a>
     </video>
</div>

そのため、過度に複雑な正規表現で苦労する代わりに、wp_video_shortcodeフィルタを使用することができます。それからそれは簡単になります：

function change_video_markup_to_amp( $output, $atts, $video, $post_id, $library ) {

    /* 
    change output only on 'post' post type, you might wanna get 
    rid of this if you want to change video markup everywhere 
    on your site
    */
    if ( ! 'post' === get_post_type( $post_id ) ) {
        return $output;
    }

    /* 
    get video data, you can also check other $atts array 
    keys for different video formats, by default you'll find:
    'mp4', 'm4v', 'webm', 'ogv', 'flv'.
    */
    $video_url = ! empty( $atts['mp4'] ) ? $atts['mp4'] : '';
    $height    = ! empty( $atts['height'] ) ? $atts['height'] : '';
    $width     = ! empty( $atts['width'] ) ? $atts['width'] : '';

    // return default shortcode output if no video url is found
    if ( empty( $video_url ) ) {
        return $output;
    }

    // now put the amp markup together
    $amp_output = sprintf( '<amp-video controls width="%1$d" height="%2$d" layout="responsive"><source src="%3$s" /></amp-video>', absint( $width ), absint( $height ), esc_url( $video_url ) );

    return $amp_output;
}

add_filter( 'wp_video_shortcode', 'change_video_markup_to_amp', 10, 5 );
1
Levi Dulstein