Question

我正在设置Wordpress页面，我正在尝试自定义buddypress组的外观。我希望它们水平而不是垂直显示。谁能引导我通过？

<div class="container-fluid">
    <div class="row">
    <div class="groups-list" class="item-list" role="main"></div>

            <?php while ( bp_groups() ) : bp_the_group(); ?>

            <?php bp_group_class(); ?>
        <div class="item-avatar">
            <a href="<?php bp_group_permalink(); ?>"><?php bp_group_avatar( 'type=thumb&width=50&height=50' ); ?></a>
        </div>

        <div class="item">
            <div class="item-title"><a href="<?php bp_group_permalink(); ?>"><?php bp_group_name(); ?></a></div>
            <div class="item-meta"><span class="activity"><?php printf( __( 'active %s', 'buddypress' ), bp_get_group_last_active() ); ?></span></div>

            <div class="item-desc"><?php bp_group_description_excerpt(); ?></div>

            <?php do_action( 'bp_directory_groups_item' ); ?>

        </div>
        </div>
        </div>

Answer 1

您是否尝试将循环结果包装在div中并浮动它？我想用css你会没事的，只要你清除后的花车。像这样：

<div class="group-container">
<?php while ( bp_groups() ) : bp_the_group(); ?>

<?php bp_group_class(); ?>
    <div class="float-left">
    <div class="item-avatar">
        <a href="<?php bp_group_permalink(); ?>"><?php bp_group_avatar( 'type=thumb&width=50&height=50' ); ?></a>
    </div>
    <div class="item">
        <div class="item-title"><a href="<?php bp_group_permalink(); ?>"><?php bp_group_name(); ?></a></div>
        <div class="item-meta"><span class="activity"><?php printf( __( 'active %s', 'buddypress' ), bp_get_group_last_active() ); ?></span></div>
        <div class="item-desc"><?php bp_group_description_excerpt(); ?></div>

        <?php do_action( 'bp_directory_groups_item' ); ?>

    </div>
<?php endwhile; ?>
    <div class="clear-floats"></div>
</div>

如果要添加bootstrap类，则必须在循环外添加行类（通过组），然后在循环内为每个组添加col类。但我认为你必须将所有这些包装在一个容器中。

Answer 2

// Fetch another API
return fetch('https://myremoteserveraddress', {
 method: 'POST',
 headers: {
   'Content-Type': 'application/json'
 },
 body: JSON.stringify(secondary),
})

如何自定义buddypress组

2 个答案: