我正在尝试将视频添加到网站的主页。我创建了一个子主题,我使用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;
}
}
答案 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;
}