Dapatkan potongan 25% untuk pembelian kelas online selama Ramadhan. Lihat Detail Promo
Generic placeholder image

Pagination codeigniter

Ditanyakan 3 bulan yang lalu oleh Dzaki Fadhlurrohman

Jadi gini mas, pagination saya sudah berfungsi dengan baik dengan styling bootstrap, nah tapi kan defaultnya kita itu harus nge-klik di anchor nya baru pindah, kalo di background nya belum bisa jadi kaya hover biasa.

Pas saya cari tag <a> di $config-nya ngga ada, pertanyaan inti, bagaimana saya bisa hanya dengan menghoverkan ke pagination langsung pindah, tanpa harus ke anchor nya

Jika masih pertanyaan saya masih belum jelas, bisa ditanyakan ulang :)

Terimakasih.

https://pastebin.com/4vzZrA3a

1 JAWABAN / 1 KOMENTAR

Generic placeholder image
Ahmad Oriza menjawab 3 bulan yang lalu

Sepertinya kalau mau full background click gak bisa pakai settingan seperti itu. Custom paging config CI tidak bisa menyentuh anchor paging dari Codeigniter.

Mungkin ada cara lain, yaitu membuat style paging sendiri. Ikuti langkah berikut jika tertarik :

  1. Modif Pagination

Hapus custom paging milik mas, dan harusnya jadi seperti ini saja :

public function index($offset = 0)
{
    $data['footer'] = $this->MA_model->get_footer(1);

    $config['base_url'] = site_url('kumpulan-artikel'); //site url
    $config['total_rows'] = $this->db->count_all_results('blog_content'); //total row
    $config['per_page'] = 6; 
    $config["uri_segment"] = 2;  // uri parameter

    $this->pagination->initialize($config);
    $data['article'] = $this->Article_model->get_article_pagination($config["per_page"], $offset);           
    $data['pagination'] = $this->pagination->create_links();
    $this->template->load('mainpage/template', 'mainpage/blog_list', $data);
}

Jika ada error harap modifikasi lagi, saya gak tahu persis kode milik mas, intinya silahkan hapus custom config pagingnya. Bikin standard aja.

  1. Modif View

Panggil pagination lalu apit oleh sebuah div seperti ini :

<!-- Bungkus dalam div class custom-pagination -->
<div class="custom-pagination">
 <?php echo $pagination;?>
</div>
  1. Terakhir, Sentuhan CSS

Bikin custom style pagination. Taruh script ini di header css, atau di file milik mas, intinya terapkan css ini.

.custom-pagination{
            margin-top:20px;
        }
        .custom-pagination a{
            background:#444;
            color:#FFF;
            padding:10px;
        }
        .custom-pagination a:hover{
            background:#444;
            color:#FFF;
            padding:10px;
            text-decoration: none;
        }
        .custom-pagination strong{
            background:#DEDEDE;
            color:#444;
            padding:10px;
        }

Kalau kurang bagus, bisa modif dengan selera sendiri. Kalau mau kaya bootstrap coba minta tolong teman yang jago css buat niru style bootstrap.

Hasilnya entar kaya gini :

Paging tersebut sudah full background klik, jadi gak perlu klik anchor link lagi buat pindah halaman.