Senin, 23 Januari 2012

Cara Membuat Effect Zoom Pada Gambar Di Blog

by  0
Membuat Effect Zoom pada Gambar, hemm, pasti Kalian tidak asing lagi kan. Sebagai contoh Kalian bisa lihat gambar di bawah, coba Kalian sorotkan kursor Kalian ke gambar itu, pasti dengan sendirinya akan membesar.




OK, pasti sudah paham kan, kita masuk ke langkah-langkahnya :

[1]. Login dulu ke Blog Kalian,
[2]. Cari Rancangan --> Edit HTML,
[3]. Trus cari Code ]]></b:skin>,
[4]. Kalo sudah ketemu, Copy dan Paste-kan Code di bawah ini, tepat di atas Code tadi.
.hovergallery 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}.hovergallery img:hover{-webkit-transform:scale(1.1);-moz-
transform:scale(1.1);-o-transform:scale(1.1);box-shadow:0px 0px 30px
gray;-webkit-box-shadow:0px 0px 30px gray;-moz-box-shadow:0px 0px 30px
gray;opacity:1}
[5]. Kalo sudah, tinggal di SAVE.


Cara Memeberikan Effectnya :
Kalian hanya perlu menambahkan Code di bawah ke dalam Code Gambar Kalian.
<div class="hovergallery">URL Gambar Kalian</div>
Sebagai Contoh :
<div class="hovergallery">https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgnQvuREvtyFs9eS4SThPGXYc2X7Oy2DnG0ejexR1Y0nioUSBRQCkId9MkknwHc62aYIfGBNvlk4EnOWEa_n1JfErK9bAiNtinvfGqy4GDIZrPr219fr0HlsPHD9n_Ydo9hcC9ejFs8fOi9/s1600/Fb-IB-JmK-%25E2%2584%25A24.png</div>
NB :
- Kalo ada pertanyaan silahkan tuliskan pertanyaan Kalian di Kotak Komentar.

Semoga Berhasil...!!!

Cara Membuat/Megganti Icon Label Blog

by  0
Tips kali ini membahas tentang Icon Label Blog, Kalian tentunya tau dong Label Blog, kalo tidak tahu coba Kalian perhatikan gambar di bawah :


OK pasti sudah tahu dong...???. Kita langsung masuk ke langkah-langkahnya saja. Berikut langkah-langkahnya.

