php - 插件内的 Wordpress 简码

Question

这是我正在编写的一个插件中的 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 中，而是希望它具有 background-image: url()。我在下面找到了这段代码

<?php
$background = get_field( 'background_image' );

if($background):
?>
<style>
.main-wrapper {
 background-image: url(<?php echo $background ?>);
}
</style>
<?php endif; ?>

我如何在 $content 中合并并运行这样的东西？我试图将图像作为 background-image:url() 获取的原因是我可以添加特定的 css 样式，如背景位置、大小、重复、附件。

Answer 1

为什么不直接在代码中添加图片作为背景图片呢？ [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] . '\' );">';