Cara Buat status atau komentar kosong di facebook


Untuk Membuat STATUS/KOMENTAR KOSONG di facebook bisa dilakukan dengan
Masukan kode ini @[1:1:SPASI] di kolom update status atau komentar jgn lupa hapus atau ganti kata SPASI dengan tanda SPASI BIASA Contohnya seperti ini @[1:1: ] atau seperti gambar berikut :


Dan hasilnya akan jadi status kosong seperti gambar dibawah ini :



jika kita ingin status atau komentar kosong kita lebih lebar kebawah tinggal menambahkan kode diatas menjadi lebih banyak misalnya 
@[1:1: ]@[1:1: ]

@[1:1: ]

@[1:1: ]

@[1:1: ]

@[1:1: ]

@[1:1: ]

@[1:1: ]

@[1:1: ]

@[1:1: ]

@[1:1: ]

@[1:1: ]

@[1:1: ]

@[1:1: ]

@[1:1: ]

Seperti gambar berikut :


maka hasilnya akan seperti gambar dibawah ini


Kode Diatas bisa digunakan untuk Status atau komentar di facebook supaya Blank atau kosong.
Selamat mencoba.
Baca Terusan nya

Geser Judul Posting Dan Widget

Secara default blogger telah memberikan tatanan Judul selalu berawal dari samping kiri. baik itu judul blog, judul posting maupun judul sidebar/widget
Memang sebagian orang ada yang puas dengan letak posisi judul pemberian dari blogger blogger, namun sebagai seorang yang selalu ingin mengembangkan kreatifitas seperti saya ini pasti selalu kurang puas dengan apa yang telah blogger berikan.
Agar  judul blog, judul posting maupun judul sidebar/widget berada ditengah atau rata tengah, caranya sama saja
cuman bedanya kalau judul sidebar kodenya: .sidebar h2
sedangkan Judul posting kodenya: .post h3

Contoh Judul Widget :

                   Enter Top 


Contoh Judul Posting :

 Geser Judul Posting Dan Widget


Baiklah kalau masih bingung lakukan langkah berikut ini:

1.Untuk Judul Posting :

-Login ke Bloger dengan akun anda

-Klik Rancangan >> edit HTML (centang 'Expand Template Widget')

