cara membuat navigasi halaman bernomor di blog

Kali ini saya akan membahas Cara Membuat Navigasi Halaman Di Blog, Sebelum mengedit template blog anda ada baiknya di backup dulu template blognya.
contohnya seperti gambar di bawah ini:

1. langkah pertama yang harus di lakukan adalah login dulu ke blogger >Rancangan/Tata Letak > Edit HTML
2. Cari Kode ]]></b:skin> , Copy kode di bawah ini dan paste tepat sebelum ]]></ b: skin> 

.showpageArea a {
text-decoration:underline;
}
.showpageNum a {
border:1px solid #CCCCCC;
margin:0 3px;
padding:3px 7px;
text-decoration:none;
}
.showpageNum a:hover {
background-color:#CCCCCC;
border:1px solid #CCCCCC;
}
.showpagePoint {
-moz-background-clip:border;
-moz-background-inline-policy:continuous;
-moz-background-origin:padding;
background:#CCCCCC none repeat scroll 0 0;
border:1px solid #CCCCCC;
color:#333333;
margin:0 3px;
padding:3px 7px;
text-decoration:none;
}
.showpageOf {
margin:0 3px 0 0;
padding:3px 7px;
text-decoration:none;
}
.showpage a {
border:1px solid #CCCCCC;
padding:3px 7px;
text-decoration:none;
}
.showpage a:hover {
text-decoration:none;
}
.showpageNum a:link, .showpage a:link {
color:#333333;
text-decoration:none;
}

    5. Setelah kode di atas sudah di letakkan tepat sebelum ]]></ b: skin>, Selanjutnya SIMPAN TEMPLATE
    6.  pergi  ke Rancangan> Elemen Halaman> dan klik pada "Add gadget". pilih "html / java script" dan tambahkan kode yang diberikan di bawah ini dan klik simpan tarik gadget baru Anda di bawah Bagian "Blog Posts".
 

 

<script type='text/javascript'>

var home_page_url = location.href;


var pageCount=1;
var displayPageNum=3;
var upPageWord ='Previous';
var downPageWord ='Next';


function showpageCount(json) {
var thisUrl = home_page_url;
var htmlMap = new Array();
var thisNum = 1;
var postNum=1;
var itemCount = 0;
var fFlag = 0;
var eFlag = 0;
var html= '';
var upPageHtml ='';
var downPageHtml ='';





for(var i=0, post; post = json.feed.entry[i]; i++) {

var timestamp1 = post.published.$t.substring(0,19)+post.published.$t.substring(23,29);
timestamp = encodeURIComponent(timestamp1);


var title = post.title.$t;

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+'&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){
  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 += '<span class="showpagePoint">'+thisNum+'</span>';
}else{
 if(p==0){
   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++;
}
}
}

if(thisNum>1){
html = ''+upPageHtml+' '+html +' ';
}

html = '<div class="showpageArea"><span  class="showpageOf"> Pages ('+(postNum-1)+')</span>'+html;

if(thisNum<(postNum-1)){
html += downPageHtml;
}

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


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;
}


}


function showpageCount2(json) {

var thisUrl = home_page_url;
var htmlMap = new Array();
var isLablePage = thisUrl.indexOf("/search/label/")!=-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 labelHtml = '<span class="showpageNum"><a href="/search/label/'+thisLable+'?&max-results='+pageCount+'">';
var thisUrl = home_page_url;


for(var i=0, post; post = json.feed.entry[i]; i++) {

var timestamp1 = post.published.$t.substring(0,19)+post.published.$t.substring(23,29);
timestamp = encodeURIComponent(timestamp1);



var title = post.title.$t;

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

 if(title!='') postNum++;
 htmlMap[htmlMap.length] = '/search/label/'+thisLable+'?updated-max='+timestamp+'&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){
  upPageHtml = labelHtml + upPageWord +'</a></span>';
 }else{
  upPageHtml = '<span class="showpage"><a href="'+htmlMap[p]+'">'+ upPageWord +'</a></span>';
 }

 fFlag++;
}

if(p==(thisNum-1)){
 html += '<span class="showpagePoint">'+thisNum+'</span>';
}else{
 if(p==0){
  html = labelHtml+'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++;
}
}
}

