™My Generation™
Bukan seorang member?

Jika Anda bukan member dan belum mendaftar, hanya membutuhkan waktu beberapa menit untuk mendaftar! Menjadi member mendapatkan banyak manfaat dan banyak lagi!.


-Mulai topik baru dan membalas pesan kepada orang lain.
-Berlangganan topik dan forum untuk mendapatkan update otomatis.
-Dapatkan profil Anda sendiri dan membuat teman baru.
-Menyesuaikan diri dari pengalaman Anda di sini dan berbagi.
Daftar Sekarang.
By: ™My Generation™ Community Anak Bangsa

™My Generation™

Community Anak Bangsa 2011
 
IndeksPortalCalendarGalleryFAQPencarianPendaftaranLogin
**Welcome To ™My Generation™ Community Anak Bangsa**|||**Bergabunglah Dengan Kami Dan Daftarkan Diri Anda Sekarang**
Login
Username:
Password:
Login otomatis: 
:: Lupa password?
Live Streaming
Top posters
Xaverius Fully
 
MG-Aestine Christy
 
laskar751
 
dauskhaan
 
MG_Santi Viper
 
gifan123
 
arvo
 
royvandi
 
MG_Ferdian Xaverius
 
nack-karma
 
widgeo.net
Iklan
December 2016
MonTueWedThuFriSatSun
   1234
567891011
12131415161718
19202122232425
262728293031 
CalendarCalendar

Share | 
 

 Membuat Navigasi Halaman Bernomor/Paging

Topik sebelumnya Topik selanjutnya Go down 
PengirimMessage
MG_Arlene
VIP Member
VIP Member


MG Community Anak Bangsa
Jumlah posting : 38
Points : 247
Reputation : 35
Join date : 07.04.11
Age : 25
Lokasi : Bekasi

PostSubyek: Membuat Navigasi Halaman Bernomor/Paging   Thu Apr 07, 2011 12:07 pm

Setelah lama saya mencari akhirnya dapat juga, jika biasanya pada halaman pada blog anda hanya ada older post ternyata itu bisa di ganti dengan halaman bernomor seperti gambar berikut:



penasaran bagaiman cara membuatnya, langsung aja :
yang paling penting anda harus login dulu
2. masuk ke tata letak (layout) >> element halaman
3. tambah gedget >> pilih HTML/java script
4. copas dan code berikut:

Code:

[code]<style>
.showpageArea {padding: 0 2px;margin-top:10px;margin-bottom:10px;
}
.showpageArea a {border: 1px solid #505050;
color: #000000;font-weight:normal;
padding: 3px 6px !important;
padding: 1px 4px ;margin:0px 4px;
text-decoration: none;
}
.showpageArea a:hover {
font-size:11px;
border: 1px solid #333;
color: #000000;
background-color: #FFFFFF;
}

.showpageNum a {border: 1px solid #505050;
color: #000000;font-weight:normal;
padding: 3px 6px !important;
padding: 1px 4px ;margin:0px 4px;
text-decoration: none;

}
.showpageNum a:hover {
font-size:11px;
border: 1px solid #333;
color: #000000;
background-color: #FFFFFF;

}
.showpagePoint {font-size:11px;
padding: 2px 4px 2px 4px;
margin: 2px;
font-weight: bold;
border: 1px solid #333;
color: #fff;
background-color: #000000;


}

