Memasang Burung Twitter Di Blog

Berikut ini ialah langkah-langkah untuk membuatnya:

1. Masuk (Login) ke Dashboard Blogger anda.
2. Pilih Rancangan, kemudian Page Elelement.
3. Kemudian Tambahkan Gadged/Widget, pilih HTML/JavaScript.
4. Langkah selanjunya copy script “JavaScript” dibawah: (tanpa title/judul/tanpa memasukkan nama untuk gadged/widgetnya) letakkan di HTML/JavaSript Anda.



<script type="text/javascript" src="http://imemovaz.googlecode.com/files/tripleflap.js"></script>  <script type="text/javascript"> var birdSprite="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj_8H6QBN22Se1vEOR2iHGhEOLZl3sjpG4Q8Pizzqhe7Vk3ql7mNJ2HM6h-ff-9e80VcKskFtd8i8re51yHY5bvHwnnB1pMIw8vp4Erf3ZogptWMR2XXEw2n5ItrkyiYB9F1r_ZuglJ0aCc/s1600/birdsprite.png"; var targetElems=new Array("img","hr","table","td","div","input","textarea","button","select","ul","ol","li","h1","h2","h3","h4","p","code","object","a","b","strong","span"); var twitterAccount = "http://twitter.com/@anrhy_chipaz";var tweetThisText = "Twitter - @anrhy_chipaz http://tipstrik-be.tk/";tripleflapInit(); </script>

Perhatian : Ganti yang berwarna biru dengan akun twitter kau dan ganti juga yang berwarna merah dengan URL web kamu.

5. Klik simpan

Cukup disini dulu postingan Saya. Semoga bermanfaat dan silahkan menuliskan komentar dibawah ini untuk jawaban dan pertanyaan.

Langka-Langka Memasang Aquarium Di Blog

Untuk mitra yang ingin menciptakan Blog nya terlihat Indah, maka jangan tinggalkan cara yang satu ini, ini menciptakan kita menyerupai tinggal dirumah sendiri,, Kurang terperinci dengan judul di atas, maksudnya kita dapat memberi makan ikan-ikan di blog dengan Mengarahkan cursor mouse ke kotak aquarium kemudian di klik, maka secara otomatis kita memberi masakan ke ikan-ikan itu,,,
Ikutin aja langkah-langkah dibawah ini,, Caranya simpel koq

1. Pertama-tama Klik Disini untuk mengujungi Alamatnya
2. Setelah Masuk Ke alamat itu Cari instruksi Html/Javasciptnya
3. Copy - Paste Kodenya
4. Langkah Selanjutnya masuk ke blog Anda 
5. Buka Tata Letak sehabis itu Klik Elemen Halaman
6. Klik tambah Gedged pilih/klik sajian HTML/Javascript
7. Klik Save
8. Dan Lihat hasilnya…



Membuat Zoom Effect Pada Gambar Di Blog



Masih ingat dengan tutorila cara menciptakan zoom effect yang juga ditulis di blog ini? Kali ini kita akan berguru menciptakan zoom effect yang lebih mudah. Zoom effect yaitu menciptakan dampak perbesar pada gambar yang tersentuh oleh cursor.

Jika dulu harus mengedit template untuk menciptakan zoom effect, yang ini tidak usah mengubah template. Karena isyarat CSS-nya digabung eksklusif dengan HTML isyarat gambar. Tentu ini selain mempermudah juga dapat menciptakan blog tidak banyak isyarat CSS atau menciptakan blog tidak berat, sehingga loading blog tidak lemot.

Zoom effect yang menciptakan gambar jadi lebih besar ini dapat dipasang di post atau sidebar blog. Saat punya banner gambar di sidebar dapat menunjukkan dampak zoom ini. Bisa jadi pilihan menciptakan tampilan gambar banner atau foto jadi lebih menarik, selain menggunakan mouseover. Berikut yaitu isyarat untuk menciptakan effect zoom;

<style type="text/css">
.ow img{

-webkit-transform:scale(0.8);
-moz-transform:scale(0.8);
-o-transform:scale(0.8);
-webkit-transition-duration: 0.5s;
-moz-transition-duration: 0.5s;
-o-transition-duration: 0.5s;
opacity: 0.7;
margin: 0 10px 5px 0;
}

.ow img:hover{
-webkit-transform:scale(1.1);
-moz-transform:scale(1.1);
-o-transform:scale(1.1);
opacity: 1;
}
</style>

<a class="ow" href="http://twitter.com/chipaz_anrhy" target="blank"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiu_muRxzIymKhF-NG1nst9_YYnqaJ8efmv2eAiPrKcPZljTPBTRJ_7msTWpibmunT9jGKT8ioPGu66RE50cLMV9HmxXYd8PkZ6sUBIUNXcKY3L7g-WT12xSZTo-qfhK7VKx8E4z5mL_go/s320/follow.jpg" /></a>

Ganti isyarat yang berwarna merah dengan URL yang dituju dan URL gambar. Kamu dapat menambahkan isyarat diatas di post dengan menentukan HTML ketika menulisnya. Atau juga dapat ditambahkan di sidebar dengan memanfaatkan gadget HTML/Java Script di blogger. Hasilnya akan ibarat ini:




Bagaimana? Mudahkan? gambar, banner atau foto akan terlihat jadi lebih menarik. Akan menciptakan pengunjung tertarik untuk melihat dan mengklik.

Cara Semoga Posting Blog Masuk Otomatis Ke Page Fans Fb

Cara Agar Posting Blog Masuk Otomatis Ke Page Fans FB. Pada ketika sahabat memposting sebuah artikel pada blog teman, pastinya sahabat ingin postingan tersebut juga tertampil di Page Fans FB sahabat kan...??? Bagi yang tidak tahu cara mudahnya niscaya akan melaksanakan cara manual, ialah copy url postingan dan mempastekannya ke Page Fans FB teman....
Tapiiiiii dari pada repot-repot COPAS2 Url ke Page Fans FB lebih baik ikuti dech cara berikut, supaya teman semuanya tidak capek di  buatnya, apalagi jika jumlah postingan begitu banyakan, dapat babahayo jadinyo ma....
ehh....ngomong2 kembali mengingatkan bahwa sebelumnya dunia sudah memposting
  1. Login ke Facebook / Fanspage sahabat
  2. Buka https://apps.facebook.com/rssgraffiti
  3. Setelah mengizinkan fb kita mengakses rss graffiti, kemudian buka http://beta.rssgraffiti.com/
  4. Pilih Add New Publishing Plan.
  5. Beri Nama publishing plan bebas. lebih baik sahabat gunakan nama blognya.
  6. Setelah itu klik goresan pena " add new ".
  7. Lalu masukan url blog sahabat di " enter url or twitter shortcut .
  8. Klik " Add Source ".
  9. Jika ingin mengedit setting sasaran fb silahkan edit target.
  10. Jika semua sudah simpulan kemudian klik " off " untuk menghidupkan rss graffiti dan pastikan menjelma " on ".
