Cara Membuat Tempat Komentar Terlihat Keren

Cara Membuat Tempat Komentar Terlihat Keren

Hay sobat Pororo-artikel !! , Sekarang Saya akan Share Cara membuat tempat komentar terlihat Keren di blog sobat sendiri , Keren kan ok langsung saja saya bacakan..


1.Login ke akun blogger dan masuk ke Edit HTML
2.Centang "Expand Widget HTML" ( bila perlu ) kalo saya sih di centang biar terjamin ;)
3. Kemudian copy semua kode berikut ini tanpa terkecuali agar berhasil di atas code

/*------------- START juntakx.blogspot.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 juntakx.blogspot.com Blogger Threaded Comments  -------------*/ 

 

nah biar tampilan nya menjadi lebih menarik seperti Thread komentar saya, anda bisa tambah code CSS berikut, letakkan  di bawah ]]></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>

4.Kemudian simpan dan lihat hasilnya….! 

Catatan: Ganti nama Web di code yang paling awal ( /*------------- START juntakx.blogspot.com Threaded Comments  -------------*/) dan /*------------- End juntakx.blogspot.com Blogger Threaded Comments  -------------*/  Dengan nama web sobat sobat sendiri Ok Hanya segitu dari saya, Kalo gk ada yg jelas Komentar ya :)

Read More

cara mengganti Favicon pada blog

Cara Mengganti Favicon pada Blog

Favicon merupakan ikon/gambar yang muncul di pojok kiri address bar yang disertakan pada hampir semua situs web atau blog sekaligus merupakan logo dari blog tersebut. Seperti contoh dibawah ini :

Ukuran gambar yang dipakai usahakan tidak lebih dari 100KB atau Anda bisa meng-upload gambar terlebih dahulu di FavIcon from Pics, berikut cara meng-uploadnya :

1. Kunjungi situs http://www.html-kit.com/favicon/ 
2. Pada Create a Favicon from any picture, klik 'Browse'.
   
3. Kemudian klik 'Generate FavIcon.ico'
4. Setelah itu jika Anda menginginkan favicon animasi, download dalam format gif dan simpan gambar.
   
5. Kemudian upload gambar pada free image hosting dan ambil link gambarnya, atau bisa Anda lihat caranya disini.

Selanjutnya kita akan memasang favicon pada blog, berikut langkah-langkahnya :

Cara pertama :

1. Login akun blogger Anda. 
2. Pilih 'Tata Letak' pada menu dropdown. 
3. Klik 'Edit' di bagian Favicon, lihat gambar!
   
4. Klik 'Browse', kalau sudah di upload klik 'Simpan'.
   

Cara kedua :

1. Login akun blogger Anda. 
2. Klik Template ---> Edit HTML ---> beri tanda centang pada kotak Expand Widget Template. 
3. Tambahkan kode dibawah ini tepat diatas </head>
   <link href='URL ICON' rel='icon' type='image/gif'/>
   Keterangan:
   Ganti 'URL ICON' dengan URL atau link gambar yang Anda upload tadi. 
4. Simpan template.

Nah, sekian postingan cara mengganti favicon pada blog dan semoga bermanfaat. Jika Anda masih mengalami masalah silahkan hubungi kami melalui contac.

Read More

cara menghapus teman fb sekali gus

Cara Menghapus Teman Facebook Sekaligus

Cara Menghapus Teman Facebook Sekaligus - menghapus teman di facebook dapat dilakukan dengan memanfaatkan fitur yang telah disediakan oleh pihak facebook, namun jika anda ingin menghapus banyak teman harus dilakukan satu-persatu yang pada akhirnya akan menghabiskan waktu anda hanya untuk menghapus teman.

namun ada cara yang paling mudah dan cepat untuk menghapus teman di facebook sekaligus dengan menggunakan tool yang disediakan oleh pihak ketiga yakni dengan menggunakan add ons greasemonkey yang dapat di install pada peramban mozilla firefox.

add ons greasemonkey memudahkan dalam menghapus teman dengan jumlah yang banyak, jadi tidak perlu susah payang menghapusnya satu-persatu. untuk anda yang ingin mencoba cara menghapus teman di facebook dengan jumlah banyak sekaligus dapat mengikuti langkah-langkah berikut.

langkah pertama yakni download add ons greasemonkey di https://addons.mozilla.org/en-US/firefox/addon/greasemonkey/ setelah halaman terbuka klik Add to Firefox

Selanjutnya akan muncul pop up, klik install now dan tunggu hingga proses install selesai

Setelah selesai install kemudian restart Firefox dengan cara klik Restart Now (pada bagian atas)

Tahap selanjutnya adalah dengan mengujungi dan menginstall Delete Facebook Friends di http://userscripts.org/scripts/show/150411

Setelah terbuka klik tombol Install yang ada di kanan atas halaman.

akan muncul pop up seperti gambar, kemudian klik Install

