我希望它是一个网格，而不是堆叠的帖子，因为大量的空白看起来很糟糕。我不熟悉定制，不知道如何进行这种特殊的更改。
我尝试从CSS中进行一些更改，但没有起到任何作用。
以下是呈现此特定视图的模板：
<?php if ( ! defined( \'ABSPATH\' ) ) exit;
if ( defined( \'DOING_AJAX\' ) && DOING_AJAX ) {
//Only for AJAX loading posts
if ( ! empty( $posts ) ) {
foreach ( $posts as $post ) {
UM()->shortcodes()->set_args = array( \'post\' => $post );
UM()->shortcodes()->load_template( \'profile/posts-single\' );
}
}
} else {
if ( ! empty( $posts ) ) { ?>
<div class="um-ajax-items">
<?php foreach ( $posts as $post ) {
UM()->shortcodes()->set_args = array( \'post\' => $post );
UM()->shortcodes()->load_template( \'profile/posts-single\' );
}
if ( $count_posts > 10 ) { ?>
<div class="um-load-items">
<a href="javascript:void(0);" class="um-ajax-paginate um-button" data-hook="um_load_posts"
data-author="<?php echo esc_attr( um_get_requested_user() ); ?>" data-page="1"
data-pages="<?php echo esc_attr( ceil( $count_posts / 10 ) ); ?>">
<?php _e( \'load more posts\', \'ultimate-member\' ); ?>
</a>
</div>
<?php } ?>
</div>
<?php } else { ?>
<div class="um-profile-note">
<span>
<?php if ( um_profile_id() == get_current_user_id() ) {
_e( \'You have not created any posts.\', \'ultimate-member\' );
} else {
_e( \'This user has not created any posts.\', \'ultimate-member\' );
} ?>
</span>
</div>
<?php }
}
最合适的回答,由SO网友:wharfdale 整理而成
以下是一些基本的CSS，它们可以帮助在桌面上创建网格并在移动设备上堆叠：
.um-profile-body.posts.posts-default {
max-width: 100%;
padding: 0 15px;
}
@media (min-width: 768px) {
.um-profile-body.posts.posts-default {
padding: 0;
}
}
.um-ajax-items {
display: grid;
grid-template-columns: 100fr;
grid-template-rows: auto;
margin-bottom: 15px;
grid-gap: 15px;
}
@media (min-width: 768px) {
.um-ajax-items {
grid-template-columns: 33.3fr 33.3fr 33.3fr;
grid-gap: 0px;
}
}