if(thisNum>1){
if(!isLablePage){
html = ''+upPageHtml+' '+html +' ';
}else{
html = ''+upPageHtml+' '+html +' ';
}
}

html = '<div class="showpageArea"><span  class="showpageOf"> Pages ('+(postNum-1)+')</span>'+html;

if(thisNum<(postNum-1)){
html += downPageHtml;
}

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

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 type='text/javascript'>

var thisUrl = home_page_url;
if (thisUrl.indexOf("/search/label/")!=-1){
if (thisUrl.indexOf("?updated-max")!=-1){
 var lblname1 = thisUrl.substring(thisUrl.indexOf("/search/label/")+14,thisUrl.indexOf("?updated-max"));
}else{
 var lblname1 = thisUrl.substring(thisUrl.indexOf("/search/label/")+14,thisUrl.indexOf("?&max"));
}
}

var home_page = "/";
if (thisUrl.indexOf("?q=")==-1){
if (thisUrl.indexOf("/search/label/")==-1){
 document.write('<script src="'+home_page+'feeds/posts/summary?alt=json-in-script&callback=showpageCount&max-results=99999" ><\/script>')
}else{document.write('<script src="'+home_page+'feeds/posts/full/-/'+lblname1+'?alt=json-in-script&callback=showpageCount2&max-results=99999" ><\/script>')
}
}
</script>

Catatan:
Perubahan nilai-nilai pageCount, displayPageNum, upPageWord, downPageWord jika Anda suka.

Anda selesai.

Diposkan oleh zaryanti x1 tkj2

Read More

cara membuat readmore otomatis

Dengan adanya readmore otomatis, kita bisa menentukan berapa ketinggian dan lebar penggalan postingan dan image yang akan muncul pada halaman pertama blog kita sehingga terlihat rapi dan menarik. Trik ini mungkin telah banyak yang mengetahui dan ada juga yang belum mengetahuinya. Bagi anda yang belum mengetahui bagaimana cara membuat readmore otomatis, bisa mengikuti tutorial berikut ini.

1. Silakan masuk ke acount blogger anda kemudian pilih Edit Html, jangan lupa memberikan tanda ceklis pada bacaan "Expand Widget Template" atau lihat gambar di bawah ini : 

  

cari kode </head> kemudian masukkan script di bawah ini persis dibawah kode tersebut.

<script type='text/javascript'> var thumbnail_mode = &quot;no-float&quot; ; summary_noimg = 430; summary_img = 340; img_thumb_height = 100; img_thumb_width = 120; </script> <script src='http://rizqi.moehamed.googlepages.com/read-moreotomatis.js' type='text/javascript'/> 

     2. cari kode html berikut ini : 

<data:post.body/> atau <p><data:post.body/></p>

ganti kode tersebut dengan kode di bawah ini : 

<b:if cond='data:blog.pageType != &quot;item&quot;'>
<div expr:id='&quot;summary&quot; + data:post.id'><data:post.body/></div>
<script type='text/javascript'>createSummaryAndThumb(&quot;summary<data:post.id/>&quot;);
</script>
<span class='rmlink' style='float:right;padding-top:20px;'>
<a expr:href='data:post.url'>&#187;&#187;&#160;&#160;READMORE...</a></span>
</b:if>
<b:if cond='data:blog.pageType == &quot;item&quot;'><data:post.body/></b:if>

Keterangan : tulisan yang berwarna merah adalah yang bisa anda ganti.
==> Summary noimg 430 = tinggi artikel terpenggal tanpa image

==> Summar img 430 = tinggi artikel terpenggal dengan image

==> Readmore bisa anda ganti dengan Baca Selengkapnya, full read dll...

    3. klik save template.

Read More

cara membuat blog

Disini akan saya uraikan bagaimana cara bikin atau cara buat blog di blogger atau blogspot. Pertama kali ketikkan di browser anda http://blogger.com . maka akan muncul tampilan antar muka seperti gambar berikut :

Lalu anda masukkan email dan password anda, dengan catatan anda sudah terdaftar

di blogger.com atau sudah mempunyai google account misalnya email di gmail.com. Jika belum punya, silahkan klik pada “ciptakan blog anda” dan ikuti perintah-perintah selanjutnya.
Disini saya asumsikan bahwa anda telah mempunyai sebuah account blogger, maka setelah anda isi form seperti pada gambar diatas klik “masuk”, dan akan muncul tampilan seperti berikut :