.showpage a:hover {font-size:11px;
border: 1px solid #333;
color: #000000;
background-color: #FFFFFF;

}
.showpageNum a:link,.showpage a:link {
font-size:11px;
padding: 2px 4px 2px 4px;
margin: 2px;
text-decoration: none;
border: 1px solid #0066cc;
color: #0066cc;
background-color: #FFFFFF;}

.showpageNum a:hover {font-size:11px;
border: 1px solid #333;
color: #000000;
background-color: #FFFFFF;
}
</style>



<script type="text/javascript">

function showpageCount(json) {
var thisUrl = location.href;
var htmlMap = new Array();
var isFirstPage = thisUrl.substring(thisUrl.length-14,thisUrl.length)==".blogspot.com/";
var isLablePage = thisUrl.indexOf("/search/label/")!=-1;
var isPage = thisUrl.indexOf("/search?updated")!=-1;
var thisLable = isLablePage ? thisUrl.substr(thisUrl.indexOf("/search/label/")+14,thisUrl.length) : "";
thisLable = thisLable.indexOf("?")!=-1 ? thisLable.substr(0,thisLable.indexOf("?")) : thisLable;
var thisNum = 1;
var postNum=1;
var itemCount = 0;
var fFlag = 0;
var eFlag = 0;
var html= '';
var upPageHtml ='';
var downPageHtml ='';


var pageCount=5;
var displayPageNum=3;
var firstPageWord = '[color=red]First[/color]';
var endPageWord = '[color=red]Last[/color]';
var upPageWord ='[color=red]Previous[/color]';
var downPageWord ='[color=red]Next[/color]';



var labelHtml = '<span class="showpageNum"><a href="/search/label/'+thisLable+'?&max-results='+pageCount+'">';

for(var i=0, post; post = json.feed.entry[i]; i++) {
var timestamp = post.published.$t.substr(0,10);
var title = post.title.$t;
if(isLablePage){
if(title!=''){
if(post.category){
for(var c=0, post_category; post_category = post.category[c]; c++) {
if(encodeURIComponent(post_category.term)==thisLable){
if(itemCount==0 || (itemCount % pageCount ==(pageCount-1))){
if(thisUrl.indexOf(timestamp)!=-1 ){
thisNum = postNum;
}

postNum++;
htmlMap[htmlMap.length] = '/search/label/'+thisLable+'?updated-max='+timestamp+'T00%3A00%3A00%2B08%3A00&max-results='+pageCount;
}
}
}
}//end if(post.category){

itemCount++;
}

}else{
if(title!=''){
if(itemCount==0 || (itemCount % pageCount ==(pageCount-1))){
if(thisUrl.indexOf(timestamp)!=-1 ){
thisNum = postNum;
}

if(title!='') postNum++;
htmlMap[htmlMap.length] = '/search?updated-max='+timestamp+'T00%3A00%3A00%2B08%3A00&max-results='+pageCount;
}
}
itemCount++;
}
}

for(var p =0;p< htmlMap.length;p++){
if(p>=(thisNum-displayPageNum-1) && p<(thisNum+displayPageNum)){
if(fFlag ==0 && p == thisNum-2){
if(thisNum==2){
if(isLablePage){
upPageHtml = labelHtml + upPageWord +'</a></span>';
}else{
upPageHtml = '<span class="showpage"><a href="/">'+ upPageWord +'</a></span>';
}
}else{
upPageHtml = '<span class="showpage"><a href="'+htmlMap[p]+'">'+ upPageWord +'</a></span>';
}

fFlag++;
}

if(p==(thisNum-1)){
html += '&nbsp;<span class="showpagePoint"><u>'+thisNum+'</u></span>';
}else{
if(p==0){
if(isLablePage){
html = labelHtml+'1</a></span>';
}else{
html += '<span class="showpageNum"><a href="/">1</a></span>';
}
}else{
html += '<span class="showpageNum"><a href="'+htmlMap[p]+'">'+ (p+1) +' </a></span>';
}
}

if(eFlag ==0 && p == thisNum){
downPageHtml = '<span class="showpage"> <a href="'+htmlMap[p]+'">'+ downPageWord +'</a></span>';
eFlag++;
}
}//end if(p>=(thisNum-displayPageNum-1) && p<(thisNum+displayPageNum)){
}//end for(var p =0;p< htmlMap.length;p++){

if(thisNum>1){
if(!isLablePage){
html = '<span class="showpage"><a href="/">'+ firstPageWord +' </a></span>'+upPageHtml+' '+html +' ';
}else{
html = ''+labelHtml + firstPageWord +' </a></span>'+upPageHtml+' '+html +' ';
}
}

html = '<div class="showpageArea"><span style="padding: 2px 4px 2px 4px;margin: 2px 2px 2px 2px;border: 1px solid #333; background-" class="showpage">Page '+thisNum+' of '+(postNum-1)+': </span>'+html;

if(thisNum<(postNum-1)){
html += downPageHtml;
html += '<span class="showpage"><a href="'+htmlMap[htmlMap.length-1]+'"> '+endPageWord+'</a></span>';
}

if(postNum==1) postNum++;
html += '</div>';

if(isPage || isFirstPage || isLablePage){
var pageArea = document.getElementsByName("pageArea");
var blogPager = document.getElementById("blog-pager");

if(postNum <= 2){
html ='';
}

for(var p =0;p< pageArea.length;p++){
pageArea[p].innerHTML = html;
}

if(pageArea&&pageArea.length>0){
html ='';
}

if(blogPager){
blogPager.innerHTML = html;
}
}

}
</script>

<script src="/feeds/posts/summary?alt=json-in-script&callback=showpageCount&max-results=99999" type="text/javascript"></script>[/code]

5. text yang berwarna merah bisa anda ganti dengan tetx seperti: first menjadi home,
next menjadi lanjut, Previous menjadi kembali last menjadi terakhir
6. letakkan di bawah posting blog seperti gambar berikut:



7. simpan template, lihat hasilnya . . .
SEMOGA BERMANFAAT
Kembali Ke Atas Go down
http://www.imemovaz.com
MG_Santi Viper
Spammer
Spammer


MG Community Anak Bangsa
Jumlah posting : 95
Points : 3213
Reputation : 106
Join date : 06.04.11
Age : 27
Lokasi : Jakarta

PostSubyek: Re: Membuat Navigasi Halaman Bernomor/Paging   Thu Apr 07, 2011 12:09 pm

Kembali Ke Atas Go down
 
Membuat Navigasi Halaman Bernomor/Paging
Topik sebelumnya Topik selanjutnya Kembali Ke Atas 
Halaman 1 dari 1
 Similar topics
-
» Hal-Hal yang dapat membuat kaum lelaki menangis
» [Tutorial] Cara membuat forum forumotion
» Cara membuat pendataan&list list barang menjadi seperti di sini?
» (bagaimana) cara membuat peringatan di chatbox?
» Arsip: Cara Membuat Jumlah Posting,Birthday,Join Date,Webs Seperti Ini

Permissions in this forum:Anda tidak dapat menjawab topik
™My Generation™ :: Fun :: Tips & Trick-
Navigasi: