WordPress ACF中继器在表中的分页

Question

我在显示分页栏时有麻烦。目前，分页栏显示在表的左侧顶部。我需要它显示后表显示对齐居中。我认为我需要在显示分页栏之前逃避循环，但我不确定如何去做。

<table id="mytable" class="table table-bordred table-striped">
<tbody>
<?php
/*
* Paginate Advanced Custom Field repeater
*/
if ( get_query_var( 'page' ) ) {
$page = get_query_var( 'page' );
} else {
$page = 1;
}
// Variables
$row           = 0;
$jobs_per_page = 12; // How many jobs to display on each page
$jobs          = get_field( 'job_list' );
$total         = count( $jobs );
$pages         = ceil( $total / $jobs_per_page );
$min           = ( ( $page * $jobs_per_page ) - $jobs_per_page ) + 1;
$max           = ( $min + $jobs_per_page ) - 1;
// ACF Loop
if ( have_rows( 'job_list' ) ) :
?>
<?php
while ( have_rows( 'job_list' ) ) :
the_row();
$row++;
// set repeater variables
$image         = get_sub_field( 'image' );
$job_title     = get_sub_field( 'job_title' );
$company_name  = get_sub_field( 'company_name' );
$location      = get_sub_field( 'location' );
$job_time      = get_sub_field( 'job_time' );
$job_date      = get_sub_field( 'job_date' );
$cta_link_text = get_sub_field( 'cta_link_text' );
$cta_link      = get_sub_field( 'cta_link' );
// Ignore this job if $row is lower than $min
if ( $row < $min ) {
continue; }
// Stop loop completely if $row is higher than $max
if ( $row > $max ) {
break; }
?>

<tr>
<td style="padding-top:20px; padding-bottom:20px;"><img src="<?php echo $image; ?>" /></td>
<td style="padding-top:16px;"><strong><?php echo $job_title; ?></strong><br><span style="font-size:11px;"><?php echo $company_name; ?></span></td>
<td style="padding-top:16px;"><strong><?php echo $location; ?></strong><br><span style="font-size:11px;"><?php echo $job_time; ?></span></td>
<td style="padding-top:24px;"><strong><?php echo $job_date; ?></strong></td>
<td style="padding-top:20px;" align="center"><button onclick="location.href='<?php echo $cta_link; ?>'" style="background-color:#ea9732; border-color:#ea9732;" class="btn btn-primary btn-md" data-title="Edit" data-toggle="modal" data-target="#edit" ><strong><?php echo $cta_link_text; ?></strong></button></td>
</tr>

<?php
endwhile;
// Pagination
echo paginate_links(
array(
'base'    => get_permalink() . '%#%' . '/',
'format'  => '?page=%#%',
'current' => $page,
'total'   => $pages,
)
);
?>
<?php else : ?>
No jobs found
<?php endif; ?>

</tbody>
</table>

Answer 1

您应该将分页移到表外，并可能重新排列您的if,else和while语句。

<?php
$page = get_query_var('page') ?: 1;
// Variables
$row           = 0;
$jobs_per_page = 12; // How many jobs to display on each page
$jobs          = get_field('job_list');
$total         = count($jobs);
$pages         = ceil($total / $jobs_per_page);
$min           = (($page * $jobs_per_page) - $jobs_per_page) + 1;
$max           = ($min + $jobs_per_page) - 1;
// ACF Loop
if (have_rows('job_list')) :
?>
<table id="mytable" class="table table-bordred table-striped">
<tbody>   
<?php
while (have_rows('job_list')) :
the_row();
$row++;
// set repeater variables
$image         = get_sub_field('image');
$job_title     = get_sub_field('job_title');
$company_name  = get_sub_field('company_name');
$location      = get_sub_field('location');
$job_time      = get_sub_field('job_time');
$job_date      = get_sub_field('job_date');
$cta_link_text = get_sub_field('cta_link_text');
$cta_link      = get_sub_field('cta_link');
// Ignore this job if $row is lower than $min
if ($row < $min) {
continue;
}
// Stop loop completely if $row is higher than $max
if ($row > $max) {
break;
}
?>
<tr>
<td style="padding-top:20px; padding-bottom:20px;"><img src="<?php echo $image; ?>" /></td>
<td style="padding-top:16px;"><strong><?php echo $job_title; ?></strong><br><span style="font-size:11px;"><?php echo $company_name; ?></span></td>
<td style="padding-top:16px;"><strong><?php echo $location; ?></strong><br><span style="font-size:11px;"><?php echo $job_time; ?></span></td>
<td style="padding-top:24px;"><strong><?php echo $job_date; ?></strong></td>
<td style="padding-top:20px;" align="center"><button onclick="location.href='<?php echo $cta_link; ?>'" style="background-color:#ea9732; border-color:#ea9732;" class="btn btn-primary btn-md" data-title="Edit" data-toggle="modal" data-target="#edit"><strong><?php echo $cta_link_text; ?></strong></button></td>
</tr>
<?php endwhile; ?>
</tbody>
</table>
<?php
// Pagination
echo paginate_links(
array(
'base'    => get_permalink() . '%#%' . '/',
'format'  => '?page=%#%',
'current' => $page,
'total'   => $pages,
)
);
else : ?>
<p>No jobs found</p>
<?php 
endif;

如果您不能这样做，或者出于某种原因不想这样做，请将分页包装在表行和数据单元格中，并将colspan设置为4，以使其占用所有表宽度

<tr>
<td colspan="4">
<?php echo paginate_links(array(
'base'    => get_permalink() . '%#%' . '/',
'format'  => '?page=%#%',
'current' => $page,
'total'   => $pages,
)); ?>
</td>
</tr>