Pada kesempatan kali ini saya akan share tentang cara membuat DROP BOX pada postingan blog,
Mungkin anda belum mengerti apa itu "Drop Box".
"Drop Box" berfungsi untuk memblog sebagian dari posting tertentu, agar memudahkan pengunjung jika ingin mengkopi postingan tersebut.
Contoh :
Kehidupan ini adalah semu
Segala sesuatunya suka menipu
Hanya kamu yang ada dalam hatiku
Yang ku rindu di setiap waktu
Walaupun kamu tak tau itu
Ok! Pasti ngertikan.. sama yang dimaksud dengan "Drop Box" atau "Select All" ?!!
Langsung aja deeh... ikuti langkah-langkahnya Cekidot !
Pertama-tama Login ke Blog, pilih -Rancangan -Edit Html
Kalo kalian takut ada kesalahan dalam mengedit Htmlnya, Backup dulu Templatenya dengan mengklik Link Download Template Lengkap.
Ceklis pada tanda Expand Template Widget, lalu cari kode <head> (untuk memudahkan pencarian tekan Ctrl+F) kalo sudah ketemu copy script dibawah ini, lalu paste tepat dibawah kode <head>.
<script type="text/javascript">
function fnSelect(objId)
{
fnDeSelect();
if (document.selection)
{
var range = document.body.createTextRange();
range.moveToElementText(document.getElementById(objId));
range.select();
}
else if (window.getSelection)
{
var range = document.createRange();
range.selectNode(document.getElementById(objId));
window.getSelection().addRange(range);
}
}
function fnDeSelect()
{
if (document.selection)
document.selection.empty();
else if (window.getSelection)
window.getSelection().removeAllRanges();
}
</script>
Next. Cari kode ]]></b:skin>
Copi script dibawah ini, lalu paste tepat diatas kode ]]></b:skin>
/*__Style_copy_area__*/
.AvanceeBox1 { /* -- Style Box dalam --*/
padding:5px;
border:1px solid #FFC71F;
background:#3399ff;
}
.AvanceeBox2 { /* -- Style Box Luar --*/
background:white;
padding:7px;
}
.AvanceeButton { /* -- Style Tombolnya --*/
background:#000000;
border:1px solid #FFC71F;
color:#3399ff;
padding:2px;
font-weight:bold;
}
Kalian bisa mengedit tampilan box dan tombol'y pada script ke2 sesuai dengan selera kalian.
Langkah terakhir.
Pada Setiap kali posting, sisipkan script berikut :
<div class="AvanceeBox2">
<input class="AvanceeButton" type="button" value="Drop Box" onClick="fnSelect('haha')"/>
<div class="AvanceeBox1" id="haha">
TEXT KALIAN
</div>
</div>
Catatan : Ingat ganti teks yang berwarna merah setiap 1x penggunaan, ke 2 teks harus sama, ganti sesuka kalian (BEBAAASS...!!)
Ok! Saya rasa itu cukup jelas, bila ada kesalahan mungkin kalian tidak mengikuti langkah2 saya dengan benar.
Semoga Tips Tricks saya berguna, bila ada sedikit waktu mohon tuliskan komentar, karena komentar anda sangat berguna untuk kemajuan blog ini. Happy Blogging
oh ini toh mas, select all/drop box itu, hehe
Iyaaaap betuuuL
lol
Leave your comment
Thank you.