使用add_filter()

时间:2016-11-03 21:03:23

标签: php css wordpress

我正在尝试将视频添加到网站的主页。我创建了一个子主题,我使用add_filter()将内容过滤到主页。问题是视频正在显示,但之前没有显示其他内容。

如何才能显示视频和原始内容?

这是我添加到functions.php的代码;         

    add_filter('the_content', 'spd_video');

    function spd_video ($content){
if(is_front_page()){
 $content = '<div class="fullscreen-bg">
            <video loop muted autoplay poster="wp-content/uploads/2016/10/I_Waited_VA_Logo.png" class="fullscreen-bg__video">
            <source src="wp-content/uploads/2016/07/I_Watied_VA_Video_1_Long_01.webm" type="video/webm">
            <source src="wp-content/uploads/2016/07/I-Watied-VA-Video-1-Long.mp4" type="video/mp4">
            </video>
            </div>';
    }
    return $content;
    }

    ?>

CSS

    .fullscreen-bg {
position: relative;
top: 104px;
right: 0;
bottom: 0;
left: 0;
overflow: hidden;
z-index: -100;
    }

    .fullscreen-bg__video {
position: absolute;
top: 50%;
left: 50%;
width: auto;
height: auto;
min-width: 100%;
min-height: 100%;
-webkit-transform: translate(-50%, -50%);
   -moz-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    }

    @media (max-width: 767px) {
.fullscreen-bg {
    background: url('http://iwaitedva.com/wp-content/uploads/2016/10/I_Waited_VA_Logo.png') center center / cover no-repeat;
}

.fullscreen-bg__video {
    display: none;
}
    }

1 个答案:

答案 0 :(得分:0)

您正在完全替换视频内容,而不是将视频附加到内容中。我会这样做,取决于你想要放置视频的位置,在内容的顶部或底部。真的是$ video。$ content ..或$ content。$ video

add_filter('the_content', 'spd_video');

    function spd_video ($content){
if(is_front_page()){
 $video = '<div class="fullscreen-bg">
            <video loop muted autoplay poster="wp-content/uploads/2016/10/I_Waited_VA_Logo.png" class="fullscreen-bg__video">
            <source src="wp-content/uploads/2016/07/I_Watied_VA_Video_1_Long_01.webm" type="video/webm">
            <source src="wp-content/uploads/2016/07/I-Watied-VA-Video-1-Long.mp4" type="video/mp4">
            </video>
            </div>';

     $content = $video . $content;
    }
    return $content;
    }