Cara Menambah Reply Komentar Blogger

Reply komentar blogger yaitu cara kita membalas komentar yang ada. Fitur ini saya terinspirasi dari blog-blog yang ada, Mengapa di blog saya ngak muncul?. Setelah saya membaca di blog teman-teman yang sudah ahli ternyata apabila template hasil dari coustum, fitur ini ada yang muncul dan ada yang tidak muncul terkecuali template standar yang telah di sediakan oleh blogger.Jadi dasar inilah saya berusaha untuk mencari solusinya. Dan akhirnya saya menemukan tips Cara Menambah Reply Komentar Blogger.

Tahap-Tahap Cara Menambah Reply Komentar Blogger Sbb:
  1. Sign in di blog anda.
  2. Pilih Template.
  3. Pilih Edit HTML
  4. Download Template Lengkap untuk menghindari kesalahan.
  5. Centang Expand template widget
  6. Cari kode <data:commentPostedByMsg/> atau <data:comment.timestamp/>
  7. Copy kode berikut ini lalu tempatkan di bawah kode di atas
    8. <span><a expr:href='&quot;https://www.blogger.com/comment.g?blogID=NOMOR-BLOG-ID-ANDA&amp;postID=&quot; + data:post.id + &quot;&amp;isPopup=true&amp;postBody=%40%3C%61%20%68%72%65%66%3D%22%23&quot; + data:comment.anchorName + &quot;%22%3E&quot; + data:comment.author + &quot;%3C%2F%61%3E%3A%20#form&quot;' onclick='javascript:window.open(this.href, &quot;bloggerPopup&quot;, &quot;toolbar=0,location=0,statusbar=1,menubar=0,scrollbars=yes,width=450,height=450&quot;); return false;' style='padding:0px 5px; border:1px solid #999;'>Balas Komentar</a></span>
    Keterangan:
    Tulisan berwarna biru diganti dengan nomor blog id anda.
    Contoh di adressbar tertera :
    http://www.blogger.com/blogger.g?blogID=157642238713766667#template/src=dashboard
    Tulisan berwarna merah adalah no blog id anda. 
  8. Klick Simpan Template unutk menyimpan perubahan
  9. Klick Lihat atau Pratinjau untuk melihat hasilnya.
Perbedaan hasil dari dua pilihan di atas adalah apabila menempatkan kode Reply di bawah kode <data:commentPostedByMsg/> teks "Balas Komentar" akan berada sejajar dengan komentar pengunjung. Sedangkan apabila ditempatkan di bawah <data:comment.timestamp/> teks "Balas Komentar" akan berada di bawah komentar.

Demikian tips yang bisa saya share kepada anda jika masih ada kekurangan mohon di maafkan. Terimah Kasih.
Read more »
Diposkan oleh Frangky di 8:29:00 PM 3 komentar
Label:

Mengganti Tulisan Older Post, Newer Post, Home

Tulisan older post, newer post, dan home merupakan navigasi yang muncul di bawah postingan untuk beranjak ke postingan yang baru, lama, dan kembali ke homepage blog. Nha, apa pernah terpikir oleh anda untuk menggantinya dengan sebuah gambar? Saya rasa anda harus melalukannya supaya blog terlihat lebih sempurna dan berbeda dengan blog lainnya. Mau tau cara?

Berikut Cara Mengganti Navigasi Blog Dengan Gambar:
  1. Login ke Account Blogger anda.
  2. Plih Template.
  3. Polih Edit HTML.
  4. Centang Expand Widget Template.
  5. Cari kode berikut:
    6. <data:newerPageTitle/> ganti dengan <img src="url-gambar-next" border="0" /> <data:olderPageTitle/> ganti dengan <img src=" url-gambar-previous" border="0" /> <data:homeMsg/> ganti dengan <img src=" url-gambar-home" border="0" />
  6. Terakhir, klik Save Template.
