Showing posts with label blogger. Show all posts
Showing posts with label blogger. Show all posts

Monday, September 9, 2013

Mengatasi Tombol Balas/Replay Yang Tidak Berfungsi

Selamat pagi semuanya sobat KID, kali ini saya akan coba share ilmu yang baru saya dapatkan dari si "Mbah" alias www.google.com. Yapp,,, disitu emang banya banget ilmu yang bisa kita dapatkan baik ilmu pelajaran maupun ilmu umum lainnya. Mungkin emang ini udah ilmu lama atau bisa juga dibilang tua banget, tapi maklum aja sobat, baru pertama kena masalah gini makanya saya baru aja dapet ilmu ini., :D
Mungkin dari kalian semua sudah pernah atau bahkan juga baru mendapatkan masalah yang sama seperti saya ini. Yap, beberapa template blogger dari sobat sekalian kadang bermasalah dengan tombol replay yang ada dibawah komentar pengunjung. Tombol replay yang seharusnya bisa di-klik dengan tujuan untuk membalas komentar dari pengunjung kita malah tidak berfungsi, alias tidak melakukan tugasnya dengan baik dan benar.
Oke, sobat KID akan saya paparkan bagaimana cara mengatasi masalah tersebut,,, Check it Out...

1. Masuk ke Dasbor ---> Rancangan ---> Edit HTML
2. Menjaga kegagalan, backup dulu template anda ---> Download Template Lengkap
3. Centang Expand Template Widget
4. Cari kode dibawah ini :
Klik Untuk Melihat
<b:includable id='threaded_comment_js' var='post'>
  <script defer='defer' expr:src='data:post.commentSrc' type='text/javascript'/>

  <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>
</b:includable>
5. Ganti semuanya dengan kode dibawah ini :
Klik Untuk Melihat
<b:includable id='threaded_comment_js' var='post'>
  <script async='async' expr:src='data:post.commentSrc' type='text/javascript'/>

  <script type='text/javascript'>
    (function() {
      var items = <data:post.commentJso/>;
      var msgs = <data:post.commentMsgs/>;
      var config = <data:post.commentConfig/>;

// <![CDATA[
      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) {
                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 = config.feed + '?alt=json&v=2&orderby=published&reverse=false&max-results=50';
          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 == config.authorName
              && comment.author.profileUrl == config.authorUrl;
          return matches ? 'true' : '';
        } else if ('deletelink' == key) {
          return config.baseUri + '/delete-comment.g?blogID='
               + config.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 hash = (window.location.hash || '#').substring(1);
      var startThread, targetComment;
      if (/^comment-form_/.test(hash)) {
        startThread = hash.substring('comment-form_'.length);
      } else if (/^c[0-9]+$/.test(hash)) {
        targetComment = hash.substring(1);
      }

      // Configure commenting API:
      var configJso = {
        'maxDepth': config.maxThreadDepth
      };
      var provider = {
        'id': config.postId,
        'data': items,
        'loadNext': paginator,
        'hasMore': hasMore,
        'getMeta': getMeta,
        'onReply': onReply,
        'rendered': true,
        'initComment': targetComment,
        '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>
</b:includable>
6. Simpan template anda dan lihat hasilnya...

Sekian ilmu yang mungkin bermanfaat untuk kita semua, khususnya saya,. ^_^

Friday, August 23, 2013

Cara baru menghubungkan blog dengan fanspage facebook

Selamat sore sobat KID semua,. Ketuma lagi sama saya sore ini semoga dalam keadaan yang sehat walafiat., Amin., :)
Kali ini saya akan coba share ilmu yang sebenernya udah ada dari dulu tapi saya coba untuk post lagi siapa tau ada yang membutuhkan,. hehehe
Oke untuk informasi yang akan saya sampaikan sore ini sesuai dengan judul diatas dan saya dapat informasi ini dari tetangga juga,. Semoga bermanfaat sobat KID., ^_^

Step by Step
1. Yang pertama harus anda lakukan tentu saja “log in / masuk ke akun Facebook” anda
2. kemudian kunjungi alamat “RSS grafiti”
hxxp://beta.rssgraffiti.com
3. Setelah keluar halaman seperti dibawah ini, klik “Add New Publishing Plan”
 a Menghubungkan facebook dengan blog
4. Pada New Nama Publishing Plan, isi dengan Judul / nama blog anda. Kemudian tekan “Create Publishing Plan”
 Menghubungkan facebook dengan blog b
5. Setelah itu, Klik “Source” dan masukkan RSS blog anda yang ingin dibuatkan halaman penggemar FB
  Menghubungkan facebook dengan blog d  
6. Jika sudah selesai, biarkan saja pengaturan standard yang ada, anda hanya perlu Klik “save” langsung
Menghubungkan facebook dengan blog e
7. Setelah membuat “Source”, sekarang klik “Target ( Add New )”
8. Pilih halaman penggemar yang ingin anda buat sebagai rumah dari blog anda, kemudian tekan “Save”
 Menghubungkan facebook dengan blog f
9. Jika area “source” dan “Target “ sudah terisi dengan benar, sekarang geser tombol ditengah tengahnya, dari” OFF” menjadi “ON”
 Menghubungkan facebook dengan blog g
10. Ahirnya selesai sudah, tiap anda memposting halaman dalam blog, maka akan otomatis tersubmite dalam blog tersebut.

Sunday, August 19, 2012

Cara Membuat Iklan Melayang Di Atas Header Blog

Cara Membuat Iklan Melayang Di Atas Header Blog - Banyak cara untuk memasang iklan di blog, salah satunya dengan cara pasang iklan melayang di blog. Tapi bagaimana bila kita ingin memasang iklan melayang tersebut hanya di atas header blog saja?. Posting kali ini, Kusuma Inspirasi Dunia akan menjelaskan tentang bagaimana Cara Membuat Iklan Melayang Di Atas Header Blog. Tutorial ini saya dapat ketika sedang blogwalking mengunjungi blog sahabat guna mempererat tali silaturahmi antar blogger dan mencari informasi mengenai Iklan Internet Murah Efektif Berkualitas Indonesia. Untuk lebih jelasnya bisa sobat lihat gambar iklan melayang di atas header blog dibawah ini.

Cara Membuat Iklan Melayang Di Atas Header Blog

Jika sobat tertarik ingin memasang iklan tersebut melayang di atas header blog, silahkan ikuti langkah-langkahnya dibawah ini.
1. Login Menggunakan account Blogger Sobat.

2. Pada bagian Dasbor pilih tab Rancangan.

Rancangan Blog

3. Setelah itu pilih tab Edit HTML.

tab Edit HTML blog

4. Jangan lupa Centang tulisan Expand Template Widget.
Expand Template Widget

5. Cari kode dibawah ini. (gunakan Ctrl + f  pada browser sobat untuk mempermudah pencarian).
<div id='outer-wrapper'>

6. Setelah ketemu kode <div id='outer-wrapper'> , Letakkan kode dibawah ini tepat dibawah kode <div id='outer-wrapper'>
<div style='display:scroll; top:0px;position:fixed;'>
<!-- Start Kode -->
<a href='http://kusumainspirasidunia.blogspot.com'><img alt='jalan menuju keberhasilan' border='0' height='54' src='http://i1111.photobucket.com/albums/h465/asistenikopin/JasaBuatIklanBanner.gif' width='972'/></a><!-- End Kode -->
</div>
NB: Warna biru diatas adalah nilai tinggi dan lebar iklan, jadi sesuaikan dengan header blog sobat, sedangkan untuk yang berwarna merah adalah Gambar iklannya.

7. Langkah terakhir Save Template. dan lihat hasilnya, Tarrraaa...

Gimana sobat? sangat mudah bukan Cara Membuat Iklan Melayang Di Atas Header Blog, bila ada kesulitan jangan sungkan untuk bertanya pada kolom komentar dibawah yah.. Semoga postingan ini bermanfaat.

Saturday, August 18, 2012

Cara Mendaftarkan blog ke 50 Search Engine sekaligus

cara mendaftarkan blog ke search engine, cara submite blog, submite blog ke google, daftar blog ke yahoo, mendaftarkan blog ke bing, cara mendafatarkan blog ke semua mesin pencari
Cara mendaftarkan blog ke 50 Search Engine sekaligus - Submit blog ke search engine merupakan hal yang wajib di lakukan agar blog cepat terindeks dan muncul di halaman depan hasil pencarian.

Selain google dan Bing yang merupakan Search Engine yang banyak digunakan saat ini, masih banyak search engine lain yang bisa menjadi alternatif untuk dijadikan tempat submite blog.

Semakin banyak mesin pencari yang mengindeks blog, semakin besar kemungkinan trafik pengunjung akan lebih banyak. Untuk itu, berikut ini akan saya tunjukkan cara praktis dan cepat mendaftarkan blog ke 50 mesin pencari sekaligus dengan bantuan "Freewebsubmission".

Tidak ada Jaminan

Blog sudah di submite ke google, Bing, dan puluhan Search Engine lainnya. Meskipun demikian, hal itu bukan merupakan jaminan blog akan tampil di halaman depan hasil pencarian. Submite atau mendaftarkan blog ke search engine hanya bertujuan agar Search Engine menambahkan blog kita ke dalam indeksnya.

Jika ingin tampil di halaman depan hasil pencarian, masih banyak tekhnik SEO yang harus dilakukan seperti Ping blog dan lain - lain. Jadi, daftakan blog ke sebanyak mungkin Search Engine agar blog dan artikelnya terindeks, lalu optimalkan SEO agar artikel yang terindeks bisa tampil di halaman depan hasil pencarian saat pengunjung mengetikkan keyword yang berhubungan dengan artikel yang ada di blog.

Cara submite blog ke 50 Search Engine Sekaligus.

Susah juga tampil di halaman depan hasil pencarian. Sudah repot submite blog ke search engine, masih belum ada jaminan . Setelah mengetahui kenyataan bahwa submite blog bukan jaminan blog akan tampil di halaman depan hasil pencarian, anda masih tertarik untuk mendaftarkan blog anda ke 50 mesin pencari sekaligus ???

Kalau "YA", simak tutorialnya berikut ini :

1. Klik link di berikut ini untuk membuka situs "Freewebsubmission".

2. Pada halaman Freewebsubmission yang terbuka di tab baru, scroll halaman ke bawah sampai anda melihat sebuah form pendaftaran.
 
3. Isi form yang anda lihat di freewebsubmission sesuai petunjuk berikut:
  • Isi kotak URL dengan url blog anda. Contoh = http://www.bloggerbugis.com 
  • Isi kotak Name dengan Nama Anda. Contoh = Bloggerbugis
  • Isi kotak email dengan alamat email anda.  Contoh = emailgoogle@bugis.com. Emailnya harus masih aktif karena email tersebut akan di buka saat proses mendaftarkan blog ke mesin pencari. Saran : Jangan gunakan email utama anda karena anda akan menerima banyak email masuk untuk memverifikasi pendaftaran. Sebaiknya gunakan email google lain, atau buat email baru di yahoo untuk proses verifikasi submit blog ke 50 search engine ini.
  • Beri tanda checklist di kotak kecil yang ada di dekat tulisan "I have read and agree to the Terms" dengan cara mengklik kotaknya.
  • Klik tombol "Submite Your Site"
cara mendaftarkan blog ke search engine, cara submite blog, submite blog ke google, daftar blog ke yahoo, mendaftarkan blog ke bing, cara mendafatarkan blog ke semua mesin pencari
Gambar 1 : Cara mendaftarkan blog ke 50 Search Engine sekaligus
  • Anda akan melihat keterangan bahwa Link Verifikasi telah di kirim ke email yang anda masukkan tadi. Keterangannya kurang lebih seperti gambar di bawah ini :
cara mendaftarkan blog ke search engine, cara submite blog, submite blog ke google, daftar blog ke yahoo, mendaftarkan blog ke bing, cara mendafatarkan blog ke semua mesin pencari
Gambar 2 : Cara mendaftarkan blog ke 50 Search Engine sekaligus

  • Tutup haaman freewebsubmission lalu masuk ke akun email anda. Cari email dari freewebsubmission di kotak masuk email. Jika tidak ada, periksa folder spam pada email gmail dan yahoo atau folder Junk jika anda menggunakan email hotmail.
  • Klik Link / Tautan yang di kirim oleh Freewebsubmission.
cara mendaftarkan blog ke search engine, cara submite blog, submite blog ke google, daftar blog ke yahoo, mendaftarkan blog ke bing, cara mendafatarkan blog ke semua mesin pencari
Gambar 3 : Cara mendaftarkan blog ke 50 Search Engine sekaligus

  • Halaman freewebsubmission akan terbuka di tab baru dan anda akan melihat tampilan halamannya seperti gambar di bawah ini :
cara mendaftarkan blog ke search engine, cara submite blog, submite blog ke google, daftar blog ke yahoo, mendaftarkan blog ke bing, cara mendafatarkan blog ke semua mesin pencari
Gambar 4 : Cara mendaftarkan blog ke 50 Search Engine sekaligus

  • Klik tombol "Submit Your Site"
Pada halaman berikutnya, anda akan melihat pemberitahuan sukses tidaknya submite blog anda ke 50 Mesin Pencari. Jika anda melihat tampilan seperti gambar ini :

cara mendaftarkan blog ke search engine, cara submite blog, submite blog ke google, daftar blog ke yahoo, mendaftarkan blog ke bing, cara mendafatarkan blog ke semua mesin pencari
Gambar 5 : Cara mendaftarkan blog ke 50 Search Engine sekaligus
Klik tulisan "Click Here to Complate" untuk melengkapi pendaftaran di Search Engine yang belum sukses ( Biasanya untuk Search Engine yang membutuhkan sign up seperti Google dan Bing ).
Beberapa Search engine lain membutuhkan Verifikasi melalui email untuk melengkapi proses pendaftaran blog anda. Sebaiknya anda rajin membuka email yang anda gunakan saat mendaftar blog ke Mesin Pencari  dengan Freewebwubmition untuk melakukan verifikasi.

Friday, August 17, 2012

Membuat Scroll Blockquote Otomatis Pada Postingan Blog

Apa sih yang di maksud dengan Blockquote itu? Blockquote mrmpunyai fungsi sebagai wadah/penanda kata-kata yang di anggap penting di sebuah artikel blog. Seperti yang ada di Abdu-Green's Blog ini, yang saya gunakan untuk wadah kode-script yang penting.


Pertemuan kali ini kita akan belajart memberi batasan tinggi maksimal yang sehinnga akan memunculkan fungsi scroll untuk bergulir kebawah pada blockquote, blockquote dengan fungsi scroll lebih efektif di bandingkan blockquote yang tidak memiliki fungsi scroll, karena jika kata-kata yang di anggap penting terlalu banyak menjadikan blockquote memakan tempat yang panjang ke bawah dalam postingan.

Blockquote dengan fungsi scroll kali ini memiliki ototmatis ketinggian maksimal yang bila tinggi dari kotak blockquote tidak mencapai batas yang di tetapkan, maka kotak akan tetap(scrollnya tidak muncul), dan jika melebihi tinggi yang ditentukan, maka akan muncul fungsi scroll(tombol gulir kebawah). tergantung bagaimana anda memodofikasinya. Kotak blockquote akan tetap dan blockquote nantinya otomatis memiliki scroll pada bagian kanan blockquote bila tinggi kotak blockquote mencapai batas yang telah ditentukan.

Blockquote kali ini menggunakan CSS, jadi anda tidak perlu repot2 mengatur pada tiap postingan anda lewat Edit HTML. bagi anda yang berminat untuk menerapkan trik ini, silahkan ikuti langkah2 dibawah ini :

Cara Membuat Scroll Blockquote Otomatis Pada Postingan Blog
1. Log in ke blogger
2. dari Dasbor klik Template dan masuk ke Edit HTML
3. Gunakan F3 untuk mencari kode seperti berikut :
.post-body blockquote {
-----------------
-----------------
}
Gunaka Ctrl + F lalu ketik blockquote
4. Jika sudah ketemu Ganti kode diatas  dengan kode dibawah :
.post-body blockquote {
overflow:auto;
max-height:400px;
font-family:'Trebuchet MS';
background:#333;
box-shadow:0 0 0.5em #333;
-webkit-transition:all .2s ease-out;
-moz-transition:all .2s ease-out;
-o-transition:all .2s ease-out;
color:#fff;
margin:10px 0;
padding:5px;
}
5. Jika kode pada langkah ke-3 tidak di temukan cari saja
.post body
--------
--------
}
4. dan letakkan kode berikut di bawah kode di atas :
.post-body blockquote {
overflow:auto;
max-height:400px;
font-family:'Trebuchet MS';
background:#333;
box-shadow:0 0 0.5em #333;
-webkit-transition:all .2s ease-out;
-moz-transition:all .2s ease-out;
-o-transition:all .2s ease-out;
color:#fff;
margin:10px 0;
padding:5px;
}
5. Simpan Template dan lihat hasilnya di postingan sobat yang sudah ada blockquotenya.

NB : Silahkan anda modifikasi sendiri sesuai kreatifitas anda, misalnya, mengatur tinggi, memberi background dan lain sebagainya.

jika ada masalah dengan pemasangan kode diatas, silahkan kontak admin lewat kolom komentar dibawah.
Selamat mencoba dan semoga berhasil, Semoga Bermanfaat.

Cara Membuat Widget Facebook Like Melayang dan di Close

Sering kita lihat blog-blog menggunakan LikeBox Melayang,apa fungsi dari LikeBox Melayang?fungsinya adalah untuk menarik perhatian pera pengunjung ngelike fanpage blog kita.Dengan demikian orang yang ngelike Fanpage blog kita tambah banyak.Masalahnya gimana cara buat Like Box Melayang? Disini kita akan mengetahuinya.

1.Masuk Blogger

2.Ke tata Letak

3. Add gadget,terserah pilih yang mana saja.


4.Pilih HTML/Javascript

5.Paste code di bawah ini ke gadget sobat.

<style type='text/css'> 
#kotak-facebook {

      position:fixed !important;

      position:absolute; /* IE6 */

      bottom:-1000px;

      left:50%;

      margin:0px 0px 0px -182px;

      width:300px;

      height:auto;

      padding:16px;

       -webkit-box-shadow: 0px 0px 7px #222;

      -moz-box-shadow: 0px 0px 7px #222;

      box-shadow: 0px 0px 7px #222;  background-color:#eee2e2; font:normal 1em Cambria,Georgia,Serif;

      color:#111;

    -webkit-border-top-left-radius: 20px;

    -webkit-border-bottom-right-radius: 20px;

    -moz-border-radius-topleft: 20px;

    -moz-border-radius-bottomright: 20px;

    border-top-left-radius: 20px;

    border-bottom-right-radius: 20px;}

    #kotak-facebook a.close {

      position:absolute;

      top:-10px;

      right:-10px;

      background:#333;

      font:bold 16px Arial,Sans-Serif;

      text-decoration:none;

      line-height:22px;

      width:22px;

      text-align:center;

      color:#fff;

      border:2px solid #fff;

      -webkit-box-shadow:0px 1px 2px rgba(0,0,0,0.4);

      -moz-box-shadow:0px 1px 2px rgba(0,0,0,0.4);

      box-shadow:0px 1px 2px rgba(0,0,0,0.4);

      -webkit-border-radius:10px;

      -moz-border-radius:10px;

      border-radius:10px;

      cursor:pointer;

    }
</style>
    <script type='text/javascript'>

    $(window).bind("load", function() {

         // animasikan nilai top saat halaman telah selesai dimuat

         $('#kotak-facebook').animate({bottom:"50px"}, 1000);

         // hilangkan kotak pesan saat tombol (x) di klik

         $('a.close').click(function() {

              $(this).parent().fadeOut();

         return false;

         });

    });

    </script>


    <div id='kotak-facebook'>

<strong style="color: rgb(0, 0, 0);"><blink>Jangan lupa klik Suka ya sobat KID ^_^</blink></strong>
<br /><a href="https://twitter.com/dunia_kusuma" title="kusumainspirasidunia" class="twitter-follow-button" data-button="grey" data-text-color="#000000" data-link-color="#ffffff">Follow @dunia_kusuma</a><script src="//platform.twitter.com/widgets.js" type="text/javascript"></script><iframe src="//www.facebook.com/plugins/likebox.php?href=http%3A%2F%2Fwww.facebook.com%2Fkusumami&amp;width=292&amp;height=200&amp;colorscheme=light&amp;show_faces=true&amp;border_color&amp;stream=false&amp;header=true&amp;appId=126816517366802" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:292px; height:200px;" allowtransparency="true"></iframe><span style="font-size: x-small;">widget by : <a href="http://kusumainspirasidunia.blogspot.com/" target="_blank" title="sofilmendo"><b><span style="color: black;">Kusuma Inspirasi Dunia</span></b></a></span>

    <a class='close' href='#'>&times;</a>

    </div>
  6. Setelah selesai jangan lupa untuk di Save.
  7. Lihat hasilnya pada blog sobat sekalian,. ^_^

