Tutorial: Floating Cbox

Hai! I'm back! So, gak usah panjang lebar, kita langsung aja gak apa kan ya? :v Fathya males euy. (Terus kalo males ngapain balik ngeblog?) Mau ngisi To Do List 😜 #JustKidding.

Fathya mau ngeblog tapi gak tahu mau post apa, makan-nya males 😒 Tapi Fathya mau online lagi kok! Jadi, readmore aja yak  :V

• Login to blogger << dasbor
• Tata Letak << nah, ada beberapa macam pilihan, bukan? YEP! Pilih HTML Javasxript
• Setelah itu, copy kode ini

<style>
#chatme{
position:fixed; top:5px; left:5px;
padding-top:5px;padding-bottom:17px;
text-align:center;
height:20px; width:95px;
overflow:hidden;
border:3px Dashed #F9B5CC;
color:#888;
border-radius:40px;
-webkit-transition: opacity 0.7s linear;
-webkit-transition: all 0.7s ease-in-out;
-moz-transition: all 0.7s ease-in-out;
-o-transition: all 0.7s ease-in-out;
background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgOmSzhRkLkmyXJNdK6-OJJEvMibrQY_-rUbedbxfOIDkm_LCI_SFL73Yh8PvHqzCnK-_YLZsstoQAW4HmOlCeT9gZ0Cl1UEo7Ci_rXs_GyyoTjpBJNHRtXv4rolwAIbyYscG7epwNcIjZM/s1600/background13.png);
z-index:999;
}
#chatmelive{
padding-top:10px;
-moz-transition: all 0.5s ease-in-out;
-o-transition: all 0.5s ease-in-out;
-ms-transition: all 0.5s ease-in-out;
transition: all 0.5s ease-in-out;
} #chatme:hover {
border:3px dotted pink; padding:5px; height:450px; width:280px;
border-radius:40px;
}
</style>
<div id="chatme">
<center>
<img src="ICON CHAT" style="background:none;border:none;padding-top:0px;" /></center>
<div id="chatmelive">
KODE CBOX</div>

• Paste di kotak HTML
•  Save!

Ps:

Hitam+putih: Icon chat

Abu-abu: Kode chatbox

Credit: Kak Angel

PS2: 

Jangan ambil gambar diatas yak!