CEp Blog

Home » Posts filed under Blogger

Showing posts with label Blogger. Show all posts

Showing posts with label Blogger. Show all posts

Cara Praktis Update Banner Blog

Sebelum berlanjut ke postingan dan sedikit berbagi tentang "Cara Praktis Update Banner Blog", saya ucapkan selamat berjumpa kembali sobat-sobat blogger lama tidak berjumpa, mungkin karena ada sedikit kesibukan di luar.
Baik.. tanpa banyak basa-basi, di sini saya akan sedikit berbagi tentang bagaimana caranya untuk mengganti "Banner Blog" yang tela terpasang di blog-blog sahabat tanpa harus repot-repot untuk memberitahukan bahkan mungkin meminta teman blog yang telah bertukan banner untuk mengganti kode banner kita yang telah di pasang di blognya, saya rasa akan repot sekali kalau caranya seperti itu.
Pada kali ini saya baru mempelajari dan berlaku bagi sobat blog yang menyimpan Image Bannernya di web photobucket, bagi sobat blog yang menyimpan image bannernya di google picasa atau yang lainnya mungkin bisa sobat coba dengan cara seperti ini:

Siapkan image Banner Blog sobat yang baru
Login ke photobucket
Cari image yang sobat pakai banner blog pada saat ini
Catat nama dari image banner tsb misalnya banner.gif
Pastikan image bannernya berada/ disimpan di folder mana?
Hapus image banner tsb

banner awal

Apabila pada awal sobat telah menyiapkan image banner sebagai penggantinya, beri nama yang sama misalnya banner.gif
Upload image banner tersebut pada folder tempat dimana image banner blog yang sobat hapus tadi berada

banner update

Kalau proses upload sudah selesai, tunggu beberapa menit
Coba lihat hasilnya di blog sahabat yang pernah bertukar banner

Kalau masih belum berubah, tunggu dan refresh beberapa kali
Selesai.., "Banner Blog" sobat sudah berubah.

Selamat mencoba dan semoga bermanfa'at!

Auto Read More Tanpa Gambar Pada Home Page

Di antara sobat blogger mungkin sudah pada tahu kegunaan dan fungsi dari Read More. Ya.. Coba saja bayangkan kalau kita tidak meng-cut atau memenggal kalimat setiap postingan pada bagian Home Page, untuk 2 atau 3 postingan saja pada bagian home page pasti sudah terlalu memanjang ke bawah. Untuk itu maka kita perlu memenggal kalimat tersebut baik secara manual (kita pasang pada setiap postingan) atau dengan memakai script Auto Read More yang sekarang sudah banyak melengkapi template blog.

Biasanya pada script auto read more yang sekarang ini mampu menampilkan image pertama pada postingan dan mem-float image di awal paragraf, meskipun image tersebut berada di tengah atau di akhir postingan maka akan di tampilkan di home page.
Dengan panduan beberapa sumber inspirasi, pada kesempatan kali ini saya mencoba merubah / menambahkan kode pada script Auto Read More tersebut agar sebaliknya image pada postingan tidak muncul pada Home Page. Kenapa..? Mungkin sedikit penyesuaian saja pada template blog ini dan saya menginginkan temanya seperti itu, juga lebih kepada untuk mengurangi beban loading blog.

Script Auto Read More yang biasa kita pakaian salah satunya adalah seperti di bawah ini:

<script type='text/javascript'>
var thumbnail_mode = &quot;float&quot; ;
summary_noimg = 250;
summary_img = 250;
img_thumb_height = 120;
img_thumb_width = 120;
</script>
<script type='text/javascript'>
//<![CDATA[
/******************************************
Auto-readmore link script, version 2.0 (for blogspot)
(C)2008 by Anhvo
visit http://en.vietwebguide.com to get more cool hacks
********************************************/
function removeHtmlTag(b,a){if(b.indexOf("<")!=-1){var d=b.split("<");for(var c=0;c<d.length;c++){if(d[c].indexOf(">")!=-1){d[c]=d[c].substring(d[c].indexOf(">")+1,d[c].length)}}b=d.join("")}a=(a<b.length-1)?a:b.length-2;while(b.charAt(a-1)!=" "&&b.indexOf(" ",a)!=-1){a++}b=b.substring(0,a-1);return b+"..."}function createSummaryAndThumb(d){var f=document.getElementById(d);var a="";var b=f.getElementsByTagName("img");var e=summary_noimg;if(b.length>=1){a='<span style="float:left; padding:0px 10px 5px 0px;"><img src="'+b[0].src+'" width="'+img_thumb_width+'px" height="'+img_thumb_height+'px"/></span>';e=summary_img}var c=a+"<div>"+removeHtmlTag(f.innerHTML,e)+"</div>";f.innerHTML=c};
//]]>
</script>

Script Auto Readmore yang telah ditambahkan kode untuk men-disable image:

<script type='text/javascript'>
var thumbnail_mode = &quot;float&quot; ;
summary_noimg = 250;
summary_img = 250;
img_thumb_height = 120;
img_thumb_width = 120;
</script>
<script type='text/javascript'>
//<![CDATA[
/******************************************
Auto-readmore link script, version 2.0 (for blogspot)
(C)2008 by Anhvo
visit http://en.vietwebguide.com to get more cool hacks
********************************************/
function removeHtmlTag(b,a){if(b.indexOf("<")!=-1){var d=b.split("<");for(var c=0;c<d.length;c++){if(d[c].indexOf(">")!=-1){d[c]=d[c].substring(d[c].indexOf(">")+1,d[c].length)}}b=d.join("")}a=(a<b.length-1)?a:b.length-2;while(b.charAt(a-1)!=" "&&b.indexOf(" ",a)!=-1){a++}b=b.substring(0,a-1);return b+"..."}function createSummaryAndThumb(d){var f=document.getElementById(d);var a="";var b=f.getElementsByTagName("img");var e=summary_noimg;if(b.length>=1){a='<span style="float:left; padding:0px 10px 5px 0px;visibility:hidden;display:none"><img src="'+b[0].src+'" width="'+img_thumb_width+'px" height="'+img_thumb_height+'px"/></span>';e=summary_img}var c=a+"<div>"+removeHtmlTag(f.innerHTML,e)+"</div>";f.innerHTML=c};
//]]>
</script>

