最新消息:雨落星辰是一个专注网站SEO优化、网站SEO诊断、搜索引擎研究、网络营销推广、网站策划运营及站长类的自媒体原创博客

php - How to stop featured image thumbnail [set as background image] on blog index page just repeating same image across all pos

programmeradmin3浏览0评论

How to stop featured image thumbnail [set as background image] on blog index page just repeating same image across all posts:

i have this code here:

add_action( 'wp_head', 'set_featured_background', 99);
function set_featured_background() {
    if ( has_post_thumbnail() ) { 
        $featured_img_url = get_the_post_thumbnail_url(get_the_ID(),'full');
        ?>
        <style>
        .has-post-thumbnail {
            background-image: url('<?php echo $featured_img_url ?>');
            background-size: 100% 100%; 
        }
        </style>
        <?php
    }
}

And ive tried a few different variations but it always jsut finds the most recent posts image and uses that across all posts. Do i need to be trying to put in a check to make sure it does the same thing every unique post. For example: If this post has a unique ID find its thumbnail image and apply as a style. Or is it because im trying to add it to the css class has-post-thumbnail which is applied to all posts? [that have a thumbnail]

How to stop featured image thumbnail [set as background image] on blog index page just repeating same image across all posts:

i have this code here:

add_action( 'wp_head', 'set_featured_background', 99);
function set_featured_background() {
    if ( has_post_thumbnail() ) { 
        $featured_img_url = get_the_post_thumbnail_url(get_the_ID(),'full');
        ?>
        <style>
        .has-post-thumbnail {
            background-image: url('<?php echo $featured_img_url ?>');
            background-size: 100% 100%; 
        }
        </style>
        <?php
    }
}

And ive tried a few different variations but it always jsut finds the most recent posts image and uses that across all posts. Do i need to be trying to put in a check to make sure it does the same thing every unique post. For example: If this post has a unique ID find its thumbnail image and apply as a style. Or is it because im trying to add it to the css class has-post-thumbnail which is applied to all posts? [that have a thumbnail]

Share Improve this question asked Aug 20, 2018 at 10:06 MooseMoose 1111 bronze badge
Add a comment  | 

2 Answers 2

Reset to default 1

Or is it because im trying to add it to the css class .has-post-thumbnail which is applied to all posts?

Yes, set_featured_background() gets first post from the loop and add .has-post-thumbnail to styles. All posts that have thumbnail (with class .has-post-thumbnail) will have the same background.

Try setting the background in the template file responsible for displaying posts on the home page, probably in content.php or front-page.php.

<?php
    $attr_style= '';
    if ( is_home() && has_post_thumbnail() ) {
        $url = wp_get_attachment_url( get_post_thumbnail_id($post->ID) );
        $attr_style = ' style="background: url('. $url.'); background-size: 100% 100%;" ';
    }
?>
<article id="post-<?php the_ID(); ?>" <?php post_class(); echo $attr_style; ?>>

I would try to use the ID of the post (which should be part of the id or class of the article-tag) as additional selector for the style:

<style>
    #post-<?php the_ID();?>.has-post-thumbnail {
        background-image: url('<?php echo $featured_img_url ?>');
        background-size: 100% 100%; 
    }
</style>
    

与本文相关的文章

发布评论

评论列表(0)

  1. 暂无评论