selanjutnya akan muncul notifikasi berhasil tidaknya, jika ada tulisan installed successfuly berarti proses instal berhail, selanjutnya klik Ok dan restart kembali firefox anda.

langkah terakhir yaitu login pada facebook, selanjutnya pilih daftar teman pada profil fb anda, maka akan muncul menu untuk menghapus teman yang berada di kanan atas (seperti pada gambar) jika menu tersebut tidak muncul coba di reload kembali halaman tersebut.

Untuk menghapus teman dengan cara klik kotak kecil di samping foto profil teman, jika ingin menghapus semua teman dapat memilih select all, selanjutnya tinggal klik Delete Selected Friends, maka teman yang anda pilih akan terhapus.

Read More

cara membuat scrip iklan di blog melayang

Cara Membuat Iklan Melayang di Kanan Kiri Blog 

– Lokasi / posisi / letak iklan sangat menentukan apakah iklan tersebut berkinerja dengan baik atau tidak. Iklan yang di pasang di blog tidak boleh asal-asalan penempatanya. Yakni harus dipasang di lokasi yang strategis agar selalu bisa dilihat dan diklik oleh pemirsa blog.
Salah satu letak iklan yang paling bagus adalah iklan floating atau melayang. Lokasi iklan jenis ini akan selalu kelihatan meskipun scroll browser di naik turunkan, pasti akan selalu dilihat oleh pengunjung blog. Hanya saja, jenis iklan ini kurang disukai oleh pengunjung. Selain itu, untuk iklan PPC (Pay Per Click) tidak diperbolehkan memasang iklan seperti ini, karena hal itu melanggar kebijakan program PPC. Namun, apabila iklan mandiri, akan sangat dianjurkan, karena para advertiser cenderung berani membayar dengan harga tinggi untuk memasang iklan di posisi ini.
Bagi anda yang mempunyai interest yang tinggi dalam make money from blogging, terutama membuka iklan mandiri di blog anda, anda bisa mencoba membuka space iklan model ini, karena hal itu sangat menguntungkan. Jangan sampai ruang kosong di blog anda di anggurin, karena anda akan rugi besar

Beberapa waktu yang lalu saya sudah membahas tentang Cara Membuat Ikan Teks Sendiri sebagai panduan praktis bagi anda yang ingin belajar membuat iklan teks. Dalam kesempatan kali ini saya akan share tetang cara bikin iklan pop up melayang di kanan kiri blog. Berikut adalah langkah-langkahnya.

Cara Membuat Iklan Melayang di Kanan Kiri Blog

1. Silahkan copas seluruh script berikut ini:

<script type='text/javascript'>
$(document).ready(function() {
$('img#closed').click(function(){
$('#btm_banner').hide(90);
});
});
</script><br />
<script type="text/javascript">var a=navigator,b="userAgent",c="indexOf",f="&m=1",g="(^|&)m=",h="?",i="?m=1";function j(){var d=window.location.href,e=d.split(h);switch(e.length){case 1:return d+i;case 2:return 0<=e[1].search(g)?null:d+f;default:return null}}if(-1!=a[b][c]("Mobile")&&-1!=a[b][c]("WebKit")&&-1==a[b][c]("iPad")||-1!=a[b][c]("Opera Mini")||-1!=a[b][c]("IEMobile")){var k=j();k&&window.location.replace(k)};
</script><script type="text/javascript">
if (window.jstiming) window.jstiming.load.tick('headEnd');
</script><br />
<!--start: floating ads masanwar.com--><br />
<div id="teaser2" style="width:autopx; height:autopx; text-align:left; display:scroll;position:fixed; bottom:0px;left:0px;">
<div>
<a href="#" id="close-teaser" onclick="document.getElementById('teaser2').style.display = 'none';" style="cursor:pointer;"><center>
<img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhcPbb3QLkLGnlMdsipA9Y5JzOJbHxpBUWG9Jmsa4jx63U78FMUr9irtn88hSA9hUfVcmvc-h-TK7soXLJW8oYlYQ5KgREH8ww-2KtpNgfg_sDl9rvcHd8wPsfyk9EFRQno-zYCwG5qcSZr/s1600/PhoXo2.png'/></center>
</a><br />
</div>
<!--Mulai Iklan Kiri--><br />
<a title="simanjuntak" href="http://www.juntak.com/pasang-iklan-murah/" target="_blank"><img alt="Advertisement" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhSy789iDYyFRkwdN-FjLnuyGq9sH04_yU3JBdm0hJmZ6el7MKIlVNjWwaP9DrJaobZerEMALulynlWV5zcDwmuvMn78zOZu9d7y_eyO7Br8ZntnyxI3tMst-JMBjLpJW0Z6nX40Oe7OsM/s1600/pimbcr.jpg" width="160px" height="600px"/></a><br />
<!--Akhir Iklan Kiri--><br />
</div>
<div id="teaser3" style="width:autopx; height:autopx; text-align:right; display:scroll;position:fixed; bottom:0px;right:0px;">
<div>
<a href="#" id="close-teaser" onclick="document.getElementById('teaser3').style.display = 'none';" style="cursor:pointer;"><center>
<img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhcPbb3QLkLGnlMdsipA9Y5JzOJbHxpBUWG9Jmsa4jx63U78FMUr9irtn88hSA9hUfVcmvc-h-TK7soXLJW8oYlYQ5KgREH8ww-2KtpNgfg_sDl9rvcHd8wPsfyk9EFRQno-zYCwG5qcSZr/s1600/PhoXo2.png'/></center>
</a><br />
</div>
<!--Mulai Iklan Kanan--><br />
<a title="simanjuntak" href="http://www.juntak.com/pasang-iklan-murah/" target="_blank"><img alt="Advertisement" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhSy789iDYyFRkwdN-FjLnuyGq9sH04_yU3JBdm0hJmZ6el7MKIlVNjWwaP9DrJaobZerEMALulynlWV5zcDwmuvMn78zOZu9d7y_eyO7Br8ZntnyxI3tMst-JMBjLpJW0Z6nX40Oe7OsM/s1600/pimbcr.jpg" width="160px" height="600px"/></a><br />
<!--Akhir Iklan Kanan--><br />
</div>