NB : Ganti teks yang berwarna biru di atas dengan alamat dan nama fan page sobat sekalian.,

Semoga Bermanfaat ^_^

Wednesday, August 15, 2012

Cara Mengatasi Alexa No Rank, No Data, Atau No Links in

Saya rasa saya tidak perlu menjelaskan secara detil tentang alexa rank ini. Tapi apakah sebagian ada dari teman-teman yang memperhatikan, jika akhir-akhir ini kita sering kali menemukan sedikit masalah yang terjadi di widget alexa rank yang kita pasang.

Sebenarnya saya sendiri sudah lumayan lama tidak terlalu pusing dengan hal ini. Toh jika kita rajin update dan seiring dengan berjalannya waktu juga alexa rank kita pasti akan berubah naik. Namun malam ini ada teman yang "teriak" karena tiba-tiba alexa rank yang di tunjukkan di widget alexa menunjukkan tulisan "no data".

Saya pun langsung cek ke widget alexa rank yang juga saya pasang di blog samping. Dan ternyata widget tersebut juga menunjukkan hal yang sama. Hanya saja link in yang biasa di tunjukkan dengan "no data" menjadi naik drastis. 

Pada hal jika di cek langsung kesitusnya, alexa rank blog ini sudah 356,306 


Karena menyangka itu hal umum, saya fikir mungkin itu disebabkan karena alexa sendiri sedang melakukan update rank. Tapi saat sedang blogwalking ke blog sahabat, saya juga melihat ada sebagian widget alexa diblog mereka dalam keadaan normal. Saya pun langsung coba cek dan login ke akun di alexa.