dalam tampilan di atas, tidak ada blog sama sekali yang menjadi milik anda, lalu klik pada “create a blog” atau “ciptakan sebuah blog” dan akan muncul tampilan seperti gambardi bawah ini;

nah, pada gambar diatas anda harus memasukkan “blog title” atau “judul blog” ; “blog address (url)” atau “alamat blog” dimana ini nanti akan menjadi alamat dari blog anda, dan masukkan pula “word verification” seperti yang tampak pada gambar diatas, yang mana word verification ini nanti akan berubah setiap ada refresh atau kesalahan penulisan ataupun setiap kali bikin blog yang baru.
Sebagai contoh, masukkan blog title dengan Cara buat blog di blogger.com, sementara pada blog address, masukkan carabuatblog, memang disini tidak diperkenankan menggunakan spasi, sehingga penulisan carabuatblog tidak saya tulis cara buat blog. setelah anda masukkan kedua hal tersebut jangan lupa word verifikasinya, lalu klik pada “continue”.
Ada kalanya pada “address blog” ini mengalami kegagalan. Hal ini disebabkan karena address blog yang kita tuliskan sudah ada yang memaki atau memang penulisan kita tidak diijinkan oleh pihak blogger.com, untuk itu blogger.com biasanya menyediakan alternatif address blog lain yang biasanya di kaitkan antara kata-kata yang kita isikan pada “blog title” dan “address blog” itu sendiri.
Seperti yang tampil pada gambar diatas, pihak blogger memberikan pilihan lain untuk address blog anda, klik salah satu dari yang disediakan atau anda dapat menuliskan address blog atau alamat blog anda yang lain sampai pihak blogger menerima, itu terserah anda. kemudian klik continue. Maka jika alamta blog anda diterima oleh pihak blogger, akan muncul tampilan seperti gambar berikut;

pada gambar diatas, anda diminta memilih tempalte atau theme untuk blog anda, pilih template yang anda sukai kemudian klik “continue”. Setelah itu muncul tampilan seperti berikut lalu klik pada “start blogging”.

Jika anda telah selesai sampai disini berarti blog anda sudah jadi. Andaikan anda tadi mengisikan cara buat blog (tidak pakai spasi) pada address blog, maka address blog anda adalah http://www.carabuatblog.blogspot.com, dan jika anda membuka alamat blog tersebut maka akan muncul tampilan dari blog anda yang belum ada isinya. Untuk memulai mengisi blog anda, pertamakali memang otomatis setelah anda mengeklik “start blogging” pada gambar diatas akan menuju pada halaman posting seperti berikut

Disini isikan Judul postingan atau judul berita pada “judul”, misalnya cara buat blog kemudian isikan isi berita pada kolom yang besar di tengah, tentu saja yang berhubungan dengan judul postingan anda. Jangan lupa membubuhkan label pada kolom yang disediakan dengan tanda “koma” setiap label. Label dimaksudkan sebagai kata kunci atau keyword di mesin pencarian bagi para pencari berita. Setelah itu klik “publish post” atau “terbitkan post” maka secara otomatis blog anda (cara buat blog. blogspot.com) sudah terisi satu posting.  untuk melihat hasil postingan anda tersebut klik pada “view site” atau kalau mau mengedit klik “edit post” untuk membuat postingan baru klik pada “createn new post”. Demikian seterusnya untuk membuat posting di blogspot.com.

Diposkan oleh zaryantix1 tkj 2

Read More

cara buat screen saver energy saving mode di blogScreen Saver Energy Saving Mode

Screen Saver Energy Saving Mode jika blog kita di kunjungi dan dalam beberapa waktu di diemin maka halaman blog akan menutup dengan halaman hitam dan akan kembali seperti semula jika mouse di goyang goyang kan.

 Langkah-langkahnya sebagai berikut :

1. Loggin dulu ah ke blog sobat-sobat  
2. Masuk ke Rancangan > Edit HTML  
3. Cari kode <head>  kemudian kamu copy kan scrip berikut di atas <head> :
   
   
   <script language='javascript' src='http://www.onlineleaf.com/savetheenvironment.js' type='text/javascript'/>

   
   kemudian simpan.

Diposkan oleh zaryanti x1 tkj 2

Read More