如何使用自定义字段将 class 添加到 post？

Question

我正在尝试向 <div class="postthumbnail"> 添加另一个 class。我想设计一个 post 不同的风格。因此，经过研究，我发现最好的方法是使用自定义字段将 class 添加到 post.

本教程 How to style WP posts different，尤其是底部的这一部分，解释了如何使用自定义字段将 class 添加到 post。为此，我为自定义字段指定了名称 "en_proceso_class" 和值 "en_proceso"，即 css class。但是我对我需要添加的最后两个代码感到困惑。该教程不清楚我需要在哪里添加它们。

我的原码是：

        <?php
// set the "paged" parameter (use 'page' if the query is on a static front page)
$paged = ( get_query_var( 'paged' ) ) ? get_query_var( 'paged' ) : 1;

// the query
$the_query = new WP_Query( 'cat=9&posts_per_page=9&paged=' . $paged ); 
?>

<?php if ( $the_query->have_posts() ) : ?>

<?php
// the loop
while ( $the_query->have_posts() ) : $the_query->the_post(); 
?>

<div class="proyectpost">
            <article id="post-<?php the_ID(); ?>" <?php post_class(); ?>>

            <div class="innerpost">

             <div class="postthumbnail">
            <?php if ( has_post_thumbnail() ) { // check if the post has a Post Thumbnail assigned to it.
    $image_src = wp_get_attachment_image_src( get_post_thumbnail_id(),'full' );
     echo '<img src="' . $image_src[0]  . '" width="100%"  />';
    } ?>
            </div>
            <div class="posttitle">
        <h2><a href="<?php the_permalink(); ?>" rel="bookmark" title="Permanent Link to <?php the_title_attribute(); ?>"><?php the_title(); ?></a></h2>
        <span><?php echo get_post_meta($post->ID, 'location', true); ?></span>
            </div><!-- .entry-header -->

        <div class="postsubtitle">
        <div class="datepanel">

        </div>
        </div>

</div>
</article><!-- #post-## --> 

</div>


<?php endwhile; ?>

<div class="paginationbar">
<?php
$big = 999999999; // need an unlikely integer

echo paginate_links( array(
    'base' => str_replace( $big, '%#%', esc_url( get_pagenum_link( $big ) ) ),
    'format' => '?paged=%#%',
    'current' => max( 1, get_query_var('paged') ),
    'total' => $the_query->max_num_pages,
    'show_all'           => True,
    'prev_next'          => False
) );
?>
</div>

<?php 
// clean up after the query and pagination
wp_reset_postdata(); 
?>

<?php else:  ?>
<p><?php _e( 'Sorry, no posts matched your criteria.' ); ?></p>
<?php endif; ?>

这是我要将新代码添加到的代码部分：

<div class="innerpost">

            <?php $custom_values = get_post_meta($post->ID, 'en_proceso_class'); ?>

             <div class="postthumbnail <?php en_proceso_class('class-1 class-2 ' . $custom_variable); ?>">
            <?php if ( has_post_thumbnail() ) { // check if the post has a Post Thumbnail assigned to it.
    $image_src = wp_get_attachment_image_src( get_post_thumbnail_id(),'full' );
     echo '<img src="' . $image_src[0]  . '" width="100%"  />';
    } ?>
            </div>

我需要做什么才能让它正常工作？

Answer 1

最后一部分不是 100% 清楚，但我会尽力回答。

这段代码：

$custom_values = get_post_meta($post->ID, 'en_proceso_class');

获取 post 元字段名称的值：'en_proceso_class'。您实际上需要先设置它才能使其工作。您需要添加 'true' 作为该函数的另一个参数。有关详细信息，请参阅此处：https://developer.wordpress.org/reference/functions/get_post_meta/

然后是这个：

div class="postthumbnail <?php en_proceso_class('class-1 class-2 ' . $custom_variable); ?>">

它调用一个名为 'en_proceso_class' 的函数——我认为这不是您想要做的。除非您事先声明了该函数，否则您将执行以下操作：

div class="postthumbnail <?php echo 'class-1 class-2 ' . $custom_variable; ?>">

所以整个代码放在一起看起来像这样：

<div class="innerpost">
    <?php 
        // Get post meta that is already set
        $custom_values = get_post_meta($post->ID, 'en_proceso_class', true); 
    ?> 

     <div class="postthumbnail <?php echo 'class-1 class-2 ' . $custom_values; ?>">
        <?php 
            if ( has_post_thumbnail() ) { // check if the post has a Post Thumbnail assigned to it.
                $image_src = wp_get_attachment_image_src( get_post_thumbnail_id(),'full' );
                echo '<img src="' . $image_src[0]  . '" width="100%"  />';
            } 
        ?>
</div>

干杯

如何使用自定义字段将 class 添加到 post？

How to use custom field to add class to a post?

php

css

wordpress

custom-fields