Ändern der Paginierungslistenklasse

16

paginate_links()Die Funktion gibt eine ungeordnete Liste mit der Klasse "Seitenzahlen" zurück. Wie kann ich diese Klasse ändern?

BEARBEITEN

Derzeit verwende ich die unten stehende Pflaster-Methode.

$return = paginate_links( $arg );
echo str_replace( "<ul class='page-numbers'>", '<ul class="pagination">', $return );

Gibt es einen besseren Weg?

Sodbileg Gansukh
quelle
1
Ich habe ein kurzes Tutorial zu diesem Thema gefunden und was ich sehen kann, ist, dass Sie die Bootstrap-Themenklasse verwenden, damit ich denke, dass dies helfen wird! http://www.ordinarycoder.com/paginate_links-class-ul-li-bootstrap/
Erik Larsson
Ich habe eine PHP-Klasse erstellt, die nützlich ist, wenn Sie die Klassennamen LI und A html tags festlegen müssen. gist.github.com/pixeline/1dc662b756c553eb5efcb6ec4753375f
Pixeline
@ErikLarsson Link ist kaputt.
MastaBaba

Antworten:

11

paginate_links()bietet keinen Parameter an und es gibt keine Hooks - siehe Quelle -, um die Klasse (n) zu ändern. Das heißt, Sie können es so tun, wie Sie es getan haben, oder Sie erstellen Ihre eigene Paginierungsfunktion basierend auf paginate_links().

Nicolai
quelle
14

Ich suchte auch nach der gleichen Lösung, um sie mit Bootstrap-Paginierungslinks zu verwenden.

Der folgende Code funktioniert zu 100% in meinem Theme.

function bittersweet_pagination() {

global $wp_query;

if ( $wp_query->max_num_pages <= 1 ) return; 

$big = 999999999; // need an unlikely integer

$pages = paginate_links( array(
        'base' => str_replace( $big, '%#%', esc_url( get_pagenum_link( $big ) ) ),
        'format' => '?paged=%#%',
        'current' => max( 1, get_query_var('paged') ),
        'total' => $wp_query->max_num_pages,
        'type'  => 'array',
    ) );
    if( is_array( $pages ) ) {
        $paged = ( get_query_var('paged') == 0 ) ? 1 : get_query_var('paged');
        echo '<div class="pagination-wrap"><ul class="pagination">';
        foreach ( $pages as $page ) {
                echo "<li>$page</li>";
        }
       echo '</ul></div>';
        }
}

benutze die Funktion um zB index.php aufzurufen; <?php bittersweet_pagination(); ?>oder eine andere Datei. Ich habe auch ein Bootstrap-Styling überschrieben, das Ihnen vielleicht hilft.

.pagination-wrap {
    clear: both;
    display: block;
    overflow: hidden;
    text-align: center;
}
.pagination-wrap .pagination {
    margin-bottom: 0;
    margin-top: 0;
}
.pagination-wrap .pagination > li:first-child > a, 
.pagination-wrap .pagination > li:first-child > span {
    border-bottom-left-radius: 0px;
    border-top-left-radius: 0px;
}
.pagination-wrap .pagination > li:last-child > a, 
.pagination-wrap .pagination > li:last-child > span {
    border-bottom-right-radius: 0px;
    border-top-right-radius: 0px;
}
.pagination-wrap .pagination > li > a,
.pagination-wrap .pagination > li > span {
    background-color: #4FBEBA;
    border: 1px solid #1BA5A0;
    padding: 10px 15px;
    font-weight: bold;
    color: #FFFFFF;
}
.pagination-wrap .pagination > li > a:hover, 
.pagination-wrap .pagination > li > span:hover, 
.pagination-wrap .pagination > li > a:focus, 
.pagination-wrap .pagination > li > span:focus {
    background-color: #1BA5A0;
    border-color: #189690;
}
.pagination-wrap .pagination .current {
    background-color: #1BA5A0;
    border-color: #189690;
}
.pagination-wrap .pagination .current:hover,
.pagination-wrap .pagination .current span:hover {
    background-color: #189690;
    border-color: #148781;
}
Aamer Shahzad
quelle
1
Sie können die Leistung etwas verbessern, da diese Abfrage jedes Mal aufgerufen wird, wenn eine Seite generiert wird, auch wenn keine Paginierung erforderlich ist. add: `` `if ($ wp_query-> max_num_pages <= 1) return; `` `nach Ihrer globalen $ wp_query am Anfang der Funktion.
Pixeline
4

Dafür müssen Sie den Parameter type verwenden

$links = paginate_links( array(
    'base' => str_replace( $big, '%#%', esc_url( get_pagenum_link( $big ) ) ),
    'format' => '?paged=%#%',
    'current' => max( 1, get_query_var('paged') ),
    'total' => $posts_array->max_num_pages,
    'prev_text'          => __( 'Previous page', 'twentyfifteen' ),
    'next_text'          => __( 'Next page', 'twentyfifteen' ),
    'type' => 'list'
) );
   echo $links
Bhavesh Vala
quelle
0

Eine andere Option, die hier nicht erwähnt wird, ist das Kopieren der Stile in die WordPress-Paginierungsklassen, anstatt die dem Element zugewiesene Klasse zu ändern.

Wenn Sie Bootstrap verwenden und alles mit sass bündeln, können Sie die Stile einfach mit der @extendDirektive anwenden .

ul.page-numbers {
    @extend .pagination;
    > li {
        > a, > span {
            &.page-numbers {
                @extend .page-link
                &:focus, :hover {
                    /* Additional hover/focus styles here */
                }
            }
        }
    }
}

Dies mag für einige Situationen relevant sein, aber ich bin der Meinung, dass der Code in der ursprünglichen Frage die beste Lösung für die meisten Anwendungen ist.

Shaun Cockerill
quelle