web-dev-qa-db-ja.com

ページのおすすめ画像を表示する方法

ページの「おすすめ画像」のURLを取得したいのですが、そのページのおすすめ画像をページ上部のバナーの背景画像として使用したいのです。バナーの背景画像は、私がどのページにアクセスしているかによって変わります。

images
5
King Web Dev

このスレッドから _ WPフォーラムへ：

<?php if (has_post_thumbnail( $post->ID ) ): ?>
<?php $image = wp_get_attachment_image_src(get_post_thumbnail_id($post->ID), 'single-post-thumbnail'); ?>
<style>
  #banner-id {
    background-image: url('<?php echo $image[0]; ?>');
  }
</style>
<?php endif; ?>

the_post()の後に、これをあなたの単一ページのテンプレートに追加してください。ページにおすすめの画像がない場合はデフォルトのヘッダー画像を使用することをお勧めします。

'single-post-thumbnail'は代わりにarray(600, 30)のような理想的なヘッダ寸法を持つ配列にすることができます。

5
kittsville

ループの外側で画像を使用しているので、最初に投稿のIDを取得する必要があります。それからそれを使って注目の画像のURLを取得します。

function wpse207895_featured_image() {
    //Execute if singular
    if ( is_singular() ) {

        $id = get_queried_object_id ();

        // Check if the post/page has featured image
        if ( has_post_thumbnail( $id ) ) {

            // Change thumbnail size, but I guess full is what you'll need
            $image = wp_get_attachment_image_src( get_post_thumbnail_id( $id ), 'full' );

            $url = $image[0];

        } else {

            //Set a default image if Featured Image isn't set
            $url = '';

        }
    }

    return $url;
}

これで、これを使用して、注目の画像のURLのURLをエコーすることができます。

<?php echo wpse207895_featured_image();?>

例えば：

<header class="site-header" style="background-image: url('<?php echo wpse207895_featured_image();?>');">
    ....
    ....
</header>
2
Abhik