Cara Mengecilkan Ukuran Gambar Hingga 5 Kali Lipat Tanpa Menggunakan Plugin

Cara Mengecilkan Ukuran Gambar Hingga 5 Kali Lipat Tanpa Menggunakan Plugin

 Mengecilkan ukuran gambar sering saya lakukan dalam mengolah gambar untuk postingan. Biasaya saya menggunakan cara manual yaitu menyalin gambar, mempaste-nya di Excell, mengecilkannya, dan mengubahnya menjadi format jpg via aplikasi Paint.

Sayangnya, cara yang saya gunakan itu ribet dan tidak praktis.

Saat ngeblog bareng minggu lalu, seorang teman menyarankan saya untuk meninggalkan cara tersebut dan beralih menggunakan Microsoft Office Picture Manager, yang merupakan tool bawaan Microsoft Office.

Saya pun mencobanya.

Ternyata hasilnya memuaskan karena ukuran foto dapat dikecilkan hingga 5 kali lipat dan dimensinya pun sesuai dengan bodi postingan. Oleh karena itu, dalam postingan ini, saya berbagi caranya untuk Anda.

Walaupun ini cara lama, namun siapa tahu ada di antara Anda yang belum mengetahuinya.

 

1. Pilih gambar yang hendak Anda kecilkan (kompres) ukurannya.

2. Klik kanan lalu pilih Open With dan Microsoft Office Picture Manager.

3. Gambar yang terpilih akan terbuka sesuai dimensinya. Klik menu Picture, lalu klik Compress Pictures.

4.  Akan muncul Compress pictures settings. Pilih Web pages lalu tekan OK.

5. Gambar akan dikecilkan sesuai dimensi web. Klik tombol Save untuk menyimpan hasil kompres secara otomatis ke folder tempat gambar disimpan sebelumnya.

6. Contoh hasilnya seperti berikut. Ukuran gambar telah dikecilkan dari 85 kb menjadi 16 kb (5 kali lipat). Dimensinya pun sudah berubah dari 1282 x 802 menjadi 448 x 280.

Sebagai informasi, hasil tutorial ini bisa Anda lihat gambar pada postingan wallpaper komputer.

Saya sangat merekomendasikan Anda untuk menggunakan Microsoft Office Picture Manager dalam mengolah gambar untuk postingan Anda karena mudah, praktis, dan tanpa menggunakan plugin.

Selamat mencoba!

 

Read More

Cara membuat Efek ZOOM pada gambar diblog

 Cara membuat Efek ZOOM pada gambar diblog

 

Ho..Hoi..Hello sobat blogger mania sebangsa dan setanah air termasuk yang diluar negeri, he..he..he,..pada postingan kali ini www.simanjuntak.com akan memposting artikel tentang cara membuat efek ZOOM  pada  gambar diblog, untuk mempermudah sobat blogger mania mempraktekanya saya sekaligus akan sharing dua cara dalam membuat efek ZOOM diblog.

Cara yang pertama dengan cara OTOMATIS, kenapa EFA sebutkan otomatis??? karena dengan sekali pasang script ini semua gambar yang ada dipostingan akan membesar jika tersentuh mouse.

coba saja arahkan mouse sobat blogger mania ke gambar dibawah ini

 

 

Cara memasang scrpitnyapun gampang, ikuti langkah-langkah berikut.?

1. Silahkan login ke Blogger  terlebih dahulu.
2. Kemudian klik Tata Letak.
3. Edit HTML.
4. Letakkan kode css berikut ini, tepat diatas kode ]]></b:skin>

.post img:hover {
-o-transition: all 0.3s;
-moz-transition: all 0.3s;
-webkit-transition: all 0.3s;
-moz-transform: scale(1.9);
-o-transform: scale(1.9);
-webkit-transform: scale(1.9); }

Jangan lupa Simpan Template.


Nah, untuk cara yang kedua tunggu postingan berikutnya.

Nah, sobat blogger mania EFA kira sudah sangat jelas. apabila sobat blogger mania tidak jelas juga sebaiknya sobat blogger mania ambil sarung terus tidur

SELAMAT BERKREASI...

eitsss

jangan lupa komen 

Read More

Cara membuat border Disidebar

Cara Membuat Border Di sidebar