[1]. Pertama pastinya Login dulu ke Blog Kalian.
[2]. Lalu cari Rancangan --> Edit HTML --> Centang tulisan "Expand Widget Template".
[3]. Trus cari Code ]]></b:skin> (agar lebih mudah mencari tekan CTRL + F atau F3 pada Keyboard).
[4]. Kalo sudah ketemu Copy dan Paste-kan Code di bawah, tepat di atas Code tadi.
/*Label
----------------------*/
#Label1 ul, #Label2 ul{
list-style:none;
margin:0 0 0;
padding:0 0 8px;
}
#Label1 li, #Label2 li{
background:url(http://www.paramitra.com/gfx/icon-flag-id.gif) no-repeat;
padding-top:0;
padding-right:0;
padding-bottom:3px;
padding-left:20px;
margin-bottom:3px;
border-bottom:1px dotted #063E3F;
line-height: 1.2em;
}
NB :
- Ganti URL gambar yang ada pada Code (http://www.paramitra.com/gfx/icon-flag-id.gif), dengan URL gambar Kalian. Ingat gambar harus berukuran kecil, agar pas.

[5]. Terakhir tinggal di SAVE, dan lihat hasilnya. Pasti Icon Label Blog Kalian sudah berubah.

Ohh ya, Saya hampir lupa, pada Pengaturan Widget Label harus dalam Mode "Daftar", kalo tidak maka Iconnya tidak akan muncul. Agar lebih jelasnya, Lihat Gambar Di Bawah.


Semoga Bermanfaat...!!!

Kamis, 19 Januari 2012

Cara Mencegah Orang Lain Meng-Copas Artikel Kita

by  0
Trik kali ini membahas tentang Cara Mencegah Orang Lain Meng-Copas Artikel Kita, sebelumnya saya sudah pernah Posting tentang Cara Mendisbled (Mematikan) Klik Kanan Pada Blog. Sebenarnya trik ini hampir sama dengan trik di atas, kalau trik diatas bisa Nge-Blok Postingan, kalau trik kali ini tidak bisa Nge-Blok Postingan kita. OK. langsung saja ke langkah-langkahnya :

[1]. Pertama pastinya Login dulu ke Blog Kalian masing2
[2]. Trus cari Rancangan --> Edit HTML
[3]. Kemudian cari Code <head>
[4]. Copy dan Paste-kan Code di bawah, tepat di bawah Code <head>
<SCRIPT type="text/javascript">
if (typeof document.onselectstart!="undefined")
{document.onselectstart=new Function ("return false");}
else{ document.onmousedown=new Function ("return false");
document.onmouseup=new Function ("return true"); }
</SCRIPT>
[5]. Terakhir tinggal di SAVE, dan coba Kalian lihat Postingan Kalian, apakan masih bisa di Blok atau di Copas, harusnya tidak bisa...!!! Hehehe...

Sekian dulu Trik kali ini, Selamat Mencoba dan Semoga Berhasil...!!!

Sabtu, 14 Januari 2012

Cara Membuat Variasi Text Pada Blog

by  0
Kalian mungkin masih asing dengan Judul Postingan kali ini, agar Kalian tidak merasa bingung tentang Variasi Text Pada Blog, maka Saya sertakan contohnya. Bisa di lihat pada tulisan di bawah, coba arahkan Kursor Kalian ke tulisan di bawah. Atau pada Judul Postingan kali ini.

Cara Membuat Variasi Text Pada Blog

Jadi seperti itulah maksud Judul Postingan Kali ini.
Ok, kalo Kalian merasa tertarik, silahkan ikuti langkah-langkah berikut ini :

[1]. Pertama pastinya Login dulu ke Blog Kalian.
[2]. Trus cari Rancangan --> Edit HTML.
[3]. Lalu cari Code ]]></b:skin> (agar lebih mudah mencari tekan CTRL + F atau F3, pada Keyboard).
[4]. Copy dan Paste-kan Code di bawah ini tepat di atas Code yang tadi.
.comments2{color: #613838;}.comments2:hover{font-family:Georgia,Century gothic,Arial,Helvetica,sans-serif;text-shadow: 0 0 3px #000000, 0 -5px 4px #ff3, 2px -6px 6px #fd3, -2px -8px 9px #f40, 2px -10px 10px #f10;}
[5]. Kalo sudah tinggan di SAVE.
[6]. Sekarang coba buat Postingan, trus masuk ke kolom Edit HTML pada Postingan, lalu masukan Code di bawah ke dalam Postingan Kalian. Contohnya bisa di lihat di bawah.
<div class="comments2"> </div>
Cara memasukannya bisa di lihat di bawah.
<div class="comments2">Kata-kata atau Postingan Kalian</div>
NB :
- Tulisan yang berwarna Hijau, itu adalh Code yang harus di masukan kedalam Postingan.
- Sedangkan tulisan yang berwarna Biru, itu adalah kata-kata atau tulisan yang akan di beri Effect.

[7]. Terakhir tinggal klik Terbitkan Entri dan lihat hasilnya. Coba Kalian sorotkan Kursor Kalian ke Tulisan yang tadi di beri Effect.

Semoga Bermanfaat...!!!

Jumat, 13 Januari 2012

Cara Mendisable Klik Kanan Pada Gambar Di Blog

by  0
Sebelumnya Saya sudah pernah Posting tentang Cara Mendisable Klik Kanan Pada Blog, dan kali ini Saya akan Pos tentang Mendisable Klik Kanan Pada Gambar Di Blog. Sebenarnya kita hanya menambahkan sedikit Script pada Script Gambar.

Script Gambar Standar :
<img src="JmK.jpeg"/>

Dan kita hanya perlu menambah Script di bawah ini ke dalamnya :
oncontextmenu="return false;"

Contohnya Kalian bisa lihat pada Script di bawah ini :
<img src="JmK.jpeg" oncontextmenu="return false;"/>

Semoga Kalian mengerti dan semoga bermanfaat...!!!

Kamis, 12 Januari 2012

Cara Membuat Effect Bayangan Api Pada Link Blog

by  0
Kali ini Saya akan memberikan Tips, Cara Membuat Effect Bayangan Api Pada Link Blog. Effect Banyangan Api pada Link Blog, hemm, ketika Kalian mengarahkan Kursor Blog Kalian pda sebuah Link, maka akan keluar Effect Bayangan Api. Bagaimana, Kalian tertarik...? Kalau Kalian tertarik, silahkan ikuti langkah-langkah berikut.

[1]. Pertama pastinya Login dulu ke Blog Kalian.
[2]. Trus cari Rancangan --> Edit HTML.
[3]. Lalu cari Code a:hover kira-kira Codenya seperti di bawah..
a:hover {
text-decoration: underline;
color: #ff0000;
}
[4]. Kalo sudah ketemu, ganti tulisan [underline] menjadi [none], dan hapus Code pada bagian bawahnya. kira-kira Codenya seperti ini color: #ffoooo:
[5]. Lalu Copy dan Paste-kan Code di bawah ini, tepat di bawah Code yang tadi di hapus, atau di belakang Code yang tadi di hapus.
text-shadow: 0 0 2px #ccc, 0 -5px 4px #ff3, 2px -6px 6px #fd3, -2px -8px 9px #f40, 2px -10px 10px #f10;
[6]. Kalo Kalian bingung, coba Kalian lihat Code di bawah ini.
a:hover {
text-decoration: none; text-shadow: 0 0 2px #ccc, 0 -5px 4px #ff3, 2px -6px 6px #fd3, -2px -8px 9px #f40, 2px -10px 10px #f10;
}
[7]. Kalo sudah selesai, tinggan di SAVE, dan lihat hasilnya. Link Blog Kalian jadi ada Effect Bayangannya.

Semoga Berhasil...!!!

Cara Membuat Kursor Blog Di Ikuti Tulisan

by  0
Hello para Blogger...! Sebelumnya Saya sudah pernah Pos tentang Cara Membuat Kursor Bertabur Bintang Pada Blog, kali ini Saya akan Pos tentang Cara Membuat Kursor Blog Di Ikuti Tulisan. OK, buat yang tertarik silahkan simak baik-baik langkah-langkah berikut :

[1]. Seperti biasa Login dulu ke Blog Kalian.
[2]. Trus cari Rancangan --> Elemen Laman --> Tambahkan Gadget.
[3]. Copy dan Paste-kan Code di bawah ini ke dalamnya.
<style type="text/css">
/* Circle Text Styles */
#outerCircleText {
/* Optional - */
font-style: italic;
font-weight: bold;
font-family: 'comic sans ms', verdana, arial;
color: #FF0000;
/* End Optional */
position: absolute;top: 0;left: 0;z-index: 3000;cursor: default;}
#outerCircleText div {position: relative;}
#outerCircleText div div {position: absolute;top: 0;left: 0;text-align: center;}
/* End Required */
/* End Circle Text Styles */
</style>
<script type="text/javascript">
;(function(){
// Your message here (QUOTED STRING)


var msg = "Copyright Tanpa Nama";


// Set font's style size for calculating dimensions
// Set to number of desired pixels font size (decimal and negative numbers not allowed)


var size = 24;


// Set both to 1 for plain circle, set one of them to 2 for oval
// Other numbers & decimals can have interesting effects, keep these low (0 to 3)
var circleY = 0.75; var circleX = 2;
// The larger this divisor, the smaller the spaces between letters
// (decimals allowed, not negative numbers)
var letter_spacing = 5;
// The larger this multiplier, the bigger the circle/oval
// (decimals allowed, not negative numbers, some rounding is applied)
var diameter = 10;
// Rotation speed, set it negative if you want it to spin clockwise (decimals allowed)
var rotation = 0.4;
// This is not the rotation speed, its the reaction speed, keep low!
// Set this to 1 or a decimal less than one (decimals allowed, not negative numbers)
var speed = 0.3;
if (!window.addEventListener && !window.attachEvent || !document.createElement) return;
msg = msg.split('');
var n = msg.length - 1, a = Math.round(size * diameter * 0.208333), currStep = 20,
ymouse = a * circleY + 20, xmouse = a * circleX + 20, y = [], x = [], Y = [], X = [],
o = document.createElement('div'), oi = document.createElement('div'),
b = document.compatMode && document.compatMode != "BackCompat"? document.documentElement : document.body,
mouse = function(e){
e = e || window.event;
ymouse = !isNaN(e.pageY)? e.pageY : e.clientY; // y-position
xmouse = !isNaN(e.pageX)? e.pageX : e.clientX; // x-position
},
makecircle = function(){ // rotation/positioning
if(init.nopy){
o.style.top = (b || document.body).scrollTop + 'px';
o.style.left = (b || document.body).scrollLeft + 'px';
};
currStep -= rotation;
for (var d, i = n; i > -1; --i){ // makes the circle
d = document.getElementById('iemsg' + i).style;
d.top = Math.round(y[i] + a * Math.sin((currStep + i) / letter_spacing) * circleY - 15) + 'px';
d.left = Math.round(x[i] + a * Math.cos((currStep + i) / letter_spacing) * circleX) + 'px';
};
},
drag = function(){ // makes the resistance
y[0] = Y[0] += (ymouse - Y[0]) * speed;
x[0] = X[0] += (xmouse - 20 - X[0]) * speed;
for (var i = n; i > 0; --i){
y[i] = Y[i] += (y[i-1] - Y[i]) * speed;
x[i] = X[i] += (x[i-1] - X[i]) * speed;
};
makecircle();
},
init = function(){ // appends message divs, & sets initial values for positioning arrays
if(!isNaN(window.pageYOffset)){
ymouse += window.pageYOffset;
xmouse += window.pageXOffset;
} else init.nopy = true;
for (var d, i = n; i > -1; --i){
d = document.createElement('div'); d.id = 'iemsg' + i;
d.style.height = d.style.width = a + 'px';
d.appendChild(document.createTextNode(msg[i]));
oi.appendChild(d); y[i] = x[i] = Y[i] = X[i] = 0;
};
o.appendChild(oi); document.body.appendChild(o);
setInterval(drag, 25);
},
ascroll = function(){
ymouse += window.pageYOffset;
xmouse += window.pageXOffset;
window.removeEventListener('scroll', ascroll, false);
};
o.id = 'outerCircleText'; o.style.fontSize = size + 'px';
if (window.addEventListener){
window.addEventListener('load', init, false);
document.addEventListener('mouseover', mouse, false);
document.addEventListener('mousemove', mouse, false);
if (/Apple/.test(navigator.vendor))
window.addEventListener('scroll', ascroll, false);
}
else if (window.attachEvent){
window.attachEvent('onload', init);
document.attachEvent('onmousemove', mouse);
};
})();
</script>
NB :
- Tulisan yang berwarna Biru, ganti dengan kata-kata yang Kalian inginkan.
- Dan tulisan yang berwarna Merah, silahkan Kalian sesuaikan dengan keinginan Kalian.