Keterangan:
Kode warna biru kode iklan anda dengan ukuran 160×600 vertikal
Kode Warna merah kode iklan anda dengan ukuran 160×600 vertikal
2. Pasang iklan di blog dengan cara log in di blog anda
3. Dashboard > Tata Letak > Tambahkan Widget
4. Pilih widget HTML/JavaScript > Paste seluruh scrip tadi > Klik save

Read More

cara mengompres ukuran foto tanpa mengurangi kwalitas

Cara Kompres Ukuran Gambar Tanpa Merusak Kualitas Gambar

Cara Kompres Ukuran Gambar Tanpa Merusak Kualitas Gambar – Gambar adalah suatu seni lukis yang menyajikan sebuah karya berwarna berbentuk sesuatu. Dengan adanya gambar, kita semakin terbantu dalam bidang apapun. Misalnya, jika anda menuliskan tutorial tentang Desain Template Blog, maka bagi para pemula akan merasa kesulitan untuk mengukuti petunjuk yang diberikan bila tanpa adanya gambar yang mendukung. Oleh karena itu gambar akan lebih mempermudah pekerjaan dan membantu seseorang tahu tentang suatu hal sedetail mungkin.

Size atau ukuran suatu gambar dapat ditinjau melalui dari seberapa tajam dan seberapa jernih suatu gambar. Pada gambar atau foto yang memiliki kualitas yang bagus, pasti ukuran file alaminya akan terbilang besar. Belum lagi jika anda ingin membagikan gambar atau foto tersebut dengan mengunggahnya di internet, pasti akan memakan waktu yang lama jika ditambah koneksi internet yang lambat.

Untuk itu kami merekomendasikan untuk mengkompres gambar atau foto agar size atau ukuran filenya bisa dikecilkan. Namun, tentunya tidak akan merusak kualitas gambar atau foto tersebut. Trik yang saya bagikan kali ini adalah mengkompres gambar tanpa software atau dengan menggunakan jasa online. Ini sangat menguntungkan. Mengapa? Karena hanya dengan jasa online, kita sudah menghemat paket data karena kita tidak perlu lagi mendownload software pengolah gambar yang terkadang berukuran file yang terbilang besar. Kita juga tidak perlu menggunakan jasa PhotoShop yang memerlukan keahlian kusus untuk mengaplikasikannya, yang terkadang jika menggunakan PhotoShop gambar terkompres namun malah merusak kualitas gambar.

Situs online yang menyediakan jasa pengompresan gambar adalah jpeg-optimizer.com. Tetapi syarat utama jika menggunakan situs ini adalah format gambar harus JPEG. Jika anda mempunyai format gambar lain, bisa memakai format factory untuk merubah typenya. Keuntungan situs jpeg-optimizer.com adalah loading situs yang ringan dan tampilan yang sederhana, membuat proses mengkompres gambar atau foto menjadi lebih cepat. Kelebihan lain dari jasa situs ini adalah mampu menghemat gambar atau foto hingga 80%.

Contoh Gambar Sebelum Dikompres

Contoh Gambar Setelah Dikompres

Berikut, Cara Kompres Ukuran Gambar tanpa Merusak Kualitas Gambar:

1. Silahkan kunjungi situs jpeg-optimizer.com.

2. Klik Browse untuk memilih gambar yang diinginkan.

3. Angka 65 menunjukan level pengompresan. Semakin kecil level, maka semakin kecil ukuran file gambar.

4. Hilangkan centang pada Resize Photo.

5. Klik Optimize Photo, dan tunggu hingga selesai.

6. Terakhir, klik kanan pada gambar, lalu Save As.

Semoga Bermanfaat

Read More