Untuk sobat yang tertarik untuk mencobanya, sobat tinggal mengganti script Auto Read More yang telah ada pada template blog sobat dengan script Auto Read More yang ke-2 di atas atau menambahkan kode yang diblok pada script Auto Read More yang ke-2 di atas .

Semoga bermanfaat..!

New Popup Cbox Guestbook / Buku Tamu

cbox

Saat ini mungkin telah banyak kreasi-kreasi dari para bloger dengan memodifikasi tampilan guestbook / buku tamu. Selain bertujuan untuk mempercantik tampilan juga untuk memperhemat tempat pada halaman blog kita.

Pada kali ini saya coba berbagi sedikit kreasi yang mungkin adalah salah satu pengembangan dari sebuah code css pop up yang saya terapkan pada cbox untuk buku tamu / guestbook.

Caranya seperti biasa :

Login dulu ke bloger
Pilih Rancangan
Tambah gadget
Pilih HTML/Javascript
Copy paste code berikut :

<style>
label {position: relative;}
.box{
position:absolute;
left:0;top:100%;
z-index:100;
-webkit-backface-visibility:hidden;
background-color:#eee;
background:-webkit-gradient(
linear,left top,left bottom,from(#eee),to(#4f697e));
-webkit-linear-gradient(top,#eee,#4f697e);
background:-moz-linear-gradient(top,#eee,#4f697e);
background:-ms-linear-gradient(top,#eee,#4f697e);
background:-o-linear-gradient(top,#eee,#4f697e);
-moz-border-radius:6px;
-webkit-border-radius:6px;
border-radius:6px;
-moz-background-clip:padding;
-webkit-background-clip:padding-box;
background-clip:padding-box;
width:270px;
padding:3px;
margin:10px 0;
opacity:0;
-webkit-transform:scale(0) skew(50deg);
-moz-transform:scale(0) skew(50deg);
-ms-transform:scale(0) skew(50deg);
-o-transform:scale(0) skew(50deg);
-webkit-transform-origin:0 -30px;
-moz-transform-origin:0 -30px;
-ms-transform-origin:0 -30px;
-o-transform-origin:0 -30px;
-webkit-transition:-webkit-transform ease-out .35s,opacity ease-out .4s;
-moz-transition:-moz-transform ease-out .35s,opacity ease-out .4s;
-ms-transition:-ms-transform ease-out .35s,opacity ease-out .4s;
-o-transition:-o-transform ease-out .35s,opacity ease-out .4s}
.box:after{
position:absolute;
bottom:100%;
left:30px;
border-bottom:20px solid #eee;
border-left:14px solid transparent;
border-right:14px solid transparent;
width:0;height:0}
.popUpControl:checked ~ label>
.box{
opacity:1;
-webkit-transform:scale(1) skew(0deg);
-moz-transform:scale(1) skew(0deg);
-ms-transform:scale(1) skew(0deg);
-o-transform:scale(1) skew(0deg)}
.popUpControl{display:none}
.button{
font-size:20px;
font-weight:bold;
padding:3px;
border:1px solid #4f697e;
-webkit-border-radius:5px;
-moz-border-radius:5px;
-o-border-radius:5px;
-ms-border-radius:5px;
border-radius:5px}
.button:hover{
font-size:20px;
font-weight:bold;
color:#B11B40;
margin:0;
padding:3px;
text-align:center;
border:1px solid #4f697e;
-webkit-border-radius:70px;
-moz-border-radius:70px;
-o-border-radius:70px;
-ms-border-radius:70px;
border-radius:70px;
-webkit-transition:all .6s ease-out;
-moz-transition:all .6s ease-out;
-o-transition:all .6s ease-out;transition:all .6s ease-out}
#cpbox:checked ~ label>span:first-child{display:none}
#cpbox:checked ~ label:before{content:"Terimakasih atas kunjungannya..!"}
</style>
<input type="checkbox" id="cpbox" class="popUpControl" />
<label for="cpbox" class="button">
<span>Guestbook!</span>
<span class="box">
<!-- BEGIN CBOX - www.cbox.ws -->
DI SINI KODE CBOX
<!-- END CBOX -->
</span></label>

Untuk code yang diblok, silakan disesuaikan.

Selamat mencoba, semoga bermanfaat..!

Menambahkan Style Pada Widget Popular Posts

Pada kali ini kita coba oprek template di bagian sidebar pada widget "Popular Post", di mana kita hanya memanfaatkan widget yang telah di sediakan oleh blogger dengan menambahkan sedikit style agar tampak lebih keren ditambah sentuhan efek hover.

Langkahnya seperti berikut :
Login dulu ke bloger
Pilih Rancangan - > Edit HTML
Cari kode ]]></b:skin>
Tambahkan style di bawah ini di atasnya:

.item-title{
background:#123456;
text-align:left;
border-radius:3px;
font-weight: bold;
}
.item-snippet{
padding:3px;
border:3px solid #4F697E;
-webkit-border-radius:5px;
-moz-border-radius:5px;
-o-border-radius:5px;
-ms-border-radius:5px;
border-radius:5px;
}
.item-snippet:hover{
margin:0px;
padding:3px;
text-align:center;
border:3px solid #4F697E;
-webkit-border-radius:70px;
-moz-border-radius:70px;
-o-border-radius:70px;
-ms-border-radius:70px;
border-radius:70px;
-webkit-transition:all 0.6s ease-out;
-moz-transition:all 0.6s ease-out;
-o-transition:all 0.6s ease-out;
transition:all 0.6s ease-out;
}

Save Template
Untuk warna background item-title bisa kita sesuaikan dengan template blog kita

Selamat mencoba, semoga bermanfaat..!

Cara Pasang Page Scroller Back to Top / Down Onmouseover

Tombol yang biasa kita sebut tombol "back to top" sering kali kita jumpai di website / blog, yang fungsinya untuk memudahkan para pembaca artikel untuk melihat kembali bagian awal halaman / atas yang biasanya terletak di sudut kiri atau kanan bawah blog.

Pada kali ini saya akan mencoba berbagi tentang bagaimana cara memasang script "back to top" tersebut yang bukan hanya utuk scroll ke atas halaman saja, tetapi bisa secroll ke bawah juga dengan perlahan.

Script page scroller ini lumayan menarik juga, karena kita atau para pembaca cukup dengan menyentuh tombol ke atas / bawah yang terletak di sudut kanan bawah blog kita.

Untuk memasang script page scroller, seperti biasa kita Login dulu ke bloger - > Pilih Rancangan - > Edit HTML - > Copy script di bawah ini sebelum code </body>

<div id="staticbuttons" style="position:absolute;">
<a href="javascript:" onmouseover="myspeed=-thespeed" onmouseout="myspeed=0"><img
src="UrlGambar" border="0"></a><br>
<a href="javascript:" onmouseover="myspeed=thespeed" onmouseout="myspeed=0"><img
src="Urlgambar" border="0"></a>
</div>
<script>
//Page Scroller (aka custom scrollbar)- By Dynamic Drive
//For full source code and more DHTML scripts, visit http://www.dynamicdrive.com
//This credit MUST stay intact for use
var Hoffset=70 //Enter buttons' offset from right edge of window (adjust depending on images width)
var Voffset=80 //Enter buttons' offset from bottom edge of window (adjust depending on images height)
var thespeed=3 //Enter scroll speed in integer (Advised: 1-3)
var ieNOTopera=document.all&&navigator.userAgent.indexOf("Opera")==-1
var myspeed=0
var ieHoffset_extra=document.all? 15 : 0
var cross_obj=document.all? document.all.staticbuttons : document.getElementById? document.getElementById("staticbuttons") : document.staticbuttons
function iecompattest(){
return (document.compatMode && document.compatMode!="BackCompat")? document.documentElement : document.body
}
function positionit(){
var dsocleft=document.all? iecompattest().scrollLeft : pageXOffset
var dsoctop=document.all? iecompattest().scrollTop : pageYOffset
var window_width=ieNOTopera? iecompattest().clientWidth+ieHoffset_extra : window.innerWidth+ieHoffset_extra
var window_height=ieNOTopera? iecompattest().clientHeight : window.innerHeight

if (document.all||document.getElementById){
cross_obj.style.left=parseInt(dsocleft)+parseInt(window_width)-Hoffset+"px"
cross_obj.style.top=dsoctop+parseInt(window_height)-Voffset+"px"
}
else if (document.layers){
cross_obj.left=dsocleft+window_width-Hoffset
cross_obj.top=dsoctop+window_height-Voffset
}
}
function scrollwindow(){
window.scrollBy(0,myspeed)
}
function initializeIT(){
positionit()
if (myspeed!=0){
scrollwindow()
}
}
if (document.all||document.getElementById||document.layers)
setInterval("initializeIT()",20)
</script>

Silakan ganti UrlGambar dengan url gambar yang telah sobat siapkan.
Apabila menemui kesulitan dalam pemasangan script di atas, coba scriptnya di parse dulu di SINI .

Selamat mencoba, semoga bermanfaat..!

Cara Mengatasi Tombol Reply Treadh Comment Tidak Berfungsi

View Source

<script type='text/javascript'>
(function() {
var items = <data:post.commentJso/>;
var msgs = <data:post.commentMsgs/>;
var postId = &#39;<data:post.id/>&#39;;
var feed = &#39;<data:post.commentFeed/>&#39;;
var authorName = &#39;<data:post.author/>&#39;;
var authorUrl = &#39;<data:post.authorUrl/>&#39;;
var blogId = &#39;<data:top.id/>&#39;;
var baseUri = &#39;<data:post.commentBase/>&#39;;

// <![CDATA[
feed += '?alt=json&v=2&orderby=published&reverse=false&max-results=50';
var cursor = null;
if (items && items.length > 0) {
cursor = parseInt(items[items.length - 1].timestamp) + 1;
}

var bodyFromEntry = function(entry) {
if (entry.gd$extendedProperty) {
for (var k in entry.gd$extendedProperty) {
if (entry.gd$extendedProperty[k].name == 'blogger.contentRemoved') {
return '<span class="deleted-comment">' + entry.content.$t + '</span>';
}
}
}
return entry.content.$t;
}

var parse = function(data) {
cursor = null;
var comments = [];
if (data && data.feed && data.feed.entry) {
for (var i = 0, entry; entry = data.feed.entry[i]; i++) {
var comment = {};
// comment ID, parsed out of the original id format
var id = /blog-(d+).post-(d+)/.exec(entry.id.$t);
comment.id = id ? id[2] : null;
comment.body = bodyFromEntry(entry);
comment.timestamp = Date.parse(entry.published.$t) + '';
if (entry.author && entry.author.constructor === Array) {
var auth = entry.author[0];
if (auth) {
comment.author = {
name: (auth.name ? auth.name.$t : undefined),
profileUrl: (auth.uri ? auth.uri.$t : undefined),
avatarUrl: (auth.gd$image ? auth.gd$image.src : undefined)
};
}
}
if (entry.link) {
if (entry.link[2]) {
comment.link = comment.permalink = entry.link[2].href;
}
if (entry.link[3]) {
var pid = /.*comments/default/(d+)?.*/.exec(entry.link[3].href);
if (pid && pid[1]) {
comment.parentId = pid[1];
}
}
}
comment.deleteclass = 'item-control blog-admin';
if (entry.gd$extendedProperty) {
for (var k in entry.gd$extendedProperty) {
console.log(entry.gd$extendedProperty[k].name + ' - ' + entry.gd$extendedProperty[k].value);
if (entry.gd$extendedProperty[k].name == 'blogger.itemClass') {
comment.deleteclass += ' ' + entry.gd$extendedProperty[k].value;
}
}
}
comments.push(comment);
}
}
return comments;
};

var paginator = function(callback) {
if (hasMore()) {
var url = feed;
if (cursor) {
url += '&published-min=' + new Date(cursor).toISOString();
}
window.bloggercomments = function(data) {
var parsed = parse(data);
cursor = parsed.length < 50 ? null
: parseInt(parsed[parsed.length - 1].timestamp) + 1
callback(parsed);
window.bloggercomments = null;
}
url += '&callback=bloggercomments';
var script = document.createElement('script');
script.type = 'text/javascript';
script.src = url;
document.getElementsByTagName('head')[0].appendChild(script);
}
};
var hasMore = function() {
return !!cursor;
};
var getMeta = function(key, comment) {
if ('iswriter' == key) {
var matches = !!comment.author
&& comment.author.name == authorName
&& comment.author.profileUrl == authorUrl;
return matches ? 'true' : '';
} else if ('deletelink' == key) {
return baseUri + '/delete-comment.g?blogID=' + blogId + '&postID=' + comment.id;
} else if ('deleteclass' == key) {
return comment.deleteclass;
}
return '';
};

var replybox = null;
var replyUrlParts = null;
var replyParent = undefined;

var onReply = function(commentId, domId) {
if (replybox == null) {
// lazily cache replybox, and adjust to suit this style:
replybox = document.getElementById('comment-editor');
if (replybox != null) {
replybox.height = '250px';
replybox.style.display = 'block';
replyUrlParts = replybox.src.split('#');
}
}
if (replybox && (commentId !== replyParent)) {
document.getElementById(domId).insertBefore(replybox, null);
replybox.src = replyUrlParts[0]
+ (commentId ? '&parentID=' + commentId : '')
+ '#' + replyUrlParts[1];
replyParent = commentId;
}
};

var tok = 'comment-form_';
var hash = window.location.hash || '';
var startThread = hash.indexOf(tok) == 1 ? hash.substring(tok.length + 1) : undefined;

// Configure commenting API:
var configJso = {
'maxDepth': 2
};
var provider = {
'id': postId,
'data': items,
'loadNext': paginator,
'hasMore': hasMore,
'getMeta': getMeta,
'onReply': onReply,
'rendered': true,
'initReplyThread': startThread,
'config': configJso,
'messages': msgs
};

var render = function() {
if (window.goog && window.goog.comments) {
var holder = document.getElementById('comment-holder');
window.goog.comments.render(holder, provider);
}
};

// render now, or queue to render when library loads:
if (window.goog && window.goog.comments) {
render();
} else {
window.goog = window.goog || {};
window.goog.comments = window.goog.comments || {};
window.goog.comments.loadQueue = window.goog.comments.loadQueue || [];
window.goog.comments.loadQueue.push(render);
}
})();
// ]]>
</script>

Cara Membuat Halaman Untuk Followers

Pada postingan kali ini mungkin adalah cara atau hal yang tidak terlalu penting banget "kaya gak ada kerjaan saja..?!"

Mengingat demi kenyamanan para pengunjung yang datang ke blog kita, salah satu cara yang saya lakukan adalah dengan mengurangi beban pada loading blog.

Banyaknya gadget yang kita pasang, maka semakin berat beban loading blog kita dan salah satunya yang sering saya rasakan pada saat mengunjungi sahabat blog adalah gadget "Followers". Maka saya berkesimpulan dan mengambil tindakan untuk membuat sebuah halaman untuk gadget follower.

Sedikit kendala yang saya alami pada saat ingin mendapatkan code untuk gadget follower, karena pada saat mengunjungi google friendconnect sudah tidak ada "rupanya ketinggalan inforamsi" tentang layanan google friendconnect, padahal pada waktu itu (dulu..)saya sempat menggunakan beberapa gadget dari google friendconnect.

Mungpung masih sore ni..dan masih ada kopi sisa plus sebatang rokok, kita langsung saja ikuti caranya:

Klik kanan pada template blog kita
Pilih "View Page Source"

Kalau misalnya gadget follower yang ada pada blog kita beri nama "Followers", maka cari kode <h2 class='title'>Followers</h2> (gunakan F2 atau Ctrl+F untuk mempermudah pencarian)

Scroll terus ke bawah sampai menemukan kode seperti pada gambar :

Kode pada gambar di atas adalah script dari gadget follower blog kita yang akan kita pindahkan ke halaman
Yang digaris merah adalah ID follower blog kita, sebagai contoh yang saya dapatkan kode script gadget follower pada template blog ini adalah seperti di bawah :

<script src="http://www.google.com/friendconnect/script/friendconnect.js" type="text/javascript">
</script>
<div id="div-7cugsvcv9pli" style="width: 100%;">
</div>
<script type="text/javascript">
var skin = {};
skin['FACE_SIZE'] = '32';
skin['HEIGHT'] = "260";
skin['TITLE'] = "Followers";
skin['BORDER_COLOR'] = "transparent";
skin['ENDCAP_BG_COLOR'] = "transparent";
skin['ENDCAP_TEXT_COLOR'] = "#000000";
skin['ENDCAP_LINK_COLOR'] = "#000000";
skin['ALTERNATE_BG_COLOR'] = "transparent";    
skin['CONTENT_BG_COLOR'] = "transparent";
skin['CONTENT_LINK_COLOR'] = "#000000";
skin['CONTENT_TEXT_COLOR'] = "#000000";
skin['CONTENT_SECONDARY_LINK_COLOR'] = "#FFFFFF";
skin['CONTENT_SECONDARY_TEXT_COLOR'] = "#000000";
skin['CONTENT_HEADLINE_COLOR'] = "#000000";
skin['FONT_FACE'] = "Arial";
google.friendconnect.container.setParentUrl("/");
google.friendconnect.container["renderMembersGadget"](
{id: "div-7cugsvcv9pli",
height: 260,         
site: "02061793851714173416",     
locale: 'en_GB' },
skin);
</script>

Buat sebuah halaman / page atau entri baru
Copy Paste kode di atas
Ganti kode ID dengan ID follower blog sobat yang telah sobat dapatkan tadi
Bila gadget follower kita pasang dengan cara menambahkan entri / posting baru, saya sarankan agar tanggal, bulan atau tahunnya di atur manual agar tidak tampil pada halaman depan.

"TERBITKAN ENTRI"
Lihat halaman, bagaimana hasilnya?

Selamat mencoba..!

Cara Pasang Fans Page Google Plus di Blog

Fans page Google Plus (Google+) adalah salah satu fitur yang disediakan oleh google+ yang mungkin terbilang masih baru yang saya ketahui.

Untuk membuat halaman fans page yang ada di google plus sama halnya dengan kita membuat halaman fans page di facebook, caranya tidak terlalu sulit dan bisa selesai dalam beberapa menit saja.

Cara membuat Laman fans Page

Login https://plus.google.com

Scroll ke bawah, letakan kursor pada menu "Lainnya"

Pilih Laman

Pilih Kategori halaman untuk fans page atau pilih "Lainnya"

Isi Judul untuk halaman fans page dan masukan url blog

Pilih dan sesuaikan konten yang akan terlihat secara publik

Centang kotak menyetujui ketentuan halaman

Klik "Buat"

Isi sesuai konten halaman fans page

Untuk icon fans page mungkin bisa sobat ganti dengan yang kita inginkan

Klik "Lanjut"

Sampai di sini proses pembuatan halaman fans page google plus sudah selesai.

Pasang Script Fans Page di Blog

Kunjungi https://developers.google.com/+/plugins/badge/personal-confige

Masukan ID Fans Page Google Plus yang telah kita buat tadi pada kotak "Enter a Google+ profile ID:"

Kita akan mendapatkan 2 buah kode script seperti gambar di bawah

Kode di bawah ini taruh di atas kode </head>

<!-- Place this tag in the <head> of your document -->
<script type='text/javascript'>
window.___gcfg = {lang: 'id'};
(function() 
{var po = document.createElement("script");
po.type = "text/javascript"; po.async = true;po.src = "https://apis.google.com/js/plusone.js";
var s = document.getElementsByTagName("script")[0];
s.parentNode.insertBefore(po, s);
})();</script>

Dan untuk kode di bawah tambah gadget baru, ganti ID Fans Page dengan ID Fans Page sobat dan sesuaikan ukuran width / height

<!-- Place this tag where you want the badge to render-->
<g:plus href="https://plus.google.com/103775864874451686959" rel="author" width="300" height="69"></g:plus>

Login ke blogger

Pilih Rancangan -> Edit HTML

Copy paste code no. 1 pada gambar di atas, di atas kode </head>

Tambah Gadget -> HTML Javascript, copy paste code no. 2 seperti gambar di atas.

Selamat Mencoba..!!

Cara Claim Blog di Technorati

Di antara sobat- sobat tentunya sudah banyak yang tau apa manfaat dari mendaftarkan blog kita di Technorati.com. Ya, setelah baca-baca dari beberapa sumber tentang Technorati, setelah kita mendaftar dan menjadi salah satu anggota di Technorati dengan mendapatkan kode unik seperti 6VCQNRNW5FHN, blog kita akan dishare dan akan mendapatkan backlink gratis sebanyak postingan yang ada pada blog kita. Dan yang lebih penting tentunya akan meningkatkan page rank blog kita.
Baik, kita langsung pada isi dari judul posting kali ini caranya:

Kunjungi Technorati.com
Login / Register
Klik profil kita pada sudut kanan atas seperti gambar di bawah:

Scroll ke bawah sampai menemukan kotak seperti ini:

Technorati

Silakan isi dengan Url blog sobat pada kotak"Proceed to the next step"
Isikan data blog sobat, contoh di sini saya menggunakan blogspot
http://urlblog/feeds/posts/default
Klik "Claim"

Technorati

Technorati

Klik "Return to profile"

Klik "Cek Claim"

Kita akan mendapatkan kode unik (unique code) seperti pada gambar di bawah yang saya dapatkan untuk blog ini: 6VCQNRNW5FHN
blog : http://cpakank.blogspot.com
Buatlah terlebih dahulu sebuah posting yang memuat kode claim yang diberikan oleh technorati yang contohnya seperti ini: 6VCQNRNW5FHN di blog kita
Kalau postingan sudah selesai, klik"Verify Claim Token"

Selesai, tunggu prosess dan cek inbox email yang kita pakai pada saat mendaftar.

Pastikan mendapatkan pesan seperti ini bila berhasil

Untuk sobat yang baru ingin mencoba mendaftar di technorati.com , jangan lupa siapkan dulu sebuah postingan / artikel review tentang technorati dan di dalam artikel tersebut harus memuat kode claim yang diberikan oleh technorati seperti ini: 6VCQNRNW5FHN.
Selamat mencoba..!

Mengatasi Laman Yang Tidak Bisa Dibuka Setelah Memasang Autoreadmore

Berbagai alasan kita untuk mengganti template blog, namun yang jelas bagi saya bukanlah hal yang mudah dan gampang.

Contoh masalah yang saya alami pada saat mengganti template blog yang baru adalah pemasangan Auto Readmore, dimana page / laman yang telah saya buat sewaktu memakai tamplate yang lama tidak mau muncul alias tidak bisa dibuka "Puyeeeng..!". Cari-cari di google, semua kode yang diposting sama dengan yang biasa saya pasang, jadi gimana ni.. apa perlu coba ganti template dengan yang lain..?!"

Untunglah dengan cara googling dan mengunjungi beberapa situs / blog sahabat, masalah ini dapat terpecahkan "Legaaa..!".

Coba kita lihat, pemasangan Auto Readmore yang biasa kita pasang kurang lebih kodenya seperti di bawah:

<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'><a background='transparent' expr:href='data:post.url'>Read More...</a></span>
</b:if>
<b:if cond='data:blog.pageType == &quot;item&quot;'><data:post.body/></b:if>

Tetapi ternyata kode tersebut tidak cocok dengan template yang baru, beberapa code harus kita tambahkan atau kita ganti saja kode tersebut dengan kode ini :

<b:if cond='data:blog.pageType != &quot;item&quot;'>
<b:if cond='data:blog.pageType != &quot;static_page&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'><a expr:href='data:post.url'>Read more..< a></span>
</b:if>
</b:if>
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<data:post.body/></b:if>
<b:if cond='data:blog.pageType == &quot;static_page&quot;'><data:post.body/></b:if>

Apabila sobat mengalami hal serupa pada template blog sobat, silakan coba cara ini.

Compress CSS Template Mengurangi Beban Loading Blog

Banyak cara untuk mengurangi beban loading blog, salah satunya yang akan kita bahas kali ini adalah dengan cara online menggunakan jasa web csscompressor .
Untuk mengetahui seberapa berat loading blog kita, silakan kunjungi website speed test, dan untuk standar ukuran berat blog mungkin untuk sementara sobat bisa cari tau lewat google, yang jelas hasil dari website speed test contohnya akan seperti ini:

Cara kompres css template :

Kunjungi www.csscompressor.com
Login ke blogger
Rancangan -> Edit HTML
Untuk menghindari hal yang tidak diinginkan, download dulu template blog sobat
Blok dan copy style css template yang terletak diantara kode <b:skin><![CDATA[/* sampai dengan kode ]]></b:skin>
Paste / Ctrl+V kode CSS tadi pada kotak yang disediakan seperti pada gambar di bawah
Klik Compress, tunggu proses.

Setelah proses selesai, maka hasilnya akan tampak pada kotak seperti gambar di bawah

Pada kotak yang kedua klik Select All
Copy / Ctrl+C hasil dari proses compress
Kembali ke HTML template blog kita, paste atau ganti code css sebelumnya yang terletak diantara <b:skin><![CDATA[/* sampai dengan kode ]]></b:skin> dengan hasil proses kompresan.
Save Template

Kalau sobat penasaran dengan perubahan beban berat loading blog yang sekarang, silakan kembali test melalui website speed test.
Untuk sementara ini, hanya sobatlah yang bisa merasakan perubahan dari hasil kompresan tersebut.

Selamat mencoba, semoga bermanfaat..!

Blogger Template Black Transparent

Setelah melalui beberapa proses, untuk sementara berhenti sampai di sini dulu mengubrak-abrik template blog.
Dan hasilnya, yaa.. seperti ini!

Klik gambar untuk memperbesar

Lumayan lach buat blogger pemula seperti saya yang hanya bermodalkan kemauan dan banyak ketidak tahuan, sudah cukup merasa bangga dengan hasil seperti ini, kayanya enggak terlalu acak-acakan and amburaduul..!

Template ini saya kasih nama "Black Transparent"" yang terinspirasi dari para senior yang telah memberikan banyak pelajaran tentang dunia blogger.

Bebrapa perubahan dari template aslinya :
Auto readmore
Box facebook like yang dipasang di atas poting
Related Post di bawah posting
Penyesuaian lebar kotak komentar
Tombol reply comment
dll

Template ini sengaja saya share buat sobat siapa saja, dengan harapan dapat memberikan komentar dan saran sebagai bahan evaluasi ke tahap perbaikan.

Ada beberapa hal yang perlu diperhatikan sebelum memakai template Black Transparent :

<?xml version="1.0" encoding="UTF-8" ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html expr:dir='data:blog.languageDirection' xmlns='http://www.w3.org/1999/xhtml' xmlns:b='http://www.google.com/2005/gml/b' xmlns:data='http://www.google.com/2005/gml/data' xmlns:expr='http://www.google.com/2005/gml/expr' xmlns:fb='http://www.facebook.com/2008/fbml'> <head>
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<title><data:blog.pageName/> | <data:blog.title/></title>
<b:else/><title><data:blog.pageTitle/></title> </b:if>
<link href='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi-HpC-9HdtyXQ_MH5Vmn1HW9oosdhUnTqWytYjQq1zzy1gJY-lBMr7pXXOybSBCUyrW47HQ-Jez6VQQ7n6IR3-1dzfoZ2WmGhRkrgvXaoo6o8m518I0IirMWJldMnr-dtqQzeD5FR6raOC/s1600/globe_11.gif'rel='shortcut icon' type='image/x-icon'/>
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<meta expr:content='data:blog.pageTitle' property='og:title'/>
<meta expr:content='data:blog.url' property='og:url'/> <b:else/>
<meta expr:content='data:blog.title' property='og:title'/>
<meta expr:content='data:blog.homepageUrl' property='og:url'/> </b:if>
<meta content='sitename' property='og:site_name'/>
<meta content='http://google.com/help/hc/images/logos/blogger_logo.gif' property='og:image'/>
<meta content='APP_ID' property='fb:app_id'/> <meta content='FB_ID' property='fb:admins'/>
<meta content='Blogger' property='og:type'/> <b:skin><![CDATA[
/* --------------------------------------
Black Transparent
Cpakank Blog
http://cpakank.blogspot.com
---------------------------------------- */
/* **** START OF CSS STYLING **** */
body {
background:#000;
background-attachment:fixed;
color:#999;
font-family:Tahoma;
font-size:12px;
margin:0;
padding:0;
} 
#outer-wrapper{
margin:0px auto 15px;
padding:0;
position:relative;
text-align:center;
width:100%;
} 
#blog-wrapper{
border:1px solid #666;
margin:2px auto;
padding:7px;
position:relative;
text-align:center;
width:800px
} 
#spacer{
clear:both;
margin:0;
padding:0;
} 
a:link{
color:#39F;
text-decoration:none
} 
a:visited{
color:#246BB2;
text-decoration:none
} 
a:hover{
color:#5FAFFF;
text-decoration:none
} 
#header-wrapper{
background:#ffff;
background-image:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhD9YcFv8lFrGrTsMnhYZcFLTLq2cNt-GkazX_FepGqXjmnOMnRk20xHU9MnEpGxSFkIlFK2dSFmKmLUj6mIodxzBzTCSGAMKJ9iF2mOK-Ft5moNCoMLa9Efiln-xP0KWWg77i1HRwfs290/s1600/HDR.png);
height:100px;
margin:0 auto;
width:798px
}
-----------------------------------------------------------------------------------------------------  
<body> 
<div id='fb-root'/>
<script> window.fbAsyncInit = function() { FB.init({ appId : &#39;APP_ID&#39;, status : true, // check login status cookie : true, // enable cookies to allow the server to access the session xfbml : true // parse XFBML }); }; (function() { var e = document.createElement(&#39;script&#39;); e.src = document.location.protocol + &#39;//connect.facebook.net/en_US/all.js&#39;; e.async = true; document.getElementById(&#39;fb-root&#39;).appendChild(e); }()); <fb:comments/> </script>

Copy paste script di bawah ini tepat di bawah code <div class='post-footer-line post-footer-line-3'>

<b:if cond='data:blog.pageType == &quot;item&quot;'>
<div class='fb-comments' data-num-posts='10' data-width='450'expr:data-href='data:post.url'/>
</b:if>

Buat sobat yang tertarik untuk mencoba template ini, silakan download link di bawah!

Download Blogger Template Black Transparent.rar (12.9Kb)

"Sebelum menggunakan template Black Transparent, alangkah baiknya sobat untuk download dulu template sobat!"

Selamat Mencoba..!

Menampilkan Gambar di Pojok Kanan Atas Blog

Cara- caranya sangat mudah dan simple, seperti kita mau mengedit template blog kita :

1. Login Blogger
2. Masuk ke dasbor blog
3. Klik pada tulisan template

4. Setelah terbuka jendela template klik Edit HTML

5. Klik Lanjut

6. Cari code ]]></b:skin, untuk mempermudah pencarian gunakan Ctrl+F

7. Taruh Sctip di bawah ini tepat di bawah kode ]]></b:skin

