WordPress için Bootstrap sayfalama...

WordPress için Bootstrap sayfalama…


Warning: file_get_contents(http://twitter.github.com/bootstrap/components.html#pagination): failed to open stream: HTTP request failed! HTTP/1.1 404 Not Found in /home/u989750086/domains/wpadami.com/public_html/wp-content/plugins/s-fonks/s-fonks.php on line 89

Warning: file_get_contents(http://twitter.github.com/bootstrap/customize.html): failed to open stream: HTTP request failed! HTTP/1.1 404 Not Found in /home/u989750086/domains/wpadami.com/public_html/wp-content/plugins/s-fonks/s-fonks.php on line 89

Warning: file_get_contents(http://wp-snippets.com/pagination-for-twitter-bootstrap): failed to open stream: HTTP request failed! HTTP/1.1 500 Internal Server Error in /home/u989750086/domains/wpadami.com/public_html/wp-content/plugins/s-fonks/s-fonks.php on line 89

Boostrap altyapılı bir tema kullanmıyor olsanız bile buna ihtiyacınız olabilir. Aslında özelleştirilmiş bir sayfalama fonksiyonu ile karşı karşıyayız. Birçok amaçla kullanabileceğiniz bir fonksiyon. Bunu temanızda kullanabilmek için tabii ki bootstrap sayfalama css kodlarına sahip olmanız gerekmekte. Yazının sonuna o alanın da linkini ekleyeceğim. Gelelim kodlarımızı göstermeye…

Kod

Aşağıdaki kodu temanızın functions.php dosyası içinde en sonda bulunan ?> işaretinden önce ekleyin.

Aşağıdaki kodu temanızın işleyişini sağlayan functions.php dosyası içine yerleştireceksiniz. Olası yanlışlıklarıda sisteminiz hata verebileceğinden dolayı lütfen functions.php dosyasının bir yedeğini alınız. functions.php genel olarak wp-content/themes/temanizin-adi/ klasöründe bulunur.

Bootstrap Sayfalama Kodu

<?php

// Numeric Page Navi
function page_navi($before = '', $after = '') {
	global $wpdb, $wp_query;
	$request = $wp_query->request;
	$posts_per_page = intval(get_query_var('posts_per_page'));
	$paged = intval(get_query_var('paged'));
	$numposts = $wp_query->found_posts;
	$max_page = $wp_query->max_num_pages;
	if ( $numposts <= $posts_per_page ) { return; }
	if(empty($paged) || $paged == 0) {
		$paged = 1;
	}
	$pages_to_show = 7;
	$pages_to_show_minus_1 = $pages_to_show-1;
	$half_page_start = floor($pages_to_show_minus_1/2);
	$half_page_end = ceil($pages_to_show_minus_1/2);
	$start_page = $paged - $half_page_start;
	if($start_page <= 0) {
		$start_page = 1;
	}
	$end_page = $paged + $half_page_end;
	if(($end_page - $start_page) != $pages_to_show_minus_1) {
		$end_page = $start_page + $pages_to_show_minus_1;
	}
	if($end_page > $max_page) {
		$start_page = $max_page - $pages_to_show_minus_1;
		$end_page = $max_page;
	}
	if($start_page <= 0) {
		$start_page = 1;
	}
		
	echo $before.'<div class="pagination"><ul class="clearfix">'."";
	if ($paged > 1) {
		$first_page_text = "«";
		echo '<li class="prev"><a href="'.get_pagenum_link().'" title="İlk">'.$first_page_text.'</a></li>';
	}
		
	$prevposts = get_previous_posts_link('← Previous');
	if($prevposts) { echo '<li>' . $prevposts  . '</li>'; }
	else { echo '<li class="disabled"><a href="#">← Önceki</a></li>'; }
	
	for($i = $start_page; $i  <= $end_page; $i++) {
		if($i == $paged) {
			echo '<li class="active"><a href="#">'.$i.'</a></li>';
		} else {
			echo '<li><a href="'.get_pagenum_link($i).'">'.$i.'</a></li>';
		}
	}
	echo '<li class="">';
	next_posts_link('Sonraki →');
	echo '</li>';
	if ($end_page < $max_page) {
		$last_page_text = "»";
		echo '<li class="next"><a href="'.get_pagenum_link($max_page).'" title="Son">'.$last_page_text.'</a></li>';
	}
	echo '</ul></div>'.$after."";
}

?>

Bunu kullanabilmek için bootstrap css dosyasına ihtiyacınız olacak. Temanızın header.php dosyası içine etiketinden önce aşağıdaki kodu ekleyin. Unutmayın bu dosya temanızın css dosyasının yanında olmalı.

<link rel="stylesheet" href="<?php bloginfo('template_url'); ?>/bootstrap.css">

Bunları ekledikten sonra istediğiniz alanda bu fonksiyonu kullanmak için yapmanız gereken ilgili dosya içine (örn index.php, page.php) aşağıdaki fonksiyonu çağırın.

<?php page_navi(); ?>

Linkler
http://twitter.github.com/bootstrap/components.html#pagination

http://twitter.github.com/bootstrap/customize.html

http://wp-snippets.com/pagination-for-twitter-bootstrap

Selametle