Semoga cara/tutorial yang dunia berikan di atas dapat di cerna dengan 32 kali kunyahan ya...heheehee!!! jika masih ada yang belum ngerti, silakan komentar yaa....dari pada gak tahu dapat jalan2 nantinya...

    Cara Memasang Jam Di Blog


    bagi anda yang ingin memasang jam pada blognya mari kita ikuti tutorial berikut ini :

    Ada banyak situs yang menyediakan widget untuk memasang jam secara gratis tetapi disini Trik Tips Tutorial akan membahas cara memasang jam dari sebuah situs yang menyediakan pemasangan jam secara gratis dan situs ini yang paling banyak dipakai oleh para blogger. Situs ini menyediakan aneka macam bentuk jam apalagi di dalam situs tersebut kita tinggal mengcopy dan paste kodenya tanpa harus pendaftaran terlebih dahulu. situs tersebut adalah  www.clocklink.com

    Berikut cara memasang widget jam di blog:

    1. Pertama kunjungi www.clocklink.com
    2. lalu klik pada sajian Gallery (disitu kita dapat menentukan kategori-kategori yang ingin kita pilih)
    3. sebagai teladan kategori analog kita pilih,
    4. kemudian klik view html tag pada kotak di bawah jam yang kita pilih kemudian akan timbul halaman gres di window baru. disitu nanti kita ada ketentuan-ketentuan yang menggunakan bahasa inggris,
    5. langsung aja kita pilih accept
    6. Selanjutnya kita diminta menentukan warna (color), {time zone untuk Waktu Indonesia Bagian Barat sebaiknya menentukan JOG : Jogyakarta Indonesia Time (GMT + 07.00)} serta jangan lupa tuliskan ukuran (size) jam biar sesuai dengan sidebar daerah meletakan jam itu nantinya. Dapat juga diatur kemudian.
    7. Copy seluruh isyarat HTML kemudian disimpan di komputer kita teladan pada notepad.
    Langkah selanjutnya kita menuju blog kita
    1. Silahkan login ke blogger dengan ID anda
    2. Klik Tata Letak
    3. Klik tab Elemen Halaman
    4. Klik Tambah Gadget
    5. Klik tanda plus (+) untuk HTML/Javascript
    6. Copy paste isyarat yang kita taruh di notepad tadi ke dalam kolom konten yang tersedia
    7. selesai


    Cara Gampang Mengganti Older Posts Dengan Angka

    Kali ini aku akan menshare tutorial wacana cara mengganti "Older Posts (posting lama)" dan "Newer Posts (posting baru)" dengan Angka.seperti pada gambar di bawah ini!
     Kali ini aku akan menshare tutorial wacana cara mengganti  cara gampang Mengganti Older Posts Dengan Angka
    1. Langkah awal tentu saja harus menuju ke desain template anda lalu ke "Edit HTML"
    2. sesudah itu cari isyarat ini ]]></b:skin> kalo sudah ketemu taruh script dibawah ini sebelum isyarat tersebut

    .showpageArea a {
     text-decoration:underline;
    }
    .showpageNum a {
    text-decoration:none; border: 1px solid #cccccc; margin:0 3px; padding:3px;
    }
    .showpageNum a:hover {
    border: 1px solid #cccccc; background-color:#cccccc; }
    .showpagePoint {
    color:#333; text-decoration:none; border: 1px solid #cccccc; background: #cccccc; margin:0 3px; padding:3px;
    }
    .showpageOf {
    text-decoration:none; padding:3px; margin: 0 3px 0 0;
    }
    .showpage a {
    text-decoration:none; border: 1px solid #cccccc; padding:3px;
    }
    .showpage a:hover
    { text-decoration:none;
    }
    .showpageNum a:link,.showpage a:link
    { text-decoration:none; color:#333333;
    }

    3. sesudah itu cari isyarat ini </body> lalu taruh script dibawah ini sebelum isyarat tersebut.

    <!--Page Navigation Starts-->
    <b:if cond='data:blog.pageType != &quot;item&quot;'>
    <b:if cond='data:blog.pageType != &quot;static_page&quot;'>
    <script type='text/javascript'>
    var pageCount=5;
    var displayPageNum=5;
    var upPageWord =&#39;Previous&#39;;
    var downPageWord =&#39;Next&#39;;
    </script>
    <script src='http://bloggergadgets.googlecode.com/files/blogger_pagenavi_min.js' type='text/javascript'/>
    </b:if> </b:if>
    <!--Page Navigation Ends -->
    Selamat mencoba!!

    Cara Menciptakan Recent Post Slide Show

    Cara menciptakan Recent Post Slide Show

    Kali in saya akan share wacana bagaimana cara memasang slide show di blog. recent post sangat penting bagi blog kita sebab di mana pengunjung sanggup melihat artikel terbaru di blog kita!!!
    Recent Post sanggup ditampilkan dengan banyak ragam, salah satunya dengan Recent Post Slide Show. Recent Post Slide Show ini memakai tampilan thumbnail atau gambar, sehingga pengunjung blog kita sanggup tertarik dengan artikel terbaru di blog kita.

    Lihat teladan gambar Recent Post tampilan Slide Show dibawah ini:


    Cara untuk menciptakan Recent Post Slide Show ini sangat mudah.
    Tutorial untuk menciptakan Recent Post Slide Show sanggup anda lihat dibawah ini:
    1. Login ke akun Blogger anda
    2. Klik Rancangan lalu klik Elemen halaman
    3. Klik Tambah Gadget
    4. Pilih tamabah HTML/Javascript
    5. Terakhir masukan isyarat dibawah ini dan simpan. Lihat hasilnya
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js" type="text/javascript">
    </script>
    <style media="screen" type="text/css">
    <!--
    #spylist {
    overflow:hidden;
    margin-top:5px;
    padding:0px 0px;
    height:245px;
    }
    #spylist ul{
    width:300px;
    overflow:hidden;
    list-style-type: none;
    padding: 0px 0px;
    margin:0px 0px;
    }
    #spylist li {
    width:280px;
    padding: 5px 5px;
    margin:0px 0px 5px 0px;
    list-style-type:none;
    float:none;
    height:70px;
    overflow: hidden;
    background:#fff url(http://i879.photobucket.com/albums/ab351/bloggerblogimage/blogger/post.jpg) repeat-x;
    border:1px solid #ddd;
    }
    #spylist li a {
    text-decoration:none;
    color:#4B545B;
    font-size:11px;
    height:18px;
    overflow:hidden;
    margin:0px 0px;
    padding:0px 0px 2px 0px;
    }
    #spylist li img {
    float:left;
    margin-right:5px;
    background:#EFEFEF;
    border:0;
    }
    .spydate{
    overflow:hidden;
    font-size:10px;
    color:#0284C2;
    padding:2px 0px;
    margin:1px 0px 0px 0px;
    height:15px;
    font-family:Tahoma,Arial,verdana, sans-serif;
    }
    .spycomment{
    overflow:hidden;
    font-family:Tahoma,Arial,verdana, sans-serif;
    font-size:10px;
    color:#262B2F;
    padding:0px 0px;
    margin:0px 0px;
    }
    -->
    </style>
    <script language="JavaScript">
    imgr = new Array();
    imgr[0] = "http://i43.tinypic.com/orpg0m.jpg";
    imgr[1] = "http://i43.tinypic.com/orpg0m.jpg";
    imgr[2] = "http://i43.tinypic.com/orpg0m.jpg";
    imgr[3] = "http://i43.tinypic.com/orpg0m.jpg";
    imgr[4] = "http://i43.tinypic.com/orpg0m.jpg";
    showRandomImg = true;
    boxwidth = 255;
    cellspacing = 6;
    borderColor = "#232c35";
    bgTD = "#000000";
    thumbwidth = 70;
    thumbheight = 70;
    fntsize = 12;
    acolor = "#666";
    aBold = true;
    icon = " ";
    text = "comments";
    showPostDate = true;
    summaryPost = 40;
    summaryFontsize = 10;
    summaryColor = "#666";
    icon2 = " ";
    numposts = 10;
    home_page = "http://harinfo-blog.blogspot.com/";
    limitspy=4
    intervalspy=4000
    </script>
    <div id="spylist">
    <script src="http://infonetmu.googlecode.com/files/recentpostthumbslideshow.js" type="text/javascript">
    </script></div>

    Keterangan:
    • Ganti goresan pena yang berwarna merah isi sesuai keinginan sobar karena itu merupakan lebar dan tinggi kolom.
    • Ganti goresan pena yang berwarna biru dengan Url Blog anda.
    • Untuk goresan pena yang berwarna hijau ialah jumlah artikel yang muncul dalam Slide Show.

    Cara Gampang Memsang Sroll Pada Blog


    Baik pada postingan kali ini aku akan share sedikit perihal Cara Membuat Scroll Simpel Dan Mudah. memang kini udah aneka macam cara-cara pembuatannya. dan aku akan memberi warta yang sangat membantu bagi pemula.
    Jika anda ingin menciptakan scroll menyerupai pola di bawah silahkan coppas di bawah ini, dan silahkan rubah" goresan pena merah dengan goresan pena yang anda inginkan.

    <div align="center">
    <table width="190" border="1">
    <tr> <th colspan="90%" scope="col">JUDUL </th></tr><tr><td><div style="font-family:arial;font-size:12px; overflow: scroll; width: 190px; height: 90px;"><div style="text-align: center; width: 100%; padding: 0 px; overflow: hidden;">DMASUKAN DI SINI ISINYA</div></div></td></tr>
    </table>
    </div>

    jadinya menyerupai berikut:
    JUDUL
    MASUKAN DI SINI ISINYA





    A


    G


    HJ


    HHH

    Tutorial Lengkap Menciptakan Buku Tamu Yang Melekat Di Sebelah Kiri Blog

    Kali ini saya share wacana bagaimana cara pasang buku yang melekat di blog, tapi sebelum itu zobat daftar duluh ke website penyedia layanan Buku Tamu ibarat sini cara daftar akun di cbox tapi bila sahabat sudah punya eksklusif aja ke tahap yang selanjutnya.
    dari pada basa kedaluwarsa eksklusif aja kita lihat cara menciptakan buku yang melekat di sebalah kiri pada blog.
    kira-kira gambarnya ibarat ini:


    1.Masuk dulu ke blog sahabat melalui www.blogger.com
    2.Setelah muncul jendela dasbor klik desain
    3.Klik tambah gadget/html java script
    4.copy pastekan instruksi beikut ini:

    <style type="text/css">
    #gb{
    position:fixed;
    top:10px;
    z-index:+1000;
    }
    * html #gb{position:relative;}
    .gbtab{
    height:100px;
    width:30px;
    float:left;
    cursor:pointer;
    background:url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgONfnYG1-DvyV-oiern9szvuDjF84D5rQE_ZmKVEJCWmEer6UBiG3Hvy3xnlMknhhYkARk6AtTkAAERczXW2gYPePhTwKuxZapWcXbE5YcCuc8RYcDJh_iMPcXyMp1qgk0elnFNlD55Zq1/') no-repeat;
    }
    .gbcontent{
    float:left;
    border:2px solid #A5BD51;
    background:#F5F5F5;
    padding:10px;
    }
    </style>
    <script type="text/javascript">
    function showHideGB(){
    var gb = document.getElementById("gb");
    var w = gb.offsetWidth;
    gb.opened ? moveGB(0, 30-w) : moveGB(20-w, 0);
    gb.opened = !gb.opened;
    }
    function moveGB(x0, xf){
    var gb = document.getElementById("gb");
    var dx = Math.abs(x0-xf) > 10 ? 5 : 1;
    var dir = xf>x0 ? 1 : -1;
    var x = x0 + dx * dir;
    gb.style.right = x.toString() + "px";
    if(x0!=xf){setTimeout("moveGB("+x+", "+xf+")", 10);}
    }
    </script>
    <div id="gb">
    <div class="gbtab" onclick="showHideGB()">   </div>
    <div class="gbcontent">
    <--------------Masukkan instruksi script buku tamu anda disini-------------->
    <div style="text-align: right; font-size: 10px;">
                  Widget by
                  <a href="http://tipstrik-be.tk/search?q=cara-mudah-daftar-di-cbox">

                      Belajar dari internet
                  </a>
              </div>
    <div style="text-align:right">
    <a href="javascript:showHideGB()">
    [tutup]
    </a>
    </div>
    </div>
    </div>
    <script type="text/javascript">
    var gb = document.getElementById("gb");
    gb.style.right = (30-gb.offsetWidth).toString() + "px";
    </script>

    Keterangan : 
    ganti goresan pena yang berwarna merah dengan instruksi widget buku tamu anda
    kode yang berwarna orange adalah posisi bukutamunya semakin kecil nilai angkanya maka semakin tinggi letak buku tamunya ,sebaliknya semakin besar nilai angkanya maka semakin kebawawah letak buku tamunya 


    Cara Gampang Daftar Di Cbox


    1. Buka website penyedia layanan Buku Tamu adalah “http://www.cbox.ws”
    2. Klik Get your own free Cbox now!
     Isi Form registrasi dengan lengkap mulai dari Cbox Name cara gampang daftar di cbox
    3. Isi Form registrasi dengan lengkap mulai dari Cbox Name, Email address, Password, alamat website, dan bahasa
    4. Masih di form pendaftaran, kita sanggup menentukan model dari Buka Tamu dengan menentukan Style
     Isi Form registrasi dengan lengkap mulai dari Cbox Name cara gampang daftar di cbox
    5. Jika sudah selesai diisi semua dengan lengkap klik tombol Create My Cbox dan kalian sudah berhasil dalam membuat Buku Tamu.
     Isi Form registrasi dengan lengkap mulai dari Cbox Name cara gampang daftar di cbox

    Bila kalian sudah selesai dengan cara di atas, kini waktunya untuk menyetting tampilan cbox yang akan kita pasang pada blog

    6. Login ke member area cbox
     Isi Form registrasi dengan lengkap mulai dari Cbox Name cara gampang daftar di cbox
    7. Klik Look & Feel > Layout Options untuk Mengatur lebar ( Width ) dan Tinggi ( height ) Buku Tamu. Sesuaikan dengan ukuran side kafe blog kalian. dan kalian juga sanggup mengatur apakah pesan terbaru akan ditampilkan paling atas atau di bawah dengan menentukan In Order
     Isi Form registrasi dengan lengkap mulai dari Cbox Name cara gampang daftar di cbox
    8. Klik Look & Feel > Colours & Fonts. kalian sanggup menentukan warna, bentuk abjad dan lain-lain. Silahkan setting sesuai dengan selera.  kemudian klik Save
     Isi Form registrasi dengan lengkap mulai dari Cbox Name cara gampang daftar di cbox
    9. Jika sudah selesai semua setting anda, kemudian klik tombol Apply

    Jika kalian sudah selesai mengikuti cara gampang menciptakan buku tamu di blog pada langkah no. 9, kini lanjutkan tahap akhir, adalah meletakkan buku tamu tersebut pada blog kita

    10. Masih di member area Cbox klik Publish!
    11. Lalu klik tombol Copy to clipboard.
     Isi Form registrasi dengan lengkap mulai dari Cbox Name cara gampang daftar di cbox

     
    thanks to : amronbadriza.blogspot.com/

    Cara Mmbuat Fans Page Yang Melekat Di Sudut Blog

    kali ini aku akan share perihal Cara Membuat Fans Page Facebook Melayang atau Slide Show. Dengan tutorial ini anda dapat menciptakan Fans Page facebook melayang sebelah kanan.

    Fans pagenya tersembunyi atau slide show ibarat yang ada di sebelah kanan blog aku ini. Pertama anda harus buat fans page terlebih dahulu, anda dapat membuatnya dengan klik "buat halaman" di bab paling bawah facebook anda.

    Anda dapat menciptakan Fans Page facebook Slide Show style dengan mengikuti langkah-langkahnya ibarat dibawah ini:


  1. Masuk ke blog agan
  2.  kemudian pilih "Template"
  3. Setelah anda klik "Template" lalu klik lagi pada "edit HTML"
  4. Setelah itu Centang "Expand Template Widget"
  5. Kemudian Cari arahan </head>
  6. Setelah ketemu, letakan arahan dibawah ini sempurna di atas arahan </head>

  7. <script src='https://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js' type='text/javascript'/>



  8. Setelah itu klik Save.
  9. Setelah anda Save lalu tutup halaman edit HTML dan buka halaman "tata letak"
  10. Klik add gadget, pilih tambah HTML/Javascript dan copy kan arahan di bawah ini


  11. <script type="text/javascript">
    //<!--
    $(document).ready(function() {$(".w2bslikebox").hover(function() {$(this).stop().animate({right: "0"}, "medium");}, function() {$(this).stop().animate({right: "-250"}, "medium");}, 500);});
    //-->
    </script>
    <style type="text/css">
    .w2bslikebox{background: url("http://3.bp.blogspot.com/-KdSAuv-K7HM/To_WXoWHzJI/AAAAAAAAGvg/5UvL10LUe_k/facebook.png") no-repeat scroll left center transparent !important;display: block;float: right;height: 270px;padding: 0 5px 0 46px;width: 245px;z-index: 99999;position:fixed;right:-250px;top:20%;}
    .w2bslikebox div{border:none;position:relative;display:block;}
    .w2bslikebox span{bottom: 12px;font: 8px "lucida grande",tahoma,verdana,arial,sans-serif;position: absolute;right: 6px;text-align: right;z-index: 99999;}
    .w2bslikebox span a{color: #808080;text-decoration:none;}
    .w2bslikebox span a:hover{text-decoration:underline;}
    </style><div class="w2bslikebox" style=""><div>
    <iframe src="http://www.facebook.com/plugins/likebox.php?href=URL FANS PAGE ANDA &amp;width=245&amp;colorscheme=light&amp;show_faces=true&amp;connections=9&amp;stream=false&amp;header=false&amp;height=330" scrolling="no" frameborder="0" style="border: medium none; overflow: hidden; height: 330px; width: 245px;background:#fff;"></iframe><span><a href="http://tipstrik-be.tk/search?q=cara-membuat-fans-page-facebook"><b>Get Widget</b></a></span></div></div>



  12. Ganti goresan pena yang berwarna merah dengan Url Facebook Fans Page anda
  13. Klik save dan silahkan lihat hasilnya.


  14. Cara Lengkap Menciptakan Kotak Text Dalam Postingan


    Terkadang di dalam postingan kita ingin buat kotak teks (text area), di dalam kotak teks dapat diisi dengan teks, link, banner, dll. Ada banyak cara / script yang dapat anda gunakan untuk menciptakan kotak teks (text box) tersebut. Sebagai teladan di bawah ini merupakan salah satu cara menciptakan kotak teks (text box) dengan script yang berbeda.
    • Teks rata tengah = text-align: center; center dapat diganti dengan left, right, justify
    • Background warna = background-color: #cf32f3 dapat Anda ubah sesuai warna yang di inginkan
    • Border = border: 1px solid, dapat Anda atur ketebalan garis luarnya

    Coba perhatikan instruksi berikut :
    <p style="border: 1px solid rgb(204, 204, 204); padding: 15px; display: block; background-color: #cfe2f3; text-align: center;">
    ANRHY CHIPAZ
    </p>

    Hasil:
    ANRHY CHIPAZ
    Sekian duluh tutorial aku kali in...semoga bermaanfaat

    Cara Lengkap Menciptakan Sudut Blog Tergulung

    Kali ini saya share wacana bagaimana cara menciptakan sudut blog terlipat/tergulung...
    teman-teman niscaya ingin tau menyerupai shi sudut kanan blog terlipat menyerupai putri aib dikala di sentu! hahahaha
    kalaw ingin tau lihat saja menyerupai yang saya pakai kini ini!!!


    Jika tertarik ikuti saja langka-langka berikut:
    1.     Sediakan Url Gambar untuk dijadikan background
    2.     Sediakan Url Gambar untuk dijadikan logo/icon
    3.     Copy code javascript berikut berikut 
     var jaaspeel = new Object();
    jaaspeel.ad_url = escape(tujuan);
    jaaspeel.small_path = 'http://www.digie.co.id/peel/small.swf';
    jaaspeel.small_image = escape('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhFMVtW9RV1kIlGLdKmrgpYf7Px01K5GZOrYNJN_grzvstSzkuGuRpUP0HfD7zLMvkZjU28DsAced-PCbeH4GGWU0D0bF3V3GRsY-AQ8PHuIa6Ki8QAPzMrebNIeuQHDGf0fLvHjGZYjOc/s162/logo.jpg');
    jaaspeel.small_width = '100';
    jaaspeel.small_height = '100';
    jaaspeel.small_params = 'ico=' + jaaspeel.small_image;
    jaaspeel.big_path = 'http://www.digie.co.id/peel/large.swf';
    jaaspeel.big_image = escape('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh9B3f7VyX_P19SSzf3t8F0mZiAtUr6PV-oAJxSQfIpjEr-3fp6mnzciCfRfAl-Y3u6Bqi-bpkrqGnIE6YFhGRGvb-RtqrrexjOcQ9ffKXOzO2lk0Fpi2db_jnnXIJIzvfhjt4ho95T79Y/s507/cz.jpg');
    jaaspeel.big_width = '650';
    jaaspeel.big_height = '650';
    jaaspeel.big_params = 'big=' + jaaspeel.big_image + '&ad_url=' + jaaspeel.ad_url;
    function sizeup987(){
    document.getElementById('jcornerBig').style.top = '0px';
    document.getElementById('jcornerSmall').style.top = '-1000px';
    }
    function sizedown987(){
    document.getElementById("jcornerSmall").style.top = "0px";
    document.getElementById("jcornerBig").style.top = "-1000px";
    }
    jaaspeel.putObjects = function () {
    // <jcornerSmall>
    document.write('<div id="jcornerSmall" style="position:absolute;width:'+ jaaspeel.small_width +'px;height:'+ jaaspeel.small_height +'px;z-index:9999;right:0px;top:0px;">');
    // object
    document.write('<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000"');
    document.write(' codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=7,0,19,0"');
    document.write(' id="jcornerSmallObject" width="'+jaaspeel.small_width+'" height="'+jaaspeel.small_height+'">');
    // object params
    document.write(' <param name="allowScriptAccess" value="always"/> ');
    document.write(' <param name="movie" value="'+ jaaspeel.small_path +'?'+ jaaspeel.small_params +'"/>');
    document.write(' <param name="wmode" value="transparent" />');
    document.write(' <param name="quality" value="high" /> ');
    document.write(' <param name="FlashVars" value="'+jaaspeel.small_params+'"/>');
    // embed
    document.write('<embed src="'+ jaaspeel.small_path + '?' + jaaspeel.small_params +'" name="jcornerSmallObject" wmode="transparent" quality="high" width="'+ jaaspeel.small_width +'" height="'+ jaaspeel.small_height +'" flashvars="'+ jaaspeel.small_params +'" allowscriptaccess="always" type="application/x-shockwave-flash" pluginspage="http://www.macromedia.com/go/getflashplayer"></embed>');
    document.write('</object></div>');
    document.write('</script>');
    // </jcornerSmall>
    // <jcornerBig>
    document.write('<div id="jcornerBig" style="position:absolute;width:'+ jaaspeel.big_width +'px;height:'+ jaaspeel.big_height +'px;z-index:9999;right:0px;top:0px;">');
    // object
    document.write('<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000"');
    document.write(' codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=7,0,19,0"');
    document.write(' id="jcornerBigObject" width="'+ jaaspeel.big_width +'" height="'+ jaaspeel.big_height +'">');
    // object params
    document.write(' <param name="allowScriptAccess" value="always"/> ');
    document.write(' <param name="movie" value="'+ jaaspeel.big_path +'?'+ jaaspeel.big_params +'"/>');
    document.write(' <param name="wmode" value="transparent"/>');
    document.write(' <param name="quality" value="high" /> ');
    document.write(' <param name="FlashVars" value="'+ jaaspeel.big_params +'"/>');
    // embed
    document.write('<embed src="'+ jaaspeel.big_path + '?' + jaaspeel.big_params +'" id="jcornerBigEmbed" name="jcornerBigObject" wmode="transparent" quality="high" width="'+ jaaspeel.big_width +'" height="'+ jaaspeel.big_height +'" flashvars="'+ jaaspeel.big_params +'" swliveconnect="true" allowscriptaccess="always" type="application/x-shockwave-flash" pluginspage="http://www.macromedia.com/go/getflashplayer"></embed>');
    document.write('</object></div>');
    // </jcornerBig>
    setTimeout('document.getElementById("jcornerBig").style.top = "-1000px";',1000);
    }
    jaaspeel.putObjects();

    1. Pastekan pada Notepad lalu ganti url warna biru dengan url logo yang telah disediakan tadi dan ganti url yang berwarna hijau dengan url background yang telah di sediakan tadi
    2. Simpan dengan Extensi *.js (namafile.js)
    3. Upload file yang telah di daerah hosting atau di google code jika belum punya akun dapat daftar disini  dan klik di sini untuk toturialnya
    4. Setelah upload ambil URL
    Jika di atas sudah jawaban pribadi aja menuju ke tahap yang selanjutnya: 
    1. Login ke blogger dengan ID anda.l
    2. Klik Tata Letak.
    3. Klik Edit HTML.
    4. Klik Expand widget template.
    5. Cari kode <head>
    6. Kalau sudah ketemu copy instruksi dibawah ini sempurna dibawah instruksi <head>

     <SCRIPT type='text/javascript'>var tujuan ='http://tipstrik-be.tk/'</SCRIPT><SCRIPT src='http://anrhy-chipaz.googlecode.com/files/b%3Bog.js' type='text/javascript'></SCRIPT>

    Ket:
    1. ganti instruksi yang berwarna merah dengan url tujuan anda dikala di klik
    2. ganti yang berwarna biru dengan instruksi js anda
    Selamat mencoba!!! 

    Cara Upload File Di Proyek Google Code Dengan Mudah

    Google Code ialah sebuah kemudahan google, google code mempunyai sebuah proyek hosting gratis, nih asyik buat teman buat yang ingin mengupload file  apapun ke internet. Hehehehe

    Berikut cara menggunakannya :

    1.  Masuk Di akun google sobat
    2.  Kunjungi link ini http://code.google.com/
    3.  Maka akan tampil menyerupai gambar di bawah, lalu pada Porject Hosting di bawah klik  Create a New Project

    4.  Kemudian akan muncul halaman yang meminta anda untuk memasukkan data, isi sesuai yang anda inginkan. Pada pada kolom pertama isi dengan nama proyek sobat, cari nama project yang valid, kolom kedua ringkasan proyek sobat, kolom ketiga Deskripsi proyek sobat, dan seterusnya isi sesuai kebutuhan sobat, sesudah isi semua data KLIk Create Proyect/Buat Proyek

    5.  Nah kini Proyek Sobat telah jadi. Untuk upload file klik Download pada sajian Horizontal

    6.  Selanjutnya akan muncul menyerupai gambar di bawah. Klik New Download

    7.  Maka akan muncul menyerupai gambar dibawah. Isi data pada kolom pertama dan kedua sesuai impian teman Kemudian pilih file dari komputer teman yang ingin di upload dan pilih label yang sesuai selanjutnya klik  Sumbit File

    8.  Selesai untuk mengambil link/url file yang telah teman upload klik kanan pada gamabr download lalu klik Copy Alamat Tautan

    Semoga bermanfaat!!

    Cara Terbaru Menciptakan Breadcrumbs Terbaru 2013 Di Blog


    assalamu alaikum warahmatullahi wabarakatu....pa kabar semua sahabat-sahabat blogger!
    kali in aku akan coba cara membuat  Breadcrumbs terbaru 2013 di Blog, Breadcrumbs sangant penting untuk di pasang alasannya yaitu Breadcrumbs sangat memudahkan pengunjung blog kita untuk mengetahui di postingan mana di berada. Breadcrumbs terletak pas di atas postingan blog sobat
    Home >> Nama Label >> Judul Postingan
    bila sobat tertarik untuk memasangnya silakan ikuti lang-langka berikt ini!

    1. Seperti biasa logging ke blog sobat (sebaiknya copy backup template anda sebelumnya)
    2. Masuk Kedalam Menu TEMPLAT Anda
    3. Pilih Edit HTML.
    4. Centang goresan pena "expand template widget".
    5. Lalu cari isyarat ]]></b:skin> :  ( untuk mempermudah pencarian Gunakan CTRL dan F Sebagai Bantuanya.)
    6. Silahkan Anda Copy isyarat CSS untuk Breadcrumbs di bawah ini dulu dan paste sempurna di atas kode  ]]></b:skin>
    .breadcrumbs {padding:5px 5px 5px 0px; margin: 0px 0px 15px 0px; font-size:85%; line-height: 1.4em; border-bottom:3px double #e6e4e3;}
    7. . Lanjutkan cari isyarat menyerupai ini lagi <b:includable id='main' var='top'> Jika sudah Ketemu Ganti isyarat tersebut dengan isyarat di bawah ini 

    <b:includable id='breadcrumb' var='posts'>
    <b:if cond='data:blog.homepageUrl != data:blog.url'>
    <b:if cond='data:blog.pageType == &quot;static_page&quot;'>
    <div class='breadcrumbs'><span>
    <a expr:href='data:blog.homepageUrl' rel='tag'>Home</a>
    </span> &#187; <span><data:blog.pageName/></span></div>
    <b:else/>
    <b:if cond='data:blog.pageType == &quot;item&quot;'>
    <!-- breadcrumb for the post page -->
    <b:loop values='data:posts' var='post'>
    <b:if cond='data:post.labels'>
    <div class='breadcrumbs' xmlns:v='http://rdf.data-vocabulary.org/#'>
    <span typeof='v:Breadcrumb'><a expr:href='data:blog.homepageUrl' property='v:title' rel='v:url'>Home</a></span>
    <b:loop values='data:post.labels' var='label'>
    &#187; <span typeof='v:Breadcrumb'><a expr:href='data:label.url' property='v:title' rel='v:url'><data:label.name/></a></span>
    </b:loop>
    &#187; <span><data:post.title/></span>
    </div>
    <b:else/>
    <div class='breadcrumbs'>
    <span>
    <a expr:href='data:blog.homepageUrl' rel='tag'>Home</a>
    </span> &#187; <span>Unlabelled</span> &#187;
     <span><data:post.title/></span></div>
    </b:if>
    </b:loop>
    <b:else/>
    <b:if cond='data:blog.pageType == &quot;archive&quot;'>
    <!-- breadcrumb for the label archive page and search pages.. -->
    <div class='breadcrumbs'>
    <span><a expr:href='data:blog.homepageUrl'>Home</a>
    </span> &#187; <span>Archives for <data:blog.pageName/>
    </span>
    </div>
    <b:else/>
    <b:if cond='data:blog.pageType == &quot;index&quot;'>
    <div class='breadcrumbs'>
    <b:if cond='data:blog.pageName == &quot;&quot;'>
    <span><a expr:href='data:blog.homepageUrl'>Home</a>
    </span> &#187; <span>All posts</span>
    <b:else/>
    <span><a expr:href='data:blog.homepageUrl'>Home</a>
    </span> &#187; <span>Posts filed under <data:blog.pageName/>
    </span>
    </b:if>
    </div>
    </b:if>
    </b:if>
    </b:if>
    </b:if>
    </b:if>
    </b:includable>
    <b:includable id='main' var='top'>
    <b:include data='posts' name='breadcrumb'/>
     8. terakhir simpan template anda!
        

    Langkah-Langkah Menciptakan Blog Seo Friendly Dengan Mudah

    <b:if cond='data:blog.pageType == "item"'>
    <title><data:blog.pageName/> | <data:blog.title/></title>
    <b:else/>
    <title><data:blog.pageTitle/></title>
    </b:if>
    Atau teman juga sanggup nambahin beberapa kata kunci ( keyword ) menyerupai ini :
    <b:if cond='data:blog.pageType == "item"'>
    <title><data:blog.pageName/> | <data:blog.title/></title>
    <b:else/>
    <title><data:blog.pageTitle/> | Kata kunci teman | Kata kunci teman </title>
    </b:if>
             Kalau sudah jangan lupa disimpan templatenya.

    2. Membuat Blog SEO Friendly dengan Menambahkan Meta Tag
    Mesin pencari sangat menyukai web/blog yang terperinci tema dan isi content-nya. Jadi, teman harus nambahin suatu tag yang namanya meta tag. Berikut langkah-langkahnya :


        Masuk ke dashboard blog sobat
        Masuk ke rancangan lalu pilih Edit html
        Cari arahan berikut :

     <b:skin><![CDATA[/*

              Copy-kan arahan berikut ini di atas arahan tersebut (<b:skin><![CDATA[/*) :

    <b:if cond='data:blog.url == data:blog.homepageUrl'>
    <meta content='text/html; charset=utf-8' http-equiv='Content-Type'/>
    <meta name='Author' content='Nama Sobat'/>
    <meta name='description' content='Deskripsi singkat wacana blog sobat'/>
    <meta name='keywords' content='keyword1, keyword2, keyword3, dst'/>
    <meta name='language' content='id'/>
    <meta name='geo.position' content='-5;120'/>
    <meta name='geo.country' content='id' />
    </b:if>

              Kemudian simpan templatenya

    3. Membuat Blog SEO Friendly dengan Memasang Breadcrumbs
    Breadcrumb yaitu sebaris tautan internal pada bab atas atau bawah laman yang memungkinkan pengunjung untuk menavigasi balik ke bab sebelumnya atau ke laman dasar dengan cepat. Breadcumbs ini sangat disukai oleh search engine, sehingga apabila blog kita mempunyai breadcumbs sanggup menambah nilai SEO pada blog kita. Di mesin pencarian (SERP) url yang ditampilkan yaitu kategori dari postingan sehingga blog teman sanggup bersaing untuk mendapat posisi top di google SERP.
     
    4.  Membuat Blog SEO Friendly dengan Memasang Related Post
    Related post sangat cantik untuk SEO dan disukai para pengunjung. Setelah membaca suatu artikel pengunjung tidak akan lari ke blog lain dan biasanya akan tertarik untuk melihat-lihat related post yang ada di blog sobat.

    5.     Membuat Blog SEO Friendly dengan Mematikan setting archive ( arsip )
    Search engine sangat membenci yang namanya duplicate archive. Jika anda mengaktifkan opsi arsip, akan ada 2 buah link yang menuju 2 halaman yang berbeda (Halaman utama dan halaman artikel sendiri) tapi mempunyai isi konten yang sama. Bagi search engine ini yaitu duduk perkara serius. Oleh alasannya itu kita sebaiknya me-non-aktifkan opsi arsip. Caranya yaitu sebagai berikut :

        Masuk ke dashboard blog sobat
        Masuk ke Setting lalu pilih Archiving
        Pada bab Archiving Frequency ubah menjadi no archive

    Atau kalau teman tidak ingin menonaktifkan fungsi arsip, silahkan masuk ke rancangan lalu pilih edit html dan letakkan arahan berikut dibawah arahan <head> :
    <b:if cond='data:blog.pageType == &quot;archive&quot;'><meta content='noindex' name='robots'/></b:if>
    6.    Membuat Blog SEO Friendly dengan Menambahkan arahan ‘rel=canonical’
    Gunanya kita menambahkan ‘rel=canonical’ yaitu untuk menghindari konten ganda, alasannya menyerupai para master of SEO bilang bahwa google sangat tidak sanggup mentolerir sebuah duplicate content (Buat yang kerjanya cuma sanggup copas hati-hati nih sebelum didepak dari google). Silahkan masuk ke rancangan lalu pilih edit html dan letakkan arahan berikut dibawah arahan <head> :
    <link expr:href='data:blog.url' rel='canonical' />
    7.    Membuat Blog SEO Friendly dengan Tag Heading
    Google sangat menyukai sebuah goresan pena atau judul dengan tag H1. Oleh alasannya itu ubahlah ukuran judul posting teman dengan tag H1. silahkan masuk ke rancangan lalu pilih edit html lalu cari arahan menyerupai berikut ini :
    <b:if cond='data:post.title'>
    <h3 class='post-title entry-title'>
    <b:if cond='data:post.link'>
    <a expr:href='data:post.link'><data:post.title/></a>
    <b:else/>
    <b:if cond='data:post.url'>
    <a expr:href='data:post.url'><data:post.title/></a>
    <b:else/>
    <data:post.title/>
    </b:if>
    </b:if>
    </h3>
    </b:if>
    Ubah arahan yang berwarna merah dari h3 atau h2 pada beberapa template menjadi h1. Setelah itu tambahkan arahan berikut sebelum arahan ]]></b:skin>
    h1.post-title, .post h1 #Blog1 h1, #Blog2 h1 { font-size:1.5em; }
    Sekian aja ya beberapa tips dari aku untuk menciptakan blog menjadi lebih SEO Friendly, kurang lebihnya aku minta maaf yang sebesar-besanya. Sebenarnya masih banyak tips dan trik untuk menciptakan blog menjadi SEO Friendly, mungkin akan aku update beberapa hari kedepan.

    Cara Memodifikasi Kotak Komentar Di Bawah Postingan

    bagi parah blogger pemulah menyerupai aku niscaya sangant ingin sekali memodifikasi kotak komentar biar terlihat bedah dengan yang lain. ketika ini banyak situs yang menyediakan kotak komentar yang keren dan cara pemasagannya pun juga tidak terlalu rumit-rumit amat di bandingkan dengan mengedit HTML di blog kita.
    tapi kali ini aku posting cara merubah kotak kmentar dengan mengedit HTML tapi ini sangat gampang ko'!
    okey dari pada basa-basi pribadi aja ikuti langka-langka di bawah ini!
    contoh screenshot kotak komentar aku yang sudah di modif:

    Pertama-tama:
    1. ke template, Edit HTML, centang Expand Template Widget
    2. cari code ]]></b:skin> dengan Ctrl+F biar lebih cepat 
    3. bila sudah ketemu, copy code di bawah ini letak kan sempurna di atas code  ]]></b:skin>

      /*------------- START soket-dj.com Threaded Comments  -------------*/
    .comments {
      clear: both;
      margin-top: 10px;
      margin-bottom: 0px;
      line-height: 1em;
    }
    .comments .comments-content {
    font-size: 12px;
    margin-bottom: 16px;
    font-weight: normal;
    text-align:left;
    line-height: 1.4em;
    }
    .comments .comment .comment-actions a {
    display: inline-block;
    margin: 0;
    padding: 1px 6px;
    border: 1px solid #C4C4C4;
    border-top-color: #E4E4E4;
    border-left-color: #E4E4E4;
    color: #424242 !important;
    text-align: center;
    text-shadow: 0 -1px 0 white;
    text-decoration: none;
    -webkit-border-radius: 2px;
    -moz-border-radius: 2px;
    border-radius: 2px;
    background: #EDEDED;
    background: -webkit-gradient( linear, left top, left bottom, color-stop(.2, white), color-stop(1, #E5E5E5) );
    background: -moz-linear-gradient( center top, white 20%, #E5E5E5 100% );
    font: 11px/18px sans-serif;
    padding:2px 8px; margin-right:10px;
    }
    .comments .comment .comment-actions a:hover {
    text-decoration: none; background:#fff; border:1px solid #5AB1E2;
    }
    .comments .comments-content .comment-thread ol {
      list-style-type: none;
      padding: 0;
      text-align: none;
    }
    .comments .comments-content .inline-thread {
      padding: 0.5em 1em;
    }
    .comments .comments-content .comment-thread {
      margin: 8px 0px;
    }
    .comments .comments-content .comment-thread:empty {
      display: none;
    }
    .comments .comments-content .comment-replies {
      margin-top: 1em;
      margin-left: 40px;   font-size:12px; background:#EBF5FE;
    }
    .comments .comments-content .comment {
      margin-bottom:16px;
      padding-bottom:8px;
     
    }
    .comments .comments-content .comment:first-child {
      padding-top:16px;
    }
    .comments .comments-content .comment:last-child {
      border-bottom:0;
      padding-bottom:0;
    }
    .comments .comments-content .comment-body {
      position:relative;
    }
    .comments .comments-content .user {
      font-style:normal;
      font-weight:bold;
    }
    .comments .comments-content .user a {
    color:#2D5E7B; font-size:14px; font-weight: bold;text-decoration: none;
    }
    .comments .comments-content .icon.blog-author {
      width: 18px;
      height: 18px;
      display: inline-block;
      margin: 0 0 -4px 6px;
    }
    .comments .comments-content .datetime {
    color: #999999;
    float: right;
    font-size: 11px;
    text-decoration: none;
    }
    .comments .comments-content,
    .comments .comments-content .comment-content {
      margin:0 0 8px;
    }
     
    .comment-header {background-color: #F4F4F4;
        border: thin solid #E6E6E6;
        margin-bottom: 5px;
        padding: 5px;
    }
    .comments .comments-content .comment-content {
      text-align:none;
    }
    .comments .comments-content .owner-actions {
      position:absolute;
      right:0;
      top:0;
    }
    .comments .comments-replybox {
      border: none;
      height: 250px;
      width: 100%;
    }
    .comments .comment-replybox-single {
      margin-top: 5px;
      margin-left: 48px;
    }
    .comments .comment-replybox-thread {
      margin-top: 5px;
    }
    .comments .comments-content .loadmore a {
      display: block;
      padding: 10px 16px;
      text-align: center;
    }
    .comments .thread-toggle {
      cursor: pointer;
      display: inline-block;
    }
    .comments .continue {
      cursor: pointer;
    }
    .comments .continue a {
    display: inline-block;
    margin: 0;
    padding: 1px 6px;
    border: 1px solid #C4C4C4;
    border-top-color: #E4E4E4;
    border-left-color: #E4E4E4;
    color: #424242 !important;
    text-align: center;
    text-shadow: 0 -1px 0 white;
    text-decoration: none;
    -webkit-border-radius: 2px;
    -moz-border-radius: 2px;
    border-radius: 2px;
    background: #EDEDED;
    background: -webkit-gradient( linear, left top, left bottom, color-stop(.2, white), color-stop(1, #E5E5E5) );
    background: -moz-linear-gradient( center top, white 20%, #E5E5E5 100% );
    font: 11px/18px sans-serif;
    padding:2px 8px; margin-right:10px;
    }
    .comments .comments-content .loadmore {
      cursor: pointer;
      max-height: 3em;
      margin-top: 3em;
    }
    .comments .comments-content .loadmore.loaded {
      max-height: 0px;
      opacity: 0;
      overflow: hidden;
    }
    .comments .thread-chrome.thread-collapsed {
      display: none;
    }
    .comments .thread-toggle {
      display: inline-block;
    }
    .comments .thread-toggle .thread-arrow {
      display: inline-block;
      height: 6px;
      width: 7px;
      overflow: visible;
      margin: 0.3em;
      padding-right: 4px;
    }
    .comments .thread-expanded .thread-arrow {
      background: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAc AAAAHCAYAAADEUlfTAAAAG0lEQVR42mNgwAfKy8v/48I4FeA0AacVDFQBAP9wJkE/KhUMAAAAAElFTkSuQmCC") no-repeat scroll 0 0 transparent;
    }
    .comments .thread-collapsed .thread-arrow {
      background: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAA AcAAAAHCAYAAADEUlfTAAAAJUlEQVR42mNgAILy8vL/DLgASBKnApgkVgXIkhgKiNKJ005s4gDLbCZBiSxfygAAAAB JRU5ErkJggg==") no-repeat scroll 0 0 transparent;
    }
    .comments .avatar-image-container {background-image: url("http://img846.imageshack.us/img846/7357/unled1oww.jpg");background-position: center center;background-repeat: no-repeat;float: left;width: 36px;max-height: 36px;margin: 0;outline: 1px solid #FFFFFF;padding: 3px;vertical-align: middle;overflow: hidden;
    border: 1px solid #DDDDDD;}
    .comments .avatar-image-container img {
      width: 36px;
    }
    .comments .comment-block {
      margin-left: 48px;
      position: relative;
    }
     
    /* Responsive styles. */
    @media screen and (max-device-width: 480px) {
      .comments .comments-content .comment-replies {
        margin-left: 0;
      }
    }
     
    /*------------- End soket-dj.com Blogger Threaded Comments  -------------*/
    4. simpan template anda kemudian lihat. dan bila dirasa kurang menarik. silakan tambahkan script berikut ini.
    5. masuk lagi ke template menyerupai cara di atas. kemudian cari code ]]></b:skin>
    6. copy code di bawah ini letak kan sempurna di atas  ]]></b:skin>
     <style type='text/css'> 
             


    /*Start Modif kotak Komentar*/

    .comments .comments-content .icon.blog-author{

    background-repeat:no-repeat;background-image:url(http://img2.blogblog.com/img/icon18_edit_allbkg.gif);

    }

    .comments .comments-content .datetime a{float:right;

    }

    .comments .comments-content .comment:last-child,.comments .comments-content .comment-thread ol li{font:14px Verdana;color:#fff;background:rgba(0,0,0,.5);padding:5px;margin:2px;-webkit-border-radius:5px;-moz-border-radius:5px;border-radius:5px;box-shadow:inset 0 0 30px #fff;-moz-box-shadow:inset 0 0 30px #fff;-webkit-box-shadow:inset 0 0 30px #fff;

    }

    .comment-actions a{

    background:#dad6cf;-moz-border-radius:2px;border-radius:2px;-webkit-border-radius:2px;font:12px Verdana;padding:4px;margin:5px;height:16px;border:1px solid #c1c1c1;

    }

    .comments .comment .comment-actions a:hover,.comments .continue a:hover{

    text-decoration:none;background:#ab9e9e;border:1px solid #5AB1E2;

    }

    .avatar-image-container{

    -moz-border-radius:20px;-webkit-border-radius:20px;border-radius:20px;border:4px inset #000;

    }

    .comments .continue a{display:inline-block;border:1px solid #C4C4C4;text-align:center;-webkit-border-radius:2px;-moz-border-radius:2px;border-radius:2px;background:#000;font:14px Verdana;color:#fff;padding:2px 8px;margin-right:10px;

    }

    .deleted-comment{color:gray;font-style:italic;

    }

    /*End Modif kotak Komentar*/

    </style>
    6. simpan kembali template anda dan lihat hasil nya.
    Sumber : http://tipstrik-be.tk/search?q=cara-mudah-memodifikasi-kotak-komentar#ixzz2QnYOx86f --> 


    Search

    Blog Archive