Sebagai contoh penerapannya kunjungi blogku Free Source Code Visual Basic.
Demikian tips saya mengenai Cara Mengganti Navigasi Blog Dengan Gambar semoga bermanfaat dan terimah kasih.
Read more »
Diposkan oleh Frangky di 1:16:00 AM 9 komentar
Label:

Membuat Menu Tab View Widget Di Blogger

Pada postingan pertama Membuat Menu Tab View Di Blogger dengan mengedit HTML. Sekedar memperdalam ilmu sebaiknya anda membacanya terlebih dahulu karena pada postingan kali ini saya akan memberikan tutorial Membuat Menu Tab View Widget yang sedikit lebih mudah. Mengapa? karena kita tidak perlu lagi mengedit HTML..

Berikut Langkah-langka Membuat Menu Tab View Widget:
  1. Login ke Blogger Anda.
  2. Pilih Tata Letak.
  3. Posisikan dimana anda akan meletatkannya, sebaiknya pada sidebar. Kemudian pilih Add Gadget. dan masukan kode di bawah ini.
    4. <style type="text/css">
    div.TabView div.Tabs a {
    float: left;
    display: block;
    width: 80px; /* Lebar Kotak Tab */
    height: 22px; /* Tinggi Menu Utama Atas */
    text-align: center; /* Posisi Teks Menu Tab */
    margin: 5px 0px 0px 3px; /* Posisi Kotak Tab */
    background-color: #000; /* 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-color: #736F6E; /* Warna background utama kotak tab */ }
    div.TabView div.Pages{
    clear: both;
    border: 1px solid #cccccc; /* Warna border Kotak Konten */
    overflow: hidden;
    background-color: #ffffff; /* 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: 300px;" class="Tabs">
    <a><span style="color: #fff">Tab 1</span></a>
    <a><span style="color: #fff">Tab 2</span></a>
    <a><span style="color: #fff">Tab 3</span></a>
    </div>
    <div style="width: 300px; height: 200px;" class="Pages">
    <div class="Page">
    <div class="Pad">
    konten 1</div>
    </div>
    <div class="Page">
    <div class="Pad">
    konten 2</div>
    </div>
    <div class="Page">
    <div class="Pad">
    konten 3</div>
    </div>
    </div></div></form>
    <script src="https://masolis-javascript.googlecode.com/svn/trunk/tab-viewmaskolis.js">
    </script>
    <script type="text/javascript">
    tabview_initialize('TabView');
    </script></div>
  4. Simpan.
Keterangan
  • Untuk tulisan berwarna merah di isi dengan judul dari Tab View.
  • Untuk tulisan berwarna biru di isi dengan konten anda.
Apabilila anda belum mengerti mengenai konten, berikut contohnya :
<div class="Page">
<div class="Pad">
<script style=text/javascript src=http://frangky-s.googlecode.com/files/recent-comments.js></script><script style=text/javascript>var a_rc=10;var m_rc=false;var n_rc=true;var o_rc=100;</script><script src=http://frangkys.blogspot.com/feeds/comments/default?alt=json-in-script&callback=showrecentcomments></script> <style type=text/css> .rcw-comments a {text-transform: capitalize;} .rcw-comments {border-bottom: 1px dotted; padding-top: 7px!important; padding-bottom: 7px!important;} </style>
</div>
</div>
<div class="Page">
<div class="Pad">
<script style="text/javascript" src="http://frangky-s.googlecode.com/files/recentposthumb.js"></script>
<script style="text/javascript">
var numposts = 10;
var showpostthumbnails = true;
var displaymore = false;
var displayseparator = true;
var showcommentnum = false;
var showpostdate = false;
var showpostsummary = true;
var numchars = 150;
</script>
<script src="http://frangkys.blogspot.com/feeds/posts/default?orderby=published&alt=json-in-script&callback=showrecentpostswiththumbs"></script>
</div>
</div>
Demikian Tutorial Membuat Menu Tab View Dengan Widget semoga dapat bermanfaat bagi teman-teman.
~God Luck~
Read more »
Diposkan oleh Frangky di 12:52:00 PM 0 komentar
Label: ,

Membuat Menu Tab View Di Blogger

Untuk menghemat tempat atau space pada blog Tab Veiw adalah solusinya. Ukurannya relatif kecil namum memuat banyak space. Membuat Menu dengan Tab View memerlukan script yang cukup banyak jadi berhati-hatilah dengan kata lain sebelum mencobanya agar templete anda di backup terlebih dahulu.

Langkah-langkahnya Membuat Menu dengan Tab View
  1. Login di Blogger anda.
  2. Pilih Template.
  3. Backup Templete Anda.
  4. Pilih Edit HTML 
  5. Kemudian letakan kode script dibawah ini sebelum kode </head>
    6. <script type='text/javascript'>
    //<![CDATA[
    function tabview_aux(TabViewId, id)
    {
      var TabView = document.getElementById(TabViewId);
      // ----- Tabs -----
      var Tabs = TabView.firstChild;
      while (Tabs.className != "Tabs" ) Tabs = Tabs.nextSibling;
      var Tab = Tabs.firstChild;
      var i   = 0;
      do
      {
        if (Tab.tagName == "A")
        {
          i++;
          Tab.href      = "javascript:tabview_switch('"+TabViewId+"', "+i+");";
          Tab.className = (i == id) ? "Active" : "";
          Tab.blur();
        }
      }
      while (Tab = Tab.nextSibling);
      // ----- Pages -----
      var Pages = TabView.firstChild;
      while (Pages.className != 'Pages') Pages = Pages.nextSibling;
      var Page = Pages.firstChild;
      var i    = 0;
      do
      {
        if (Page.className == 'Page')
        {
          i++;
          if (Pages.offsetHeight) Page.style.height = (Pages.offsetHeight-2)+"px";
          Page.style.overflow = "auto";
          Page.style.display  = (i == id) ? 'block' : 'none';
        }
      }
      while (Page = Page.nextSibling);
    }
    // ----- Functions -------------------------------------------------------------
    function tabview_switch(TabViewId, id) { tabview_aux(TabViewId, id); }
    function tabview_initialize(TabViewId) { tabview_aux(TabViewId,  1); }
    //]]>
    </script>
  6. Setelah itu letakan kode berikut di atas kode ]]></b:skin>
    7. div.TabView div.Tabs {
    height: 30px;
    overflow: hidden;
    }
    div.TabView div.Tabs a {
    float: left;
    display: block;
    width: 98px; /* Lebar Menu Utama Atas */
    text-align: center;
    height: 30px; /* Tinggi Menu Utama Atas */
    padding-top: 3px;
    vertical-align: middle;
    border: 1px solid #BDBDBD; /* Warna border Menu Atas */
    border-bottom-width: 0;
    text-decoration: none;
    font-family: "Verdana", Serif; /* Font Menu Utama Atas */
    font-weight: bold;
    color: #000; /* Warna Font Menu Utama Atas */
    -moz-border-radius-topleft:10px;
    -moz-border-radius-topright:10px;
    }
    div.TabView div.Tabs a:hover, div.TabView div.Tabs a.Active
    {
    background-color: #E6E6E6; /* Warna background Menu Utama Atas */
    }
    div.TabView div.Pages
    {
    clear: both;
    border: 1px solid #BDBDBD; /* Warna border Kotak Utama */
    overflow: hidden;
    background-color: #E6E6E6; /* Warna background Kotak Utama */
    }
    div.TabView div.Pages div.Page
    {
    height: 100%;
    padding: 0px;
    overflow: hidden;
    }
    div.TabView div.Pages div.Page div.Pad {padding: 3px 5px;}
  7. Simpan Templete.
  8. Pilih Tata Letak Halaman.
  9. Pilih Add Gadget.
  10. Pilih Widgat HTML/Javascript dan anda tambahkan kode script di bawah ini.
    11. <form action="tabview.html" method="get">
    <<div class="TabView" id="TabView">
    <div class="Tabs" style="width: 300px;">
    <a>Tab 1</a>
    <a>Tab 2</a>
    <a>Tab 3</a>     </div>
    <div class="Pages" style="width: 300px; height: 250px;">
    <div class="Page">
    <div class="Pad">
    Tab 1.1 <br />
    Tab 1.2 <br />
    Tab 1.3 <br />     </div>
    </div>
    <div class="Page">
    <div class="Pad">
    Tab 2.1 <br />
    Tab 2.2 <br />
    Tab 2.3 <br />     </div>
    </div>
    <div class="Page">
    <div class="Pad">
    Tab 3.1 <br />
    Tab 3.2 <br />
    Tab 3.3 <br />     </div>
    </div>
    </div>
    </div>
    </form>
    <script type="text/javascript">
    tabview_initialize('TabView');
    </script>
  11. Kemudian Simpan.