<script language='JavaScript' src='http://cp-akank.googlecode.com/files/gmbr.js' type='text/javascript'> </script> <script language='JavaScript' type='text/javascript'> cpakank("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhKV970C7QpEDiHSWdpfJOKR0g9qC7-XzC-irywY8v0WvgXyVn20SDmrELzCDkkbb8jIyP4muSBH5UF1OanTwUI7YNZxe-2UM0rF6n_mwvCW9tFRcGnQTCxHpqz5fGupohH1dFwWO8QmJTM/s1600/banera.gif")</script>

8. Dan yang terakhir Save template, refresh blog.

"Ganti URL image yang berwarna merah dengan URL image sobat yang telah dipersiapkan"

Selamat mencoba..!

SCRIPT TOMBOL WARNA BACKGROUND

Terkadang kita bosan dengan warna background blog atau mungkin pengunjung blog pun kurang nyaman dengan warna dari background blog yang kita pilih. Nah.. kita pasang script ini biar sewaktu-waktu enggak perlu repot-repot mengedit template blog dan pengunjung pun tinggal memilih warna mana yang nyaman.
Tampilan dari hasil script tersebut seperti di bawah ini :

Copy script:

<script type="text/javascript">function bgChange(bg)<br />{<br />document.body.style.background=bg;<br />}</script><table border="1" width="400" height="20<script type="text/javascript">
function bgChange(bg)
{
document.body.style.background=bg;
}
</script>
<table border="1" width="400" height="20">
<tr> <td
onclick="bgChange('#FFFFFF')" bgcolor="white">
<td
onclick="bgChange('#000000')" bgcolor="#000000">
<td
onclick="bgChange('#F0E68C')" bgcolor="#F0E68C">
<td
onclick="bgChange('#E0FFFF')" bgcolor="#E0FFFF">
<td
onclick="bgChange('#98FB98')" bgcolor="#98FB98">
<td
onclick="bgChange('#FA0D18')" bgcolor="#FA0D18">
<td
onclick="bgChange('#87CEFA')" bgcolor="#87CEFA">
<td
onclick="bgChange('#FFDAB9')" bgcolor="#FFDAB9">
<td
onclick="bgChange('#FFC0CB')" bgcolor="#FFC0CB">
<td
onclick="bgChange('#E6E6FA')" bgcolor="#E6E6FA">
<td
onclick="bgChange('#0C10F3')" bgcolor="#0C10F3">
</td
></td
></td
></td
></td
></td
></td
></td
></td
></td
></td
></tr>
</table>

