WordPress循环中每个post的ACF背景色

Question

在WordPress中有以下循环：

     'post',
        'category_name' => 'angebote',
        'order' => 'ASC',
        'posts_per_page' => -1
    );


    $wp_query = new WP_Query($news);
    if (have_posts()) : while (have_posts()) :
        the_post(); ?>

        
            
                
                    
                    
                    
                        
                            MEHR
                        
                    
                
            
        
        
            .card-container .main-content:hover {
                background: <?php echo get_field('background-farbe' ); ?>;
                background-blend-mode: multiply;
            }

可以看到，我有以下CSS，它所做的是添加一个颜色分配给每个帖子与ACF。

        .card-container .main-content:hover {
            background: <?php the_field('background-farbe' ); ?>;
            background-blend-mode: multiply;
        }

问题是我只得到了第一篇文章的颜色。有人能帮我解决这个问题吗?为什么我看不见？

Answer 1

你的问题在于你的CSS代码。

    .card-container .main-content:hover {
        background: ;
        background-blend-mode: multiply;
    }

它只使用类，因此它将应用于该类中的每个元素。将相同的代码与不同的颜色相乘不会改变任何事情--只有一个这样的规则是有效的。

那么如何解决这个问题呢？

您必须为您的帖子分配唯一标识符：

     'post',
            'category_name' => 'angebote',
            'order' => 'ASC',
            'posts_per_page' => -1
        );

        $wp_query = new WP_Query($news);
        while (have_posts()) :
            the_post();
    ?>
    
        
            
                
                
                
                    
                        MEHR
                    
                
            
        
    
    
        #card-<?php echo esc_attr( get_the_ID() ); ?> .main-content:hover {
            background: <?php echo get_field('background-farbe' ); ?>;
            background-blend-mode: multiply;
        }

PS。您不需要在循环中使用任何if语句，因为您不需要在循环之外执行任何操作;)