Keterangan
  • Untuk kode warna biru menandahkan lebar dan tinggi Tab View, ganti sessuai kebutuhan halaman blog anda.
  • Untuk warna merah di isi dengan judul menu Tab View.
  • Untuk warna hijau di isi dengan konten, gambar atau lainnya sesuai dengan kebutuhan.
Demikian Tutorial Membuat Menu Tab View Di Blogger semoga bermanfaat.

~God Luck~
Read more »
Diposkan oleh Frangky di 12:04:00 PM 0 komentar
Label: ,

Script Populer Post Widget For Blogger

Selain dua script yang saya sudah postkan sebelumnya kali ini saya juga mempostkan atau membagikan script Scipt Populer Post Widget For Blogger atau dengan bahasa indonesia Script Postingan Terkenal Di Blogger (he.he..he... maaf ya.... aku pingin belajar translate bahasa) lebih simple artinya postingan yang paling banyak di kunjungi. Langsung saja guys, begini scriptnya.
<script type="text/javascript">
function pipeCallback(obj) {
document.write('<ol style="text-transform: capitalize;">');
var i;
for (i = 0; i < obj.count ; i++)
{
var href = "'" + obj.value.items[i].link + "'";
var item = "<li>" + "<a href=" + href + ">" + obj.value.items[i].title + "</a> </li>";
document.write(item);
}
document.write('</ol>');
}
</script>
<script src="http://pipes.yahoo.com/pipes/pipe.run?_render=json&_callback=pipeCallback&_id=dc658aedc46c51ca847b4d728f2dbe6b&url=http://cerminblog.blogspot.com&tampil=10" type="text/javascript"></script>
Keterangan :
  • tampil=10 adalah menampilkan 10 artikel/postingan teratas.
  • Tulisan berwarna merah diganti dengan nama blog anda
  • Tulisan berwara biru adalah id dari pipes.yahoo
  • Tulisan tampil atau berwarna kuning, sesuaikan dengan yahoo.pipe anda. secara default "ShowHawMany=10"
  • Tulisan url atau berwarna coklat, sesuaikan dengan yahoo.pipe anda. secara default "YourBlogUrl=http://cerminblog.blogspot.com"