-Cari kode .post h3 {  dengan menggunakan Ctrl+F pada kaybort

-Setelah ketemu tambahkan kode text-align:center; setelah kode .post h3 {
kalau sudah jangan lupa klik save Tamplate


2.Untuk Judul sidebar/widget :

-Login ke Bloger dengan akun anda

-Klik Rancangan >> edit HTML (centang 'Expand Template Widget')

-Cari kode .sidebar h2 {  dengan menggunakan Ctrl+F pada kaybort

-Setelah ketemu tambahkan kode text-align:center; setelah kode sidebar h2 {
kalau sudah jangan lupa klik save Tamplate

Tambahan :

Bila di dalam template anda sudah terdapat kode
.sidebar h2 {
text-align:left; 
maupun sudah terdapat kode
.post h3 {
text-align:left; 

maka anda cukup mengganti left; menjadi center;

Agar lebih jelas, perhatikan kode berikut ini: 

text-align: left; artinya tulisan rata kiri
text-align: center; artinya tulisan rata tengah
text-align: right; artinya tulisan rata kanan 

Itulah tadi trik Membuat Judul Post dan Judul Sidebar/Widget Berada Di Tengah mudah mudahan jelas dan bermanfaat. Jika masih belum jelas atau ada tulisan yang salah mari kita sharing karena kita juga sama-sama belajar.

Selamat Mencoba..!


Baca Terusan nya

Cara Memberi Background Archive Blog

Bagi sobat-sobat yang mungkin ingin tampilan archive blognya lebih keren dan menarik. Ni saya punya sedikit trik untuk itu semua.
Trik ini sudah pernah saya coba dan hasilnya menurut saya juga cukup memuaskan, trik ini juga bisa sobat terapkan pada Widget-Widget lain nya seperti yang ter dapat pada arsip blog ini.
ARSIP BLOG yang ada di blog ini pada bagian atas kanan itu sebenar nya bukan arsip blog bawaan bloger namun itu merupakan tambahan Widget HTML/Javascript.
 Seperti pada gambar ini

                            

                           

Nah baagi sobat yang tertarik dengan trik ini, ikuti langkah-langkah sbb :


1. Login ke Bloger dengan akun anda

2. Klik Rancangan >> edit HTML (centang 'Expand Template Widget')

3. Cari kode <div id='ArchiveList'> untuk memudahkan pencarian tekan ctrl + f

4. Kopy kode dibawah ini dan Paste-kan diatas kode <div id='ArchiveList'> :

<div style='overflow:auto; height:300px; background:url(http://i865.photobucket.com/albums/ab218/1rd3/Gununges.jpg); background-repeat:no-repeat;'>

Sehingga menjadi :

<div class='widget-content'>
<div style='overflow:auto; height:300px; background:url(http://i865.photobucket.com/albums/ab218/1rd3/Gununges.jpg); background-repeat:no-repeat;'>
<div id='ArchiveList'>
<div expr:id='data:widget.instanceId + &quot;_ArchiveList&quot;'>
<b:if cond='data:style == &quot;HIERARCHY&quot;'>
<b:include data='data' name='interval'/>
</b:if>
<b:if cond='data:style == &quot;FLAT&quot;'>
<b:include data='data' name='flat'/>
</b:if>
<b:if cond='data:style == &quot;MENU&quot;'>
<b:include data='data' name='menu'/>
</b:if>
</div>
</div>
</div>
<b:include name='quickedit'/>

5. Simpan Template dan lihat hasilnya. 

 Ket :
Kode height:300px; =tinggi Background dan ini dapat sobat sesuaikan. Link http://i865.photobucket.com/albums/ab218/1rd3/Gununges.jpg =adalah alamat uril gambar dan bisa sobat ganti.

Selamat Mencoba...!


Baca Terusan nya

Cara Membagi Dua Header

  Blogger Template designer memiliki kode yang berbeda dengan kode lama. Karena masih baru sehingga banyak para blogger mania yang bingung untuk memodifikasi template blogger yang baru.

  Beberapa waktu yang lalu Klak Klik mencoba ganti template memakai template blogger yang baru. Karena ada sedikit perbedaan kode html dan itu masih asing alias belum akrab sehingga seluruh gadget yang telah terpasang rapih menjadi berantakan.
                               
  Saya suka dengan header 2 kolom, satu di kiri dan satunya lagi di kanan. Sedangkan Blogger template baru tidak menyediakan template dengan header yang 2 kolom. Ketika hendak membagi header, saya mencoba menerapkan tips yang lama ternyata tidak berhasil. Setelah berkelana kesana kemari akhirnya kutemukan juga blog yang memposting tentang cara membagi header di blogger baru.

  Maklum saya bukanlah orang yang ahli dalam bidang kode mengkode, juga tanpa didasari ilmu tentang blog, hanya berbekal nekad dan semangat pantang menyerah akhirnya terpecahkan juga misteri kode blogger baru. Meskipun memakan waktu yang cukup lama 3hari tetapi saya bangga dengan hasil yang saya capai.

  Nah, sebagai ungkapan rasa bangga ini pada tutorial kali ini saya coba amalkan hasil perjuanganku selama ini kepada pembaca sekalian. Khusunya tips mengenai cara membagi header 2 kolom pada template designer blogger.
                                         Ini contoh gambar hasil pengeditan :


Bagi yang mau mencoba tips ini, silahkan ikuti langkah berikut ini:

1. Masuk ke akun Blogger Anda.

2. Klik Rancangan > Edit HTML.

3. Klik Download Template Lengkap untuk membuat salinan template. Hal ini untuk mengantisipasi jika nanti terjadi kesalahan dalam pengeditan kita dapat dengan mudah mengembalikan template ke seperti semula.

4. Cari (CTRL+F) kode " /* Header " lalu Copy script dibawah ini dan Paste-kan tepat dibawah kode tsb :

.header-outer {
background: $(header.background.color) $(header.background.gradient) repeat-x scroll 0 -400px;
_background-image: none;min-height: 154px; /* untuk mengatur tinggi header (height) */}
#header {
width: 45%; /* untuk mengatur lebar header kiri - title, description, image */
margin-right: 10px;float: left; }
#bgs_headerkanan {
float: right;
width: 49%; /* mengatur lebar header kanan */
margin: 20px 10px 5px 10px;
padding: 2px;}
#bgs_headerkanan .widget {margin: 3px;}


5. Selanjutnya cari kode " <div class='region-inner header-inner'> " lalu Copy script dibawah ini dan Paste-kan tepat dibawah kode tsb :

<b:section class='bgs_headerkanan' id='bgs_headerkanan' maxwidgets='1' showaddelement='yes'></b:section>


6. Simpan Templete dan hasilnya bisa kita lihat seperti gambar di bawah ini:

Selamat Mencoba...!


Baca Terusan nya

Screen Saver Blog Dengan Css3

Wah dah lama juga ne gak update postingan maklum sob sibuk...:D
baiklah,kali ini Klak Klik akan membuat postingan cara membuat Screen saver css3.
Screen saver Css3 akan muncul /tampil pada blog pada saat Mouse kita diamkan dan pada saat mouse kita gerakkan maka kita akan kembali lagi pada halaman yang awal.
penasaran kan???, silahkan lihat dulu demonya :

                                                  DEMO





1. Login ke Akun Blog anda

2. Pada Dasbor Klik Rancangan=>> Kemudian Tambah Gadget Dan pilih HTML Java/Script
           

Jika masih dalam posisi tab Elemen Laman, silahkan klik terlebih dahulu tab menu Elemen Laman.

                 

-Klik Tambah Gadget untuk menambahkan gadget baru.

               

-Setelah muncul jendela baru, klik tanda plus untuk HTML/JavaScript

                   

3. Kopy Kode di bawah ini dan paste di didalam kolom HTML Java/Script tsb.

<style type="text/css">
/* Circle Text Styles */
#outerCircleText {
/* Optional - DO NOT SET FONT-SIZE HERE, SET IT IN THE SCRIPT */
font-style: italic;
font-weight: bold;
font-family: 'comic sans ms', verdana, arial;
color: #FFFFFF;


/* End Optional */
/* Start Required - Do Not Edit */
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">
/* Circling text trail- Tim Tilton
Website: http://www.tempermedia.com/
Visit: http://www.dynamicdrive.com/ for Original Source and tons of scripts
Modified Here for more flexibility and modern browser support
Modifications as first seen in http://www.dynamicdrive.com/forums/
username:jscheuer1 - This notice must remain for legal use
*/
;(function(){


// Your message here (QUOTED STRING)
var msg = "Jeritan Hati";


/* THE REST OF THE EDITABLE VALUES BELOW ARE ALL UNQUOTED NUMBERS */
// 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;


////////////// Stop Editing ///////////////
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>
<style type="text/css">body .saving{position: fixed;width: 100%;top: 0;left:0;height: 100%;opacity: 0.98;filter: alpha(opacity=98);-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=98)";background: #000000;border-bottom: 3px solid transparent;z-index: 999999;-o-transition: all 3s ease-in-out 10s;-moz-transition: all 3s ease-in-out 10s;-webkit-transition: all 3s ease-in-out 10s;}body:hover .saving {opacity: 0.0;height:0.001%;filter: alpha(opacity=0);-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";background: #8484AB;border-bottom: 5px solid #333333;-o-transition: opacity 2s ease-in-out 2.5s, background-color 3s linear 0.5s, height 1s ease-in 1.8s;-moz-transition: opacity 2s ease-in-out 2.5s, background 3s linear 0.5s, height 1s ease-in 1.8s;-webkit-transition: opacity 2s ease-in-out 2.5s, background 3s linear 0.5s, height 1s ease-in 1.8s;}body .saving p.esm1{margin: 0;padding: 0;width: 92%;background: transparent;font-size: 100px;font-family: "Serif", Times New Roman;color: #ffffff;text-shadow: 0 0 2px #cccccc, 0 -5px 4px #7B00FF, 2px -6px 6px #9981A3, -2px -8px 9px #000000,   2px -10px 10px #9065A1;position: relative;margin-top: 200px;line-height: 20px;font-weight: bold;text-align: center;border: 30px solid transparent;border-radius: 20px;-moz-border-radius: 20px;-webkit-border-radius: 20px;-o-transition: -o-transform 5s ease-out 8s, background-color 4s ease-out 12s;-moz-transition: -moz-transform 5s ease-out 8s, background 4s ease-out 12s;-webkit-transition: -webkit-transform 5s ease-out 8s, background 4s ease-out 12s;}body:hover .saving p.esm1{font-size: 10px;color: red;width: 25%;margin: 340px 0 0 300px;padding: 25px;background: #aaaaaa;border: 20px solid #888888;border-radius: 170px;-moz-border-radius: 170px;-webkit-border-radius: 170px;-o-transform:translate(600px,-500px) rotate(360deg) scale(0.2);-moz-transform:translate(600px,-500px) rotate(360deg) scale(0.2);-webkit-transform:translate(600px,-500px) rotate(360deg) scale(0.2);-o-transition: font 1.1s 0.1s, width 1.3s 0.4s, margin-left 0.8s 1.2s, -o-transform 1.2s linear 1.5s, background-color 0.6s ease-in 0.6s, margin-top 1.2s ease-in 0.5s, border 3s ease-in;-moz-transition: font 1.1s 0.1s, width 1.3s 0.4s, margin-left 0.8s 1.2s, -moz-transform 1.2s linear 1.5s, background 0.6s ease-in 0.6s, margin-top 1.2s ease-in 0.5s, border 3s ease-in;-webkit-transition: font 1.1s 0.1s, width 1.7s 0s, margin-left 0.8s 1.2s, -webkit-transform 1.2s linear 1.5s, background 0.6s ease-in 0.6s, margin-top 1s ease-in 0.5s, border 3s ease-in, -webkit-border-radius 3s ease-in;}.saving p span.esm2{font-size: 18px;opacity: 0.5;filter: alpha(opacity=50);-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=50)";display: block;text-align: center;width: 300px;margin: -10px auto; font-weight: normal;padding: 2px 8px;background: #000000;border: 1px solid #333333;border-radius: 0;-moz-border-radius: 0;-webkit-border-radius: 0;color: #0000FF;text-shadow: none;font-family: Arial, Helvetica, sans-serif;-o-transition: 1s ease-out;-moz-transition: 1s ease-out;-webkit-transition: 1s ease-out;}.saving:hover p span.esm2{font-size: 10px;width: 200px;padding: 0;}.saving p span.esm3{color: #cccccc;font-family: "Tahoma", Arial, Helvetica;display: block;margin:10px auto;background: url http://i964.photobucket.com/albums/ae124...) left center repeat-x;background: -moz-linear-gradient(top,#66666,#111111);background: -webkit-gradient(linear,0% top,0% bottom,from(#111111),to(#666666));opacity: 0.6;filter: alpha(opacity=60);-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=60)";width: 250px;text-shadow: 1px 1px 1px #000000;border: 1px solid #333333;border-radius: 4px;padding:2px 10px;-moz-border-radius: 4px;-webkit-border-radius: 4px;font-size: 12px;font-weight: normal;line-height: 16px;}.saving .by_evanzip{margin-left: 30px;text-align: center;color: #D1C9D6;font-size: 12px;font-weight: normal;position: absolute;bottom: 30px;width: 100%;height: 20px;left: 0;}.saving .by_Tejahtc span.esm4 {color: #aaaaaa;font-style:italic;font-size:14px;font-weight:bold;text-transform:uppercase;}#recpost {width:210px;overflow: hidden;height: 327px;float: right;margin-top: 10px;padding: 4px 2px;background: transparent;border: 1px solid transparent;border-radius: 10px;-moz-border-radius: 10px;-webkit-border-radius: 10px;-o-transition: all 1.5s ease-out;-moz-transition: all 1.5s ease-out;-webkit-transition: all 1.5s ease-out;}</style>
<div class='saving'>
<p class='esm1'>Klak Klik<br/>
<br/><div class='by_evanzip'>Original design by: <span class='esm4'> Galan Fuji Septian - galanf.blogspot.com</span> - 2011</div>
</p>
<center><span class='esm3'>Move your mouse to go back to the page!<br/><blink>Aduh...jangan pergi dulu,gerakin aja lagi mousenya,nah gitu dong!</blink></span>
</center></div>


4.Ubah nama  Klak Klik dengan nama sobat

5.Klik Simpan Dan lihat hasil nya..

Selamat Mencoba...!


Baca Terusan nya
Al Qur'an Komputer Edit Photo Game Sulap
Stop Pastikan Umur Anda 18+ ..!