这是我正在编写的一个插件中shortcodes.php文件的一个片段。
if($home_loop->have_posts()) {
switch($display) {
case "static":
while ($home_loop->have_posts()): $home_loop->the_post();
if(has_post_thumbnail() ) {
$content .= '<div class="parallax">';
$content .= get_the_post_thumbnail($post->ID, 'wrapper-wide', array('class' => "img-responsive"));
$content .= '</div>';
$content .= '<div class="container">';
$content .= get_the_content();
$content .= '</div>';
$content .= '<style>';
$content .= '.parallax{//css style here}';
$content .= '</style>;
} else {
//Something
}
endwhile;
break;
这很完美。如果我把一个特色图像缩略图放在我的主页帖子中,它将显示在我的视差div中。我的问题是,我不想把缩略图放在div中,而是想把它作为背景图像:url()。我在下面发现了这个代码
<?php
$background = get_field( 'background_image' );
if($background):
?>
<style>
.main-wrapper {
background-image: url(<?php echo $background ?>);
}
</style>
<?php endif; ?>
我该如何在$content中合并和运行这样的内容?我尝试将图像作为背景图像的原因是:url(),这样我就可以添加特定的css样式,如背景位置、大小、重复、附件。
为什么不直接在代码中添加图像作为背景图像呢?[wp_get_attachment_image_src][1]将返回任何附件的url、宽度和高度的数组。将特色图像的ID传递给它,并获得使用所需任何大小的灵活性,而不仅仅是实际的特色图像大小。然后使用内联CSS将其作为背景。如果需要,可以在CSS表中覆盖它。
($home_loop->have_posts()) {
switch($display) {
case "static":
while ($home_loop->have_posts()): $home_loop->the_post();
if(has_post_thumbnail() ) {
$post_thumnail_info = wp_get_attachment_image_src( get_post_thumbnail_id( $post->ID ), 'wrapper-wide' );
$content .= '<div class="parallax" style="background-image: url( ''' . $post_thumbnail_info[0] . ''' );">';