[4]. Terakhir tinggal di SAVE dan lihat hasilnya.

Happy Blogging...!!!

Rabu, 04 Januari 2012

Cara Menambahkan Gambar Di Pojok Bawah Blog

by  0
Seperti pada judul postingan kali ini, saya akan memberikan Tips Cara Menambahkan Gambar Di Pojok Bawah Blog. Kalo Kalian lihat di Bawah Pojok Kanan Blog ini, maka kita akan membuat yang seperti itu. Ok, tidak usah berlama-lama lagi, langsung saja, berikut langkah-langkahnya :

[1]. Seperti biasa Login dulu ke Blog Kalian
[2]. Lalu cari Rancangan --> Edit/HTML
[3]. Cari Code ]]></b:skin> (Agar lebih mudah mencari tekan F3 atau CTRL + F pada Keyboard)
[4]. Copy dan Paste-kan Code dibawah ini Di Atas Code yang tadi
#trik_pojok {
position:fixed;_position:absolute;bottom:0px; right:0px;
clip:inherit;
_top:expression(document.documentElement.scrollTop+document.documentElement.clientHeight-this.clientHeight);
_left:expression(document.documentElement.scrollLeft+document.documentElement.clientWidth - offsetWidth); }
NB :
- Tulisan yang berwarna Biru, menunjukan Posisi Gambar, ganti dengan keinginan Kalian (right [kanan], left [kiri])