Cara daftar ke pipe yahoo :
  1. Masuk ke Yahoo Pipe
  2. Masuk ke account Yahoo
  3. Klik Tombol Clone untuk membuat clone
  4. Klik Edit Source untuk merubah sesuai keinginan anda
  5. Jika selasai mengedit dan menyimpannya. klik ran pipe untuk mengtestnya.
  6. Setelah selesai copy id anda dan tempatkan pada script di atas dengan mengganti tulisan berwarna biru dengan id anda.
Bagaimana teman apakah rumit? Tentu saja tidak bukan. Ilmu itu harus dicari dan dipelajari dan apabila sudah tahu dibagikan kepada yang belum tahu.

Demikian Script Populer Post Atau Postingan Terkenal semoga bermanfaat dan apabila ada kekurangan mohon dimaafkan.

~God Luck~
Read more »
Diposkan oleh Frangky di 8:05:00 PM 0 komentar
Label: ,

Script Recent Post Atau Posting/Artikel Terbaru

Setelah saya share mengenai Script Recent Comment Atau Komentar Terbaru, saya juga mendapat inspirasi bagaimana membuat Script Recent Post Atau Posting/Artikel Terbaru. Keunggulannya bagi saya mengetahui script dari widget blogsopt adalah kita bisa menempatkan atau kita bisa memodifikasi blog kita sesuai keinginan. Bagaimana dengan anda? tentu saja setiap orang mempunyai daya tarik tersendiri dalam membuat website atau blogspot. Langsung saja ke scriptnya :