Pada tutorial kali ini JUNTAKX akan memposting artikel tentang Cara Membuat Border di Sidebar karena ada banyak cara untuk membuat  blog agar kelihatan enak dipandang. walaupun EFA sendiri kadang kadang merasa malu juga dengan pengunjung yang singgah di Education for all kareana blog EFA ini juga masih blepotan. Nah salah satunya adalah dengan membuat blog kita  lebih indah jika dilihat.  Kali ini yang kita bahas adalah bagaimana cara membuat Border binti Frame binti bingkai di sidebar blog. sebenarnya bukan cuma di sidebar  tetapi kita juga bisa membuatnya di posting ataupun di halaman lain yang kita mau. Kita ketahui banyak sekali fungsi dari border ini diantaranya kita bisa membuat suatu skat untuk catatan tertentu misalnya, atau juga untuk pengunguman and soon. Ok lah to the point aja, dibawah ini adalah beberapa contoh dasar Script pembuatan border yang sederhana. sobat blogger mania pemula bisa mencobanya di blog sobat dengan cukup mengcopy kodenya. 

1. Solid

<div style="border: 1px solid #000000; background-color:#00CCFF; padding: 5px; width: 400px;">
Tulis disini...
</div>

2. Dashed

<div style="border: 1px dashed #000000; background-color:#00CCFF; padding: 5px; width: 400px;">
Tulis disini...
</div>

3. Dotted

<div style="border: 1px dotted #000000; background-color:#00CCFF; padding: 5px; width: 400px;">
Tulis disini...
</div>

4. Double

<div style="border: 4px double #000000; background-color:#00CCFF; padding: 5px; width: 400px;">
Tulis disini...
</div>

5. Groove

<div style="border: 4px groove #000000; background-color:#00CCFF; padding: 5px; width: 400px;">
Tulis disini...
</div>

6. Outset

<div style="border: 4px outset #000000; background-color:#00CCFF; padding: 5px; width: 400px;">
Tulis disini...
</div>

7. Ridge

<div style="border: 4px ridge #000000; background-color:#00CCFF; padding: 5px; width: 400px;">
Tulis disini...
</div>

Dari 7 contoh kode di atas, sobat blogger mania bisa mencobanya semua. Untuk merubah warna backroundnya sobat blogger mania tinggal merubah kode warna saja. sedangkan untuk lebar border, sobat blogger mania cukup mengganti ukuran width (lebar) sesuai dengan yang sobat blogger mania inginkan.

Cara memasangnya sobat blogger mania cukup ikuti langkah langkah berikut

Pertama login ke akun blogger sobat.

Kedua pilih rancangan

ketiga pilih tambah gadget lalu pilih HTML Java script dan pastekan script script diatas.

kemudian pada tulisan tulis disini silahkan ganti dengan kode script sobat. misalnya script buku tamu atau apalah yang sobat mau.

terakhir dan paling utama simpan. dan lihat hasilnya.

Semoga bermanfaat.

Read More

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

cara membuat tombol demo diblog

Cara Mambuat Tombol Demo Button

yang di maksud Cara membuat tombol demo button di sini adalah mambuat sebuah link yang bertiliskan Demo yang nantinya jika di klik maka kita akan di bawa ke alamat link tersebut. .Yang mana manfaatnya adalah untuk memperlihatkan hasil atau contoh kepada pengunjung dari  postingan yang kita poskan ,agar lebih jelas serta memperkuat kebenaran suatu postingan itu sendiri.
Soalnya terkadang untuk para bloger pemula yang masih suka newby /pengunjung merasa bingung ketika mau mencoba atau menerapkan suatu  postingan tips di blognya karena belum tahu dimana letaknya dan seperti apa nanti jadinya .

Sebenarya Cara Mambuat Tombol Demo Button / tombol demo buton link ini tidak lah sesulit yang di bayangkan ,kita hanya perlu memasukan code <button>dengan diakhiri code</button> setelah code Url link yang akan di tuju .

-----------------------------------------------------
contoh :
Url link tujuannya : http://chiborty.blogspot.com
-----------------------------------------------------
maka pembuatannya seperti ini :
<a href="http://chiborty.blogspot.com/"><button>Demo</button></a>

Tetapi jika ingin Link tujuannya terbuka di tab baru penulisannya seperti di bawah ini :
<a href="http://chiborty.blogspot.com/"target="_blank"><button>Demo</button></a
-------------------------------------------------------
Lihat hasilnya seperti ini :

---------------------------------------------------------------
Nah itulah sekilas tentang cara membuat tombol demo button ,mudah -mudahan bermanfaat ,selamat mencoba ,semoga sukses ,salam bloger 

INGAT;;.....

Read More

cara membuat gambar melayang di blog

Cara Buat Gambar Melayang / Floating Image di Blog

Cara Buat Gambar Melayang / Floating Image di Blog 

Hari ni Puenas nya mianta ampiun , rencananya sih tadi tu mau main kerumah temen , tapi karena terlalu panas jadi males dweh keluar rumah takut kulit jadi item hehhehe [ padahal udah item]…
Di rumah lagi sepi ,Orang rumah lagi pada keluar , jadinya ane sendirian di rumah ,O ya ternyata asik juga loh di rumah sendirian ,bisa lebih tenang tanpa ada yang ngomel- ngomel..
Udah ah sob ceritanya takut orang rumah tau , bisa panjang urusan nya…

Mendingan  langsung aja kita bahas postingan kali ini Tentang  Cara Buat Gambar Melayang / Floating Image di Blog Jika diantara sobat ada yang tertarik dengan judul diatas , silakan sobat bungkus saja judul diatas tadi heheheheh…….
Atau mungkin sobat blog  ingin tahu cara bikinnya Seperti gambar yang ada di bawah postingan ane ini,
ya sekedar untuk mempercantik blog ataupun dengan alas an-alasn lain silakan ikuti tutorial di bawah ini :
__________________________________________________
1. Silakan login ke akun blog sobat
2. di dalam menu drop down pilih yang tata letak
3. lalu pilih add Gadget 
4. selanjutnya pilih HTML / Java Script
5. Jika sudah silakan Copy / Paste Code di bawah :
_______________________________________________
posisi kanan bawah :
<a style=”display:scroll;position:fixed;bottom:0;right:0;”>
<img src=”https://googledrive.com/host/0B_CilEZcRURkdG0yMGRfQWhua3c/”/></a>
---------------------------------------------------------------
posisi kiri bawah :
<a style=”display:scroll;position:fixed;bottom:0;left:0;”>
<img src=”https://googledrive.com/host/0B_CilEZcRURkdG0yMGRfQWhua3c/”/></a>
_____________________________________________
posisi kanan atas
<a style=”display:scroll;position:fixed;top:0;right:0;”>
<img src=”https://googledrive.com/host/0B_CilEZcRURkdG0yMGRfQWhua3c/”/></a>
______________________________________________
posisi kiri atas :
<a style=”display:scroll;position:fixed;top:0;left:0;”>
<img src=”https://googledrive.com/host/0B_CilEZcRURkdG0yMGRfQWhua3c/”/></a>
______________________________________________
Cttn : Teks Yang Warna Merah  silakan sobat ganti dengan Url Gambar sobat
_____________________________________________
Jika ingin gambarnya di buat transparan silakan tambahkan code html  ini
setelah “Url Gambar”style=”opacity:0.1;filter:alpha(opacity=10);”/></a>

Contoh :  aslnya seperti ini
<a style=”display:scroll;position:fixed;bottom:0;right:0;”>
<img src=”Url Gambar”/></a>

Jadi seperti ini :

<a style=”display:scroll;position:fixed;bottom:0;right:0;”>
<img src=”Url Gambar”  style=”opacity:0.1;filter:alpha(opacity=10);”/></a>
__________________________________________________
cttn : opacity =ukuran  transparannya bisa 0.1 dan 10 atau 0.2 dan 20
          Silakan sesuaikan mana yang sobat suka

Jka sudah selesai Silakan Simpan / save , Lalu lihat Hasilnya Semoga Bermanfa'at


INGAT;;.....

Read More

cara membuat link bergerak ke atas

Bikin Link Bergerak ke Atas

Bikin Link Bergerak ke Atas 

Pada Postingan kali ini Ane akan Coba share Cara Bikin Link Bergerak Ke Atas di Blog
Biar Ga panjang lebar langsung aja Nyo Kita Ke TKP :

1.silakan login kea kun Blognya masing-masing
2. Pada menu pilihan silakan pilih Tataletak
3. Klik tambah gadget
4. Jika terbuka tab baru silakan pilih yang HTML/JavaScript
5. Lalu copy paste Code di bawah :
________________________________________________________

<marqueealign="center"direction="up" height="200"onmouseout="this.start()"onmouseover="this.stop()" scrollamount="2" width="210">
<a href="URL Tujuan" rel="dofollow">Link1</a><br />
<a href="URL Tujuan" rel="dofollow">Link2</a><br />
<a href="URL Tujuan" rel="dofollow">Link3</a><br />
<a href="URL Tujuan" rel="dofollow">Link4</a><br />
<a href="URL Tujuan" rel="dofollow">Link5</a></marquee>
______________________________________________________
Lihat Contoh :
Link1
Link2
Link3
Link4
Link5
 ______________________________________________________