[5]. Kalo sudah, sekarang cari Code </body>, dan Copy dan Paste-kan Code di bawah.tepat di atas Code tadi.
<div id='trik_pojok'>
<a href='http://indonesianblog-jmk.blogspot.com'>
<img border='0' src='https://sites.google.com/site/rakasajmk/download-1/download-2/JmK.png'/></a>
</div>
NB :
- Tulisan yang berwarna Merah, ganti dengan Link Blog Kalian
- Dan yang berwarna Biru, ganti dengan Link Gambar Kalian

[6]. Terakhir tinggal di SAVE, dan lihat hasilnya

Selamat Mencoba...!!!

Selasa, 03 Januari 2012

Cara Membuat Link Friend Bergerak

by  0

Mungkin judul postingan kali ini agak asing buat Kalian. Link Friend Bergerak itu Kalian bisa lihat pada blog ini, pada bagian Sahabat Blogger. Ok langsung saja berikut langkah-langkahnya :

[1]. Seperti biasa Login dulu ke Blog Kalian
[2]. Trus cari Rancangan --> Elemen Laman --> trus Klik Tambahkan Gadget
[3]. Copy dan Paste-kan Code di bawah ini
<div style="overflow:auto;width:110px;height:200px;padding:10px;border:5px solid #eee"><marquee onmouseover="this.stop()" onmouseout="this.start()" scrollamount="4" direction="up" width="80%" height="200" >