<script style="text/javascript" src="http://frangky-s.googlecode.com/files/recentposthumb.js"></script>
<script style="text/javascript">
var numposts = 10;
var showpostthumbnails = true;
var displaymore = false;
var displayseparator = true;
var showcommentnum = false;
var showpostdate = false;
var showpostsummary = true;
var numchars = 150;
</script>
<script src="http://frangkys.blogspot.com/feeds/posts/default?orderby=published&alt=json-in-script&callback=showrecentpostswiththumbs"></script>

Keterangan:
  • Var numposts=10 adalah jumlah komentar yang di tampilkan
  • Var showpostdate=true adalah untuk menampilkan tanggal
  • Var numchar=150 adalah snipset karakter yang akan ditampilkan
  • Tulisan yang berwarna merah diganti dengan nama blog anda.
Demikian Script Recent Post Atau Posting/Artikel Terbaru smoga bermanfat.

~God Luck~
Read more »
Diposkan oleh Frangky di 7:36:00 PM 0 komentar
Label: ,

Script Recent Comment Atau Komentar Terakhir

Dunia internet memang sumber dari segala ilmu, apa yang tidak tahu tinggal di cari melalui Search Engine. Kebetulan saya masih pemula dengan membuat blog, awalnya saya menggunakan widget yang sudah tersedia oleh bloger. setelah itu saya pikir-pikir bagamanakah Script Recent Comment Atau Komentar Terakhir dari widget tersebut. Syukurlah setelah saya search melalui engine google dan saya ketemu Script Recent Comment. Berikut ini saya akan share mengenai script tersebut.
<script style=text/javascript src=http://frangky-s.googlecode.com/files/recent-comments.js></script><script style=text/javascript >
var a_rc=5;
var m_rc=false;
var n_rc=true;
var o_rc=100;
</script>
<script src=http://frangkys.blogspot.com/feeds/comments/default?alt=json-in-script&callback=showrecentcomments></script><style type=text/css> .rcw-comments a {text-transform: capitalize;} .rcw-comments {border-bottom: 1px dotted; padding-top: 7px!important; padding-bottom: 7px!important;} </style>
Nah... Begitulah Script Recent Comment Atau Komentar Terakhir tinggal kita tempatkan sesuai keinginan kita.

Sebelum anda mengpraktekkannya sebagai keterangan dari script diatas :
  • Var a_rc=5 adalah jumlah komentar yang akan di tampilkan.
  • m_rc=true adalah apakah judul akan di tampilkan (true=ditampilkan, false=tidak)
  • o_rc=100 adalah snipset jumlah karakter yang akan ditampilkan
  • Tulisan yang berwarna merah diganti dengan nama blog anda.
Demikian tips Script Recent Comment Atau Komentar Terakhir dari saya semoga membantu teman-teman.

~God Luck~
Read more »
Diposkan oleh Frangky di 7:12:00 PM 0 komentar
Label: ,
Subscribe to: Posts (Atom)

About Me

Frangky
View my complete profile

Follow Blog

Copyright @ 2012 - Angky Blog By Frangky Sumampouw. Powered by Blogger.