Usut punya usut ternyata hal ini karena saya belum pernah melakukan Claim blog.
Maka buat teman-teman yang juga belum melakukan claim blog pasti terjadi hal serupa dengan yang saya alami.

Untuk Cara Mengatasi Alexa No Rank Data Atau No Links in ini, saya sedikit berikan gambarannya seperti dibawah ini.

1.  Kunjungi langsung dan login ke akun alexa kita.
2 . Cari pilihan SITE TOOLS maka kita akan menemukan pilihan "Claim Your Site"di pojok kiri bawah.

3. Setelah kita klik pilihan Claim Your site maka kita akan diminta untuk kembali memasukkan URL blog kita.


4. Jika kita sudah memasukkan link kita di menu pilihan Claim Your Site, maka kita akan diberikan angka atau kode untuk kita pasang di blog kita. Ambil saja kode yang diberikan dan pasang di blog kita. Sebagai contoh angka verifikasi untuk blog ngalor ngidul adalah:

IWEXbWiiaGFx0BqcQh662dpJ0qg


Keterangan:
Tempat peletakannya sendiri boleh di 3 tempat. Jika tidak mau susah, ambil saja cara yang kedua. Kita tinggal copy dan ganti angka verifikasi dengan angka yang diberikan kemudian letakkan di bawah kode <head>. Saya rasa saya tidak perlu menjelaskan lebih detil tentang caranya. Tinggal masuk ke ke dashboard->Rancangan->Edit HTML kemudian cari kode <head> dengan CTRL + F. Sebagai contoh untuk blog ngalor ngidul ini codenya seperti ini:

<meta name="alexaVerifyID" content="IWEXbWiiaGFx0BqcQh662dpJ0qg" />

