合并图块 PHP(Wordpress 主题:Planar - lite)

Merging Tiles PHP (Wordpress Theme: Planar - lite)

抱歉,如果这是一个新手问题,我将不胜感激。我正在自定义一个 wordpress 主题,我觉得我必须合并 PHP 函数才能获得我正在寻找的结果。

主题是响应式的,将 post 分成多个图块。但是,图块被分解为图像,然后是 post 内容。我在想我需要合并图块,所以缩略图是 post 图块的背景。这可能吗?

图像平铺功能

<figure class="tile" style="background: <?php echo esc_attr( get_theme_mod( 'planar_additional_color', '#398ece' ) ); ?><?php $thumbnail = wp_get_attachment_image_src( get_post_thumbnail_id(), 'planar-quadratum' );  if( !empty($thumbnail) ) { ?> url(<?php echo $thumbnail[0]; ?>) no-repeat; background-size: cover; background-position:50%<?php } ?>;">

        <img src="<?php echo get_template_directory_uri(); ?>/img/blank.png" alt="" width="800" height="800" /> 

    </figure>

Post函数

<article id="post-<?php the_ID(); ?>" <?php post_class('tile post'); ?>>

        <img src="<?php echo get_template_directory_uri(); ?>/img/blank.png" alt="" width="800" height="800" />

<a href="<?php the_permalink(); ?>" title="<?php the_title_attribute(); ?>" class="tile-content<?php if ( !has_post_thumbnail())  : ?> no-thumbnail<?php endif; ?>" rel="bookmark">

    <div class="entry-meta">
        <?php
            $category = get_the_category(); 
            echo '<h3>' . $category[0]->cat_name . '</h3>';

            if ( has_post_format() ) :
                echo get_post_format_string( get_post_format() );
            endif; 
        ?>

    <span><time datetime="<?php the_time('Y-m-d'); ?>"><?php the_date('j F Y', '<br />', '<br />'); ?></time></span>

    </div><!-- .entry-meta -->

    <h1 class="entry-title"><?php the_title(); ?></h1>

</a><!-- .tile-content -->

</article>

非常感谢任何帮助,谢谢。

编辑

感谢您的帮助,知道将新背景属性放在哪里非常有帮助。这是功能代码:

<article id="post-<?php the_ID(); ?>" <?php post_class('tile post'); ?> style="background: <?php echo esc_attr( get_theme_mod( 'planar_additional_color', '#398ece' ) ); ?><?php $thumbnail = wp_get_attachment_image_src( get_post_thumbnail_id(), 'planar-quadratum' );  if( !empty($thumbnail) ) { ?> url(<?php echo $thumbnail[0]; ?>) no-repeat; background-size: cover; background-position:50%<?php } ?>;">

再次感谢。

style="background-image:url('<?php echo $thumbnail ?>" 添加到您想要背景图片的任何元素。

假设文章标签:

//to get the URL 
<?php $thumbnail = wp_get_attachment_image_src( get_post_thumbnail_id(), 'planar-quadratum' ); ?>

//display
<article id="post-<?php the_ID(); ?>" <?php post_class('tile post'); ?> style="background-image:url('<?php echo $thumbnail)">
  //code...
</article