Ganti dan sesuaikan teks yang berwarna merah dengan ukuran yang sesuai dengan gadget blog sobat.

Selamat Mencoba!

Auto Read More Template Blog

Template bawaan dari blogspot ternyata banyak pilihan dan lumayan bagus-bagus dan keren, apa lagi kalau kita mau sedikit mengutak-atik tampilan atau warna yang sesuai dengan selera kita. Namun sayangnya template - template tersebut belum memakai auto readmore, jadi setiap postingan harus dipenggal secara manual.

Dari hasil googling / blognya para senior akhirnya aku temukan code script yang pemasangannya sebagai berikut:

Log in Akun Bloger
Pilih Template -> Edit HTML
Centang pada kotak expand widget
Cari kode </head> (untuk mempermudah pencarian gunakan Crtl+F atau F3)
Copy Paste kode di bawah ini tepat di atas kode </head>

<script type='text/javascript'>
var thumbnail_mode = "float" ;
summary_noimg = 160;
summary_img = 260;
img_thumb_height = 90;
img_thumb_width = 90;
</script>
<script type='text/javascript'> 
//<![CDATA[ /
******************************************
Auto-readmore link script, version 2.0 (for blogspot)  (C)2008 by Anhvo  visit http://en.vietwebguide.com to get more cool hacks ********************************************/
function removeHtmlTag(strx,chop){ if(strx.indexOf("<")!=-1) { var s = strx.split("<"); for(var i=0;i<s.length;i++){ if(s[i].indexOf(">")!=-1){ s[i] = s[i].substring(s[i].indexOf(">")+1,s[i].length); } } strx = s.join(""); } chop = (chop < strx.length-1) ? chop : strx.length-2; while(strx.charAt(chop-1)!=' ' && strx.indexOf(' ',chop)!=-1) chop++; strx = strx.substring(0,chop-1); return strx+'...'; }  function createSummaryAndThumb(pID){ var div = document.getElementById(pID); var imgtag = ""; var img = div.getElementsByTagName("img"); var summ = summary_noimg; if(img.length>=1) { imgtag = '<span style="float:left; padding:0px 10px 5px 0px;"><img src="'+img[0].src+'" width="'+img_thumb_width+'px" height="'+img_thumb_height+'px"/></span>'; summ = summary_img; }  var summary = imgtag + '<div>' + removeHtmlTag(div.innerHTML,summ) + '</div>'; div.innerHTML = summary; } //]]> </script>