5. Setelah kita letakkan kode dan tersebut, maka kita kembali ke akun alexa kita untuk melakukan verifikasi.
6. Cobalah Untuk refresh blog anda.
Maka hasilnya taraaa...!!!
Alexa No Atau Rank No Data  yang ditunjukkan di widget pun berubah.


Tambahan.
Jika belum berubah maka ganti kode widget alexa yang lama dengan yang baru.


SEMOGA BERMANFAAT..!!!!

Monday, August 6, 2012

Cara Membuat Tombol Follow di Blog

Assalamualaikum-Bismillahirrahmanirrahim.
Selamat pagi para sobat KID, di pagi yang cerah ini saya akan coba share sedikit ilmu yang memang sebenarnya sudah banyak ilmu seperti ini di luar sana. Tapi, tidak ada salahnya jika saya coba untuk membaginya lagi pada para blogger.
Membuat Tombol Follow Twitter di Blog-kali ini kita akan sharing mengenai Membuat Tombol Follow Twitter di Blog. tidak perlu basa basi, langsung saja menuju ke cara Membuat Tombol Follow Twitter di Blog. 

Berikut ini Membuat Tombol Follow Twitter di Blog:

 
1.masuk ke akun Twitter anda.
2.kunjungi situs Follow Twitter DISINI
3.Pilih tombol yang anda sukai
4.Copy Skrip dan Codenya dan masukkan  ke Blog anda.

Cara memasukkan skripnya seperti biasa, masuk ke akun Blogger > Buka rancangan > Add Gadget > HTML/JavaSkript.

Selesai. mudah bukan cara Membuat Tombol Follow Twitter di Blog.

Thursday, July 19, 2012

How To Regeister Google Adsense



Google Adsense is a pay site owned by Goolge, where a person who has a website / blog can be registered for Google Adsense. But the web / blog must meet the terms of Google Adsense, for it is the steps to register with Google Adsense is:

  1. Go to site Google Adsense
  2. Then click on Register Now
  3. Then complete the form, for its looks as follows:



4. After the contents of it all and then click Send Information Do not forget to write your name and address must be correct.
5. After that go to if you already have a Gmail account, if you have not yet made a Gmail account first.
6. Once logged in it will appear as follows:
After receiving the message, wait about a week google adsense will send messages to your email whether accepted or not.

Cara Menampilkan Menu Penghasilan / Earning / Monetize Pada Blogger Yang Bermasalah

Anda sekalian pasti sudah tahu apa itu Google Adsense? Google Adsense merupakan situs yang bisa mendapatkan Penghasilan (dalam bhs Inggris Monetize) dari Google. Nah pada kesempatan kali ini saya akan membicarakan tentang perubahan pendaftaran dari Google Adsense. Dimana dulunya bisa masuk ke situs http://www.google.com/adsense. Sekarang mulai tahun 2012, Adsense sudah mulai merubah tampilan dan cara pendaftarannya, dimana jika kita memiliki situs dari Blogger, pendaftaran Adsense melalui Blogger tersebut. Ini kisah nyata, pada tahun kemarin saya telah mendaftarkan situs saya ke Adsense, ternyata Adsense menolak saya. Dan kemudian pada tahun 2012 ini saya mau mendaftarkan situs saya ke Adsense, dan ternyata Adsense sudah merubah cara pendaftarannya, saya sempat stress dan marah karena pendaftaran Adsense harus melalui Blogger dengan Menu Penghasilan / Monetize, pada blog saya tidak ada menu tersebut. Katanya Bhs. Indonesia sudah support dengan Adsense, itu memang bener. Tapi Bhs. Indonesia masih dalam uji coba belum resmi diakui oleh Adsense. Terus saya browsing di Google dan ketemu caranya adalah sebagai berikut :
1. Anda login dulu ke situs Blogger.
2. Kemudian seperti pada gambar dibawah ini, dimana Menu Penghasilan / Monetize saya tidak ada.

3. Selanjutnya anda klik Menu Setelan - Bahasa dan Pemformatan.

4. Selanjutnya pada Bahasa, sebelumnya anda pasti isinya Indonesia ganti dengan Inggris - English. Setelah itu klik Simpan dan refress (F5), kemudian munculah Menu Penghasilan / Monetize, seperti gambar berikut :

5. Sekarang anda tinggal mendaftar Adsense, Klik Menu Penghasilan / Monetize. Untuk tahu langkah-langkah mendaftar Adsense klik Disini.

Oya, sebelumnya pada saat merubah bahasanya, jangan klik pada Menu Bahasa yang berada di sebelah kanan atas, karena tidak ada perubahan. Ikuti langkah-langkah yang sudah saya jelaskan tadi saja. Dan saya mengucapkan terima kasih kepada Google dan sumber-sumber yang terkait. Bila ada pertanyaan, anda bisa tulis pada kotak komentar!

Wednesday, July 4, 2012

