将类别的动态属性添加到手风琴

时间:2020-04-14 作者:Long Way

我尝试在WordPress中使用循环为show article执行类别的手风琴动态,我使用静态HTML和JQuery执行此操作,但我无法理解如何添加类似属性的数据类=“并将其传递给项目

    <ul class="s3_accordion">
       <?php
    $categories = get_categories( array(
        \'orderby\'   => \'name\',
        \'order\'     => \'DESC\'
    ) );
    $cat_array = array();
    foreach( $categories as $category ) {
        $category_link = sprintf( 
            \'<li class="artical_options" data-class=".%2$s" alt="%2$s">%3$s</li>\',
            esc_url( get_category_link( $category->term_id ) ),
            esc_attr( sprintf( __( \'%s\', \'textdomain\' ), $category->slug ) ),
            esc_html( $category->slug )
        );
        echo sprintf( esc_html__( \'%s\', \'textdomain\' ), $category_link );
        $cat_array[] = $category->term_id;
    }
 ?>
</ul>
这里是手风琴的主体:

<div class="col-lg-4 s3_shuffle_image">
                <div class="card">
                    <?php the_post_thumbnail() ?>
                    <div class="card-body">
                        <h5 class="card-title"><a class="artical_options" href="<?php the_permalink(); ?>"> <?PHP the_title(); ?> </a></h5>
                        <p class="card-text"> <?php echo wp_trim_words(get_the_content(), 100); ?> </p>
                        <div class="s3_shuffle_date">
                            <p>4 week ago | <a class="artical_options" href="<?php the_author_link() ?>"><?php the_author_nickname() ?> <i class="far fa-comment"></i></a></p>
                        </div>
                    </div>
                </div>
            </div>
这里是JQuery代码:

$(\'.s3_accordion li\').on(\'click\', function () {
   $(this).addClass(\'s3_accordion_active\').siblings().removeClass(\'s3_accordion_active\');
        if($(this).data(\'class\') === \'.uncategorized\') {
            $(\'.s3_shuffle_image\').fadeIn();
        } else {
            $(\'.s3_shuffle_image\').fadeOut();
            $($(this).data(\'class\')).fadeIn();
        }
    });
我所有人都需要知道如何使用\\u category()函数或其他函数来添加attr并将其传递到s3\\u shuffle\\u image类旁边。

感谢Tony提供了出色的解决方案。

1 个回复
最合适的回答,由SO网友:Tony Djukic 整理而成

好的,你基本上就快到了,你所要做的就是在sprint().

Answer edited/added to:

<ul class="accordion">
<?php
    $categories = get_categories( array(
        \'orderby\'   => \'name\',
        \'order\'     => \'DESC\',
        \'offset\'    => 1
    ) );
    $cat_array = array();
    foreach( $categories as $category ) {
        $category_link = sprintf( 
            \'<li><a href="%1$s" data-class=".%2$s" alt="%2$s">%3$s</a></li>\',
            esc_url( get_category_link( $category->term_id ) ),
            esc_attr( sprintf( __( \'%s\', \'textdomain\' ), $category->slug ) ),
            esc_html( $category->slug )
        );
        echo sprintf( esc_html__( \'%s\', \'textdomain\' ), $category_link );
        $cat_array[] = $category->term_id;
    }
?>
</ul>

    <?php
    global $post;
    if( !empty( $cat_array ) ) :
        foreach( $cat_array as $cat ) :
            $category = get_term( $cat, \'category\' );
            $cat_slug = $category->slug;
            echo \'<div class="col-lg-4 s3_shuffle_image \' . $cat_slug . \'">\';
            $postslist = get_posts( array(
                \'posts_per_page\'    => 3,
                \'cat\'               => $cat,
            ) );
            if( $postslist ) :
                foreach( $postslist as $post ) :
                    setup_postdata( $post ); ?>
                    <h2><a href="<?php the_permalink(); ?>"><?php the_title(); ?></a></h2>
                    <?php the_excerpt(); ?>
                <?php
                endforeach; 
                wp_reset_postdata();
            endif;
            echo \'</div>\';
        endforeach;
    endif;
    ?>
所以在您返回<li> 格式化字符串(sprint()), 您只需添加data-class 属性并重复标记(%2$s) 返回第二项。

这一行也有一个错误,在引号外放置了一个句点,因此PHP尝试执行它,而不是将其作为字符串的一部分。

esc_attr( sprintf( __( \'%s\',. \'textdomain\' ), $category->slug )),

请注意,还应匹配泛型的所有实例textdomain 与实际textdomain 你的主题。。。如果你看看你的style.css 在顶部,您应该看到如下内容:

/*
Theme Name: The Name of the Theme
Theme URI: http://domain.com
Author: your name or some other developer\'s name
Author URI: http://domain.com
Description: A description for the theme.
Version: 1.0 (updated version number)
License: GNU General Public License v2 or later
License URI: LICENSE
Text Domain: make a custom text domain if there isn\'t one
Tags: custom-background, custom-logo, custom-menu, featured-images, translation-ready
*/
如果Text Domain: 如果有,请确保在编写其他函数时使用它,如果没有,请添加它并使其具有独特性。在所有这些行中填写一些独特且准确的主题,保持版本号更新,等等。

为了解释编辑/添加,我们所做的是,在对返回的所有类别运行for each时,我们将它们添加到在for each之前创建的数组中:$cat_array = array();. 中的最后一项foreach() 现在,将每个类别的ID广告到阵列:$cat_array[] = $category->term_id;

然后,在s3_shuffle_image div,我们运行foreach() 在我们刚刚创建的阵列上。在该foreach中,我们运行一个“get\\u posts()”函数,该函数根据ID调用每个类别的3篇最新帖子。

那么,如果get_posts() query返回任何结果,我们运行另一个foreach并从accordion div内返回的每个帖子中吐出内容/数据。

There are two issues I see. $cat_array is an array of IDs, not objects, so the ‘cat’ query arg should just be \'cat\' => $cat, The other is when you use setup_postdata( $post ), you must explicitly declare global $post;

相关推荐

Regarding Tags And Categories

我想为我的网站使用一个新主题,但问题是,在我当前的主题中,它有特殊的标记,例如“abc标记”,而在我的新主题中,它没有。因此,如果我更改主题,所有帖子都会消失(404错误)。我的问题是,是否可以创建一个具有不同名称的新SPESIFI标记(在本例中为abc标记)?或者,即使我的新主题没有abc标记,也可以将旧的abc标记迁移到新的abc标记吗?我尝试过使用elementor,但仍然没有成功,任何帮助都将非常。。非常非常非常感谢!谢谢大家^_^