Bootstrapのクラスによる全一覧(目次)のページネーションデザインの変更 2014/03/03 (月)

ページ移動リンクは、クラス設定により簡単にセンタリンクや右寄せ、サイズの変更が可能です。

全一覧の初期設定のテンプレート(templates/article/article_list.html)には「<ul class="pagination">」というクラスでページネーション(ページの上の方にあるリンク)が定義されています。このクラスを付けておくだけで、サンプルのようにページのリンクがボックス内に並んで表示されますが、これを変更するには以下のようにクラスを足していきます。

※Bootstrap 3.x の設定方法です。 Bootstrap 2.x の場合と異なりますのでご注意下さい。

大きなサイズでページ番号を表示

<ul class="pagination pagination-lg">

小さなサイズでページ番号を表示

<ul class="pagination pagination-sm">