Download E-Book Gratis Panduan Google Adsense

        Malem sobat KID, kali ini saya akan coba untuk berbagi sedikit ilmu tentang dunia blogger. Mungkin sudah banyak yang tahu juga tentang ilmu yang mungkin akan saya bagikan pada kalian semua. Tapi, tidak salahnya juga jika saya membagikan kepada kalian lagi. Karena semakin kita berbagi ilmu semakin bermanfaat juga ilmu tersebut.. SETUJU..?? ^_^

        Okey langsung saja tanpa banyak bicara lagi. Sedikit saya sampaikan dalam dunia blogger belum lengkap jika kita tidak mendapatkan hasil apa-apa. Ada baiknya seperti pantun yang mengatakan “Sambil Menyelam Minum Air”, yang dapat diartikan sambil membuat blog kita dapat mendapatkan uang,. :D

        Yapp..!! kita bisa dapet uang dari blog sobat. Mau tahu cara..?? pasti sudah banyak yang tahu juga tentang “Google Adsense”. Begitu banyak contoh nyata yang mendapatkan penghasilan melalui Google Adsense ini.

        Yaa, daripada bingung lebih baik langsung saja kalian download e-Book gratis dibawah ini. E-Book ini berisi tentang panduan lengkap tentang “Google Adsense”. So, tunggu apalagi kalau kalian bisa lakukan sekarang,.
 
Download :
Password :  

Semoga Bermanfaat,. ^_^

Thursday, June 28, 2012

Cara Membuat Widget Melayang di Blog

Catatan: sebenarnya ada banyak cara bikin yang kayak begini tapi saya menjelaskan cara yang paling mudah saja ya :)


Banyaknya orang yang ingin memasang widget pada blog mereka, tetapi apa daya sidebar mereka sudah penuh. Tenang..!! ^_^
Ada solusinya kok, coba lihat gambar diatas, kalian bisa menempatkan widget kalian seperti itu. Pengen tau caranya, udah iya gak usah banyak omong lagi. Langsung aja ke TKP.. ^_^ :

1. Login ke Blogger
2. Pilih blog anda dan pilih tab "Tata Letak" (ini ga tau kalo bahasa inggris tertulisnya apa :D)
3. Cari widget yang ada code shoutmix atau cbox-nya (Sebenarnya widget apa aja yang tipenya HTML/JavaScript) kemudian > klik "edit"
Kalo ga ada, silahkan klik "Tambah Gadget" > Cari "HTML/JavaScript" > Kosongkan "Judul" > Isi "Konten" dengan kode pada nomer 4.
4. Kemudian akan muncul dialog. Tambahkan kode berikut dibawah setelah kode shoutmix atau cbox anda.


<style type="text/css">
.melayang {
position: fixed;
bottom: 0;
right: 0;
width: 200px;
background-color: black;
color: white;
margin: 10px;
padding: 20px;
}
</style>
<div class="melayang">
Ini adalah widget melayang. Tutorialnya bisa didapatkan </div>

5. Kemudian Klik Simpan.
6. Nah lihat blog anda dibagian bawah kanan akan muncul widget yang melayang :)

Untuk mengatur posisinya, misalnya ingin seperti punya saya, bottom bisa diganti dengan top, kemudian left dengan right. Kemudian angka 0 nya bisa diganti dengan 100px. Kemudian baris margin: 10px bisa dihapus

top: 100px;
left: 0;

Ini berarti 100pixel jaraknya dari top dan 0 dari left.

Sementara untuk warnanya bisa disesuaikan dengan kemauan anda dengan mengedit background-color dan color untuk tulisannya.

Cara yang lebih gampang:
Kalo udah jago ngedit-ngedit template, langsung aja masuk ke "Template" kemudian tambahkan kode nomer 4 setelah tag <body>

Kelemahan: dengan cara ini script akan mudah dipasang tapi akan berbeda tampilannya dilayar yang kecil.

Semoga bermanfaat iya kawan,. ^_^
Jangan Lupa buat berikan komentar iya,.

Wednesday, June 27, 2012

Cara Buat Tombol Hide & Show di blog

Tombol untuk menyembunyikan dan menampilkan konten ini biasanya disebut spoiler. Sangat berfungsi untuk menghemat panjangnya suatu posting akibat gambar atau konten lainnya


Contohnya dapat dilihat dibawah ini :
source code

<div><div style="margin-bottom: 2px;"><i><b><small>JUDUL SPOILER</small></b></i><input value="Show" style="margin: 0px; padding: 0px; width: 60px; font-size: 10px;" onclick="if (this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display != '') { this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = ''; this.innerText = ''; this.value = 'Hide'; } else { this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = 'none'; this.innerText = ''; this.value = 'Show'; }" type="button"></div>
<div style="border: 1px inset ; margin: 0px; padding: 6px;"><div style="display: none;">

ISI NYA (Terserah anda)

</div></div></div>




cara membuatnya : anda hanya perlu mengcopy-paste script didalam spoiler diatas, kemudian edit sesuai dengan keperluan anda. Kemudian paste pada konten postingan anda..

selamat mencoba.. ^_^