Cari kode <data:post.body/> atau <p><data:post.body/></p> dan ganti 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'><a background='transparent' expr:href='data:post.url'>Read More...</a></span> </b:if> <b:if cond='data:blog.pageType == &quot;item&quot;'><data:post.body/></b:if>

Save Template.

Script Label Cloud

Script yang ini ternyata lebih mudah diterapkan/ pasang di blog kita, cukup dengan menambah gadget pada template blog dan copy paste kode script di bawah ini :

<script type="text/javascript"> /*<![CDATA[*/ var cpFlashLabelSettings = { blogurl       : "http://cpakank.blogspot.com/", /* alamat blog sobat */ color          : "ffffff", /* warna link menu  */ hoverColor     : "f00f00", /* hover link menu */ backgroundColor: "FFFFFF", /*  background */ size           : 10, /* ukuran font */ speed         : 100, /* kecepatan animasi */ width          : 180, /* lebar label cloud animasi */ height         : 200 /* tinggi label cloud animasi */ }; /*]]>*/ </script> <script src="http://my-label-cumulus.googlecode.com/files/cumulus.js" type="text/javascript"> </script>

Ganti text yang berwarna merah dengan alamat blog sobat
Text yang berwarna biru adalah ukuran lebar/ tinggi, bisa diganti atau disesuaikan dengan ukurun gadget blog
Refresh blog
Lihat hasilnya

