Dynamic Post Thumbnail →

时间:2016-11-01 作者:The WP Intermediate

我这里有一个HTML代码→

<!-- Page Header -->
    <!-- Set your background image for this header on the line below. -->
    <header class="intro-header" style="background-image: url(\'img/home-bg.jpg\')">
        <div class="container">
            <div class="row">
                <div class="col-lg-8 col-lg-offset-2 col-md-10 col-md-offset-1">
                    <div class="site-heading">
                        <h1> Clean Blog </h1>
                        <hr class="small">
                        <span class="subheading">A Clean Blog Theme by Start Bootstrap</span>
                    </div>
                </div>
            </div>
        </div>
    </header>
我试图将其动态转换为WP。

如何动态转换→

 <header class="intro-header" style="background-image: url(\'img/home-bg.jpg\')">
style="background-image: url(\'img/home-bg.jpg\') → 如何动态转换,使背景中的图像来自wordpress功能图像部分。

我试过了,但没用=

<header class="intro-header" style="<?php the_post_thumbnail(); ?>">

2 个回复
最合适的回答,由SO网友:Dave Romsey 整理而成

听起来你在找the_post_thumbnail_url():

<header class="intro-header" style="background-image: url(\'<?php the_post_thumbnail_url(); ?>\')">

SO网友:The Maniac

功能the_post_thumbnail 返回图像的整个HTML。您需要使用wp_get_post_thumbnail_idwp_get_attachment_image_src 组合以获取图像的url。

这里有一个我通常会用到的助手函数functions.php 当我构建一个主题以简化此过程时:

function mytheme_get_image_url( $size = \'full\' ) {
    $image_data = wp_get_attachment_image_src( get_post_thumbnail_id( get_the_ID() ), $size );
    return $image_data[0];
}
用法:

<header class="intro-header" style="background-image: url(\'<?php echo mytheme_get_image_url(); ?>\')">

相关推荐