Showing posts with label Blogspot. Show all posts
Showing posts with label Blogspot. Show all posts

Home » Posts filed under Blogspot

Cara Membuat Navigasi Halaman Angka Pada Blogger atau Blogspot

Diposkan oleh Samipodo on Sunday, October 16, 2011

Samipodo blog kali ini akan memberi tutorial tentang bagaimana caranya membuat navigasi halaman angka di blog kita. Tujuannya agar blog kita tidak kelihatan berantakan karena banyaknya posting yang kita buat. Biasanya hal seperti itu sering terjadi kalau kita menggunakan template minimal dengan 2 kolom, cara mengatasi kita harus membuat navigasi pada halaman berupa angka pada setiap halaman. Sebenarnya navigasi halaman ini bisa juga disebut tombol nextt yang akan menampilkan nomor pada setiap halaman, jika kita klik nomor 2 akan pindah pada nomor 2 dan seterusnya, contohnya seperti ini nih, saya pinjam punya google !

Terus cara bikin nya begini, kamu cukup pasang kode dibawah ini di sidebar:

1. Masuk ke Dasboard Blogger kamu.
2. Klik layout(Tata Letak)
3. Klik Tambah Gadget.
4. Pilihlah Edit HTML/Javascript.
5. Masukkan kode html di bawah ini:
<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=4;
var firstPageWord = 'First';
var endPageWord = 'Last';
var upPageWord ='Previous';
var downPageWord ='Next';
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 += ' <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">Halaman '+thisNum+' dari '+(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>
Setelah memasukkan kode tadi, geser dengan menekan mouse letakkan dibawah widget postingan kamu. nih lihat contohnya : sebelumnya saya menambah widget di atas sidebar lalu saya geser kebawah postingan.



Silahkan di coba, Gan!
More about → Cara Membuat Navigasi Halaman Angka Pada Blogger atau Blogspot
{ Add komentar }
Label: , , , ,

Cara membuat Kotak Komentar blog di blogger/blogspot

Diposkan oleh Samipodo

Pada saat membuat blog di blogger/blogspot setelah blog jadi, biasanya sudah ada di blog kamu kotak komentar di bawah postingan, karena menggunakan template default/asli punya blogger, tapi akan berbeda jika kita mengganti template dari luar dan kadang tidak muncul kotak komentar, Jika demikian kamu dapat membuatnya sendiri, caranya seperti ini :

1. Login Ke Blogger dengan akun blogger mu
2. Klik "Tata Letak/layout"
3. Klik "Edit HTML"
4. Centang kotak "Expand Template Widget"
5. Cari kode di bawah ini :



6. Kalau sudah ketemu masukkan kode di bawah ini dibawahnya kode tadi



7. Klik "Simpan Template"
8. Klik tab "Pengaturan/setting"
9. Klik tab "Komentar"
10. Pada bagian "Penempatan Formulir Komentar" pilih "Disemat di bawah entri"
11. Kemudian Klik "Simpan "

Jika sudah selesai coba anda klik salah satu dari judul postingan kamu, di sana akan ada kotak komentar, misalnya tidak muncul pasti ada kesalahan,
More about → Cara membuat Kotak Komentar blog di blogger/blogspot
{ Add komentar }
Label: , , , ,