Selamat mencoba..!

Cara Pasang Kotak Komentar FB di Blog

Untuk membuat kotak komentar facebook di blog, langkah pertama yang harus kita persiapkan adalah menbuat aplikasi facebook untuk mendapatkan app ID facebook dan tentunya kita harus mengetahui ID profile facebook kita.

Setelah langkah pertama dipersiapkan, maka kita tinggal memasukan script pada template blog.

1. Login dengan akun blogger
2. Pilih Template -> Edit HTML -> Lanjut -> Centang pada kotak

   Expand Widget Template
3. Cari Code <html (gunakan Ctrl+F untuk mempermudah pencarian)
4. Tambahkan code xmlns:fb='http://www.facebook.com/2008/fbml'

   setelah code <html atau ditaruh paling akhir juga bisa, setelah code

   xmlns:expr='http://www.google.com/2005/gml/expr' di sini>

<b:if cond='data:blog.pageType == "item"'> <meta expr:content='data:blog.pageTitle' property='og:title'/> <meta expr:content='data:blog.url' property='og:url'/> <b:else/> <meta expr:content='data:blog.title' property='og:title'/> <meta expr:content='data:blog.homepageUrl' property='og:url'/> </b:if> <meta content='nama_blog' property='og:site_name'/> <meta content='http://google.com/help/hc/images/logos/blogger_logo.gif' property='og:image'/> <meta content='app_ID' property='fb:app_id'/> <meta content='ID_profile_fb' property='fb:admins'/> <meta content='article' property='og:type'/>

6. Cari code <body>, letakan code di bawah ini setelah code <body>

<div id="fb-root"></div> <script> window.fbAsyncInit = function() { FB.init({ appId : 'app_ID', status : true, // check login status cookie : true, // enable cookies to allow the server to access the session xfbml : true // parse XFBML }); }; (function() { var e = document.createElement('script'); e.src = document.location.protocol + '//connect.facebook.net/en_US/all.js'; e.async = true; document.getElementById('fb-root').appendChild(e); }()); <fb:comments/> </script>

7. Cari kode <div class='post-footer-line post-footer-line-3'> dan letakan code

   dibawah ini tepat di bawah code

   <div class='post-footer-line post-footer-line-3'>

<b:if cond='data:blog.pageType == "item"'> <div class='fb-comments' data-num-posts='10' data-width='450' expr:data-href='data:post.url'/> </b:if>

8. Dan yang terakhir Save template.

Cara Pasang Tab View Menu di Sidebar

Mengingat banyaknya gadget yang harus dipasang di blog kita, maka cara ini mungkin lebih cocok untuk kita terapkan agar tidak terlalu menyita tempat pada sidebar blog. Caranya sangat simple dan tidak terlalu banyak menggunakan script yang akan menambah beban template blog kita.
Caranya :

Login ke blogger
Pilih Rancangan -> Page Element
Tambah Gadget -> HTML Javascript
Copy paste code script di bawah ini :

<style type="text/css">
div.TabView div.Tabs a
{
float: left;
display: block;
width: 80px; /* Lebar Kotak Tab */
height: 20px; /* Tinggi Menu Utama Atas */
text-align: center; /* Posisi Teks Menu Tab */
margin: 5px 0px 0px 3px; /* Posisi Kotak Tab */
background-color: #87CEFA; /* Warna background Kotak Tab */
padding-top: 2px; /* Spasi Atas */
border: 1px solid #ffffff; /* Warna border kotak Tab */
border-bottom: 1px solid #ccc; /*Warna border bawah kotak tab */
font-family: "Arial, Helvetica, sans-serif", Arial; /* Font Kotak Tab */
font-weight: 900; /* Ketebalan Teks kotak tab */
}
div.TabView div.Tabs a:hover, div.TabView div.Tabs a.Active
{
background:transparent); /* Warna background utama kotak tab */
}
div.TabView div.Pages
{
clear: both;
border: 0px solid #cccccc; /* Warna border Kotak Konten */
overflow: hidden;
background:rgba(255,255,255,0.4); /* Warna background Kotak konten */
}
div.TabView div.Pages div.Page
{
height: 100%;
padding: 5px; /* Jarak teks dalam kotak content */
overflow: hidden;
}
div.TabView div.Pages div.Page div.Pad
{
padding: 3px 5px;
}
</style>
<form action="tabview.html" method="get">
<div id="TabView" class="TabView">
<div style="width: 305px;" class="Tabs">
<a><span style="color:white">MENU 1</span></a>
<a><span style="color:white">MENU 2</span></a>
<a><span style="color:white">MENU 3</span></a>
</div>
<div style="width: 300px; float:center; height: 200px;" class="Pages">
<div class="Page">
<div class="Pad">
ISI MENU 1 DI SINI
</div>
</div>
<div class="Page">
<div class="Pad">
ISI MENU 2 DI SINI
</div>
</div>
<div class="Page">
<div class="Pad">
ISI MENU 3 DI SINI
</div>
</div>
</div></div></form>
<script style="text/javascript" src="http://cpakank.googlecode.com/files/tab_view.js"></script>
<script type="text/javascript">tabview_initialize('TabView');</script>

Save Gadget
Selesai

Untuk ukuran wide dan height silakan ganti dan sesuaikan dengan gadget blog sobat.

"Selamat mencoba, semoga bermanfaat!"

Cara Membuat Sitemap Berdasarkan Label

<script src="http://www.cpakank.blogspot.com/feeds/posts/summary?max-results=9999&amp;alt=json-in-script&amp;callback=loadtoc">
</script>

Cara Membuat Sitemap Automatis Blog

Cara membuat daftar isi otomatis dengan script sitemap:

Login dengan akun blogger
Buat entri baru / halaman baru
Klik Edit HTML
Copy paste kode di bawah ini :

<script src="http://cpakank.googlecode.com/files/sitemap.js">
</script> <script src="http://cpakank.blogspot.com/feeds/posts/default?max-results=500&amp;alt=json-in-script&amp;callback=loadtoc">
</script>

Ganti text berwarna merah dengan Url sobat
Klik Terbitkan Entri

Selamat mencoba!