<a href="http://www.adaisinya.com/">* Ada Isinya</a>
<br/>
<br/>
<br/>
<br/>
<br/>


<a href="http://danar-xp.blogspot.com/">* anak-INDONeSIA</a>
<br/>
<br/>
<br/>
<br/>
<br/>


<a href="http://berbagi-kreativitas.blogspot.com/">* Berbagi Kreativitas</a>
<br/>
<br/>
<br/>
<br/>
<br/>


<a href="http://cek-info.blogspot.com/">* Cek Info</a>
<br/>
<br/>
<br/>
<br/>
<br/>


<a href="http://exsat57.blogspot.com/">* Exsat only share for all</a>
<br/>
<br/>
<br/>
<br/>
<br/>


</marquee>
<br/>
</div>
NB :
- Ganti tulisan yang berwarna Merah, dengan link blog Friend Kalian, dan yang berwarna Biru, gati dengan Nama Blog Friend Kalian.
- Dan tulisan yang berwarna Kuning, menunjukan Lebar, dan Kecepatan gerakannya. Ganti dengan keinginan Kalian.
- Dan jika Kalian ingin menambahkan Link-nya, tinggal di Copy  salah satu Codenya dan Paste-kan di bawahnya lagi.

[4]. Terakhir Simpan dan lihat hasilnya.

Selamat Mencoba...!!!