Monday, June 25, 2012

Cara Membuat Teks Area

Text area, what is that?. Untuk tau apa dan bagaimana text area itu, silahkan alihkan perhatian anda ke kolom sebelah kanan layar, di bawah tulisan link barter, ada sebuah kotak yang di dalamnya berisi text kode-kode HTML, itulah yang di sebut text area. Nah dengan melihat contoh tadi, maka dapat kita katakan bahwa Text area adalah area atau tempat untuk menyimpan text atau tulisan dengan membentuk area baru. Biasanya text area ini di gunakan untuk menyimpan kode-kode HTML ataupun text lainnya agar bisa di copy oleh para pengunjung.


Untuk membuat text area, silahkan anda Copy kode di bawah ini :


<p align="center"><textarea name="code" rows="6" cols="20"> Tulis text ataupun kode-kode yang anda inginkan di sini, maka nanti tulisan anda akan tampil di dalam text area </textarea></p>


Sebagai contoh :





Keterangan : rows="6", menunjukan tinggi dari text area, jadi jika anda menginginkan text area yang tinggi maka silahkan ganti angka " 6 tadi dengan angka yang lebih tinggi nilainya.


Cols="20", menunjukan lebar dari text area. Jika anda menginginkan text area yang lebar maka silahkan ganti angka " 20 " tadi dengan angka yang lebih tinggi nilainya.


Text Area dengan memakai HighLight


Ada variasi lain dari membuat text area ini, yakni text area dengan menggunakan tombol highlight. dengan adanya tombol highlight ini akan memudahkan bagi para pengunjung untuk mengcopy seluruh text ataupun kode-kode yang di berikan, karena dengan hanya sekali tekan saja pada tombol highlight tadi, maka seluruh text ataupun kode-kode yang ada di dalamnya akan di highlight dan tinggal di copy saja. Fasilitas ini sangat berguna tatkala text ataupun kode-kode yang di berikan dalan jumlah yang sangat banyak dan ini akan mengurangi resiko tertinggalnya suatu text ataupun kode-kode untuk di copy. Untuk membuat text area dengan menggunakan highlight ini silahkan anda copy kode HTML di bawah :



<div><form name="copy"><div align="center"><input onclick="javascript:this.form.txt.focus();this.form.txt.select();"
type="button" value="Highlight All"> </div><div align="center"></div><p
align="center"><textarea style="WIDTH: 300px; HEIGHT: 144px" name="txt"
rows="100" wrap="VIRTUAL" cols="55">simpan tulisan anda di sini, maka tulisan yang anda tulis akan muncul di sini dan siap di copy oleh para pengunjung</textarea></p></div></form>


Sebagai contoh :




Agar anda lebih memahami kode di atas, sedikit akan saya uraikan. Kode di atas mempunyai dua elemen bagian, yakni elemen kode untuk membuat tombol yang bertuliskan Highlight All, dan yang kedua adalah elemen kode untuk membuat text area.

Elemen tombol highlight All :



  1. <div align="center"> --> kata center menunjukan bahwa posisi tombol akan berada di tengah, jadi jika anda ingin posisi tombol berada di tepi sebelah kiri, tinggal ganti dengan kata left. Dan jika ingin berada di tepi sebelah kanan, tinggal ganti dengan kata right.
  2. <input onclick="javascript:this.form.txt.focus();this.form.txt.selec()"> --> kode ini artinya ketika tombol highlight di klik, maka seluruh text yang ada di dalamnya akan di highligt (di tandai atau di blok), jadi anda jangan merubah tulisan ini.
  3. Value="Highlight All" --> kata Highlight All adalah kata yang akan muncul di dalam tombol, jadi jika anda ingin merubah tulisan ini silahkan ganti dengan kata yang anda inginkan.

Element text area :


  1. <p align="center"> --> ini menunjukan bahwa text area akan berada di tengah, nah jika anda ingin text area anda berada di tepi kiri, ganti kata center dengan kata left, bila ingin di tepi kanan, ganti dengan kata right.
  2. <text style="WIDTH: 300px">-->kata "WIDTH:300px" menunjukan lebar dari text area tersebut sebanyak 300 pixel, jadi jika anda ingin memperpendek atau memperpanjang lebar text area, anda tinggal menggantinya dengan angka yang anda inginkan. misal: "WIDTH:700px;"
  3. HEIGHT: 144px --> angka "144px" menunjukan bahwa text area akan mempunyai tinggi sebesar 144 px, jadi jika anda ingin merubahnya tinggal ganti angka tersebut dengan angka yang anda inginkan. Misal : HEIGHT:160px.

Contoh text area yang memakai tombol highlight diatas, memuat skript untuk melindungi dari right click para pengunjung. skript ini di pakai apabila anda tidak ingin tulisan-tulisan anda di copy paste oleh pengunjung. bagi yang berminat silahkan copy lalu pasang pada kode HTML anda antara kode <HEAD> dan </HEAD> selamat mencoba.

Click This Widget