Cttn : Yang warna Merah  Silakan Masukan Url yang akan di tuju
          Yang Warna Hijau Silakan Ganti Dangan Teks Bebas
          Yang Warna Biru up = bergerak ke atas, Jika sobat mau ganti silakan
                                down =  kebawah

6.jika sudah silakan di Save / terapkan .lihat Hasilnya

Selamat Mencoba Semoga Berhasil 

INGAT;;.....

Read More

cara membuat link bergerak saat di sentuh mouse

Bikin Link Bergerak Saat Di Sentuh Mouse

Bikin Link Bergerak  Saat Di Sentuh Mouse :

Mungkin ada yang tertarik dengan judul di atas ,dan ingin mencobanya ,
tetapi tidak tau caranya ,penasaran dan tetap ingin mencoba ,
[Irit banget , kaya tukang obat di pasar ,simple]
silakan lihat caranya  Di TKP :

1.silaka login ke akun bloger sobat
2. Dalammenu drop down pilih rancangan / Template
3. Lalu klik Edit HTML dan jangan lupa backup template [ untuk berjaga-jaga]
4. Cari kode  </head>
5.Jika udah ketemu Copy paste Code berikut  Diatas Code  </head>
______________________________________________________________________________
<script src=' http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js ' type='text/javascript'/>
<script type='text/javascript'>
$(document).ready(function() {
$(&#39;a&#39;).hover(function() { //mouse in
$(this).animate({ marginLeft: &#39;12px&#39; }, 400);
}, function() { //mouse out
$(this).animate({ marginLeft: 0 }, 400);
});
});</script>
______________________________________________________________________________
Cttn : Yang Warna Merah boleh di hapus jika di template sobat sudah ada.

6. Jika sudah selesai save /simpan template dan lihat hasilnya

selamat mencoba semoga bermanfa’at
INGAT;;.....

Read More

cara membuat efect gambar berputar di blog

Bikin Gambar Berputar Sa’at di Sentuh Mouse

Bikin Gambar Berputar Sa’at di Sentuh Mouse :

Setelah kemarin ane posting tentang cara agar gambar membesar sa’at di sentuh mouse / krusor
Nah Dalam kesempatan kali ini Ane akan coba share cara agar gambar di blog kita berputar / sleding img zoom  saat di sentuh mouse / krusor, Biar ga penasaran ,kaya AbG tuir liat mangga muda yang bawaannya pingin nyacipin ,kayanya hehehhe...........Gimana kalau kita langsung saja ,eng - ing - eng......................................Monggo ikutipanduan dibawah ini ,silakan lihat di TKP :

______________________________________________________________________________

1.seperti biasa login ke akun bloger masing-masing.

2.padada menu drop down ,silakan pilih TEMPLATE .

3.backup dulu template ,(sekedar berjaga-jaga)

4.lalu klik  Edit Html ....

5.cari kode ]]></b:skin>  :untuk memudahkan pencarian ,kita gunakan CNTRL + F

6.nah jika sudah ketemu ,silakan Copy Paste Kode di bawah Tepat di atas Kode ]]></b:skin>
_______________________________________________________________________

.post img{-o-transition:all 1.5s ease;-moz-transition:all 1.5s ease;-webkit-transition:all 1.5s ease}.post img:hover{-o-transform:scale(1.2) rotate(360deg) translate(0px);-moz-transform:scale(1.2) rotate(360deg) translate(0px);-webkit-transform:scale(1.2) rotate(360deg) translate(0px);-o-transition:all 1.5s ease;-moz-transition:all 1.5s ease;-webkit-transition:all 1.5s ease}
_______________________________________________________________________

7. jika semua sudah silakan simpan template klik save dan lihat hasilnya

Cara diatas udah ane coba
selamat mencoba semoga berhasil

INGAT;;.....

Read More

cara membuat efek zoom di gambar blog

CARA MEMBUAT GAMBAR MEMBESAR/ZOOM EFECT SAAT DI SENTUH MOUSE

Setelah kemarin ane posting tentang cara agar gambar bergerak sa’at di sentuh moush / krusor
Nah Dalam kesempatan kali ini Ane akan coba share cara agar gambar di blog kita Membesar / zoom efek saat di sentuh moush / krusor
Silakan ikutipanduan dibawah ini ,silakan lihat di TKP :

_____________________________________________________________
1.seperti biasa login ke akun bloger masing-masing.
2.padada menu drop down ,silakan pilih TEMPLATE .
3.backup dulu template ,(sekedar berjaga-jaga)
4.lalu klik  Edit Html ....
5.cari kode ]]></b:skin>  :untuk memudahkan pencarian ,kita gunakan CNTRL + F
6.nah jika sudah ketemu ,silakan Copy Paste Kode di bawah Tepat di atas Kode ]]></b:skin>
___________________________________________________________  
.post img:hover { -o-transition: all 0.3s; -moz-transition: all 0.3s; -webkit-transition: all 0.3s; -moz-transform: scale(2.0); -o-transform: scale(2.0); -webkit-transform: scale(2.0); -webkit-border-radius: 0px 0px; -moz-border-radius: 0px / 0px; -webkit-box-shadow: 2px 2px 6px rgba(0,0,0,0,6); }}
___________________________________________________________
7. jika semua sudah silakan simpan template klik save dan lihat hasilnya
Cara diatas udah ane coba .Selamat Mencoba Semoga Berhasil

INGAT;;.....

Read More

cara memasaang fanspage facebook di blog

 Cara Membuat Fanspage Facebook tampil di blogger

Ok sobat berikut ini juntakx.blogspot.com akan membagikan tentang cara Membuat Fanspage Facebook tampil di Blog Blogger. Tutorial ini sudah pernah di bahas diartikel sebelumnya yang berjudul Cara memasang likebox Fanspage Facebook di Blog dan cara memasang widget likebox Fanspage Facebook melayang dengan tombol close kecil tapi karena ada yang tidak tahu kodenya diambil dimana maka saya membuat artikel ini..

Tentunya sobat sudah tahu kegunaan fanspage Facebook ini. sederhananya seperti ini, jika ada orang yang menyukai fanspage facebook kita baik itu melalui Blog ataupun di like langsung di Facebook ( semakin banyak maka semakin bagus) maka jika kita membuat artikel dan mempostingnya ( menaruh link Blog kita di Fanspage ) maka kemungkinan besar artikel tersebut akan muncul di dashboard ( beranda Facebook ) orang yang melike Fanspage Facebook kita, sehingga kemungkinan mendapatkan pengunjung lebih banyak menjadi lebih besar.


Ok berikut ini adalah :

Cara Membuat Fanspage Facebook Di Blog

1. Login dulu ke akun Facebook Anda  dan masuk ke; Facebook Developers.

2. Jika anda belum memiliki halaman fanspage facebook silahkan anda baca; cara membuat halaman Fanspage Facebook
3. Pada Facebook Page URL, Anda masukkan URL Facebook page blog Anda. Jika tampilan fansepage facebook anda sudah keluar silahkan klik "get Code".

ups, tapi apakah fb anda sudah mempunyai halaman facebook, klo blom buat dulu

4.Oh iya untuk anda yang ingin memasang fanspage fecebook melayang seperti di artikel yang saya sudah jelaskan sebelumnya ( baca : cara memasang widget fanspage facebook melayang ) anda tinggal menghilankan tanda centang di pilihan  "Show Friends' Faces" dan "Show Header" dan "Show Posts" dan "Show Border".

Catatan : Jika sudah sampai langkah ke 4 di atas dan tidak ada kode IFRAME maka gabungkan saja ke dua kode yang muncul seperti gambar di bawah ini.

Ketika di gabungkan contohnya seperti kode dibawah ini:

<div id="fb-root"></div>
<script>(function(d, s, id) {
  var js, fjs = d.getElementsByTagName(s)[0];
  if (d.getElementById(id)) return;
  js = d.createElement(s); js.id = id;
  js.src = "//connect.facebook.net/id_ID/sdk.js#xfbml=1&appId=483767385088491&version=v2.0";
  fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>
<div class="fb-like-box" data-href="https://www.facebook.com/Seocips" data-colorscheme="light" data-show-faces="true" data-header="true" data-stream="false" data-show-border="true"></div>

Memasang Fanspage ke Blog

Tinggal masukan saja kode yang sudah anda dapatkan tadi ke widget Blog. Caranya masuk ke bagian "tata letak" di Klik Add a Gadget > pilih HTML/JavaScript, dan letakan kode di atas ke dalamnya.

Selesai tinggal lihat hasilnya di Blog anda.

Read More