Saturday, February 21, 2015

Memasang Widget JNE, TIKI, Pos Indonesia

Memasang Widget JNE, TIKI, Pos Indonesia - Kali ini saya akan berbagi sebuah widget yang berfungsi untuk memudahkan pengunjung mengecek informasi kode nomor resi, nomor resi ini berguna untuk melacak sampai sejauh mana proses barang pesanan sampai di tujuan. Widget ini akan sangat berguna bagi sobat yang memiliki situs toko online (olshop).

Memasang Widget JNE, TIKI, Pos Indonesia

Bagi yang ingin mencobanya, silakan ikuti langkah berikut

Cara Memasang Widget JNE, TIKI, Pos Indonesia


1. Login ke Blogger > Tata Letak > Buat widget baru > Kemudian tambahkan kode di bawah ini di dalam widget baru.

<style scoped="scoped" type="text/css">
#kode-lacak{padding:10px;text-align:left;font-size:85%}
#kode-lacak form{display:block;position:relative;clear:both;overflow:hidden;margin:auto;text-align:center}
#kode-lacak .cek-jne,#kode-lacak .cek-tiki,#kode-lacak .cek-pos{text-align:left;display:inline-block;vertical-align:top;padding:2px 8px;height:33px;line-height:19px;color:#626262;background:#fff;outline:none;margin:10px 0;border:1px solid #e3e3e3;border-radius:2px;width:70%;float:left}
#kode-lacak .cek-jne-button,#kode-lacak .cek-tiki-button,#kode-lacak .cek-pos-button{display:inline-block;vertical-align:middle;height:33px;line-height:1;padding:0 18px;font-size:13px;color:#243140;text-align:center;text-shadow:0 1px rgba(255,255,255,.2);background:#e5e7ed;border:0;border-radius:2px;cursor:pointer;width:27%;outline:none;margin:10px 0 0 5px;transition:background .6s;}
#kode-lacak .cek-jne-button:hover,#kode-lacak .cek-jne-button:active,#kode-lacak .cek-tiki-button:hover,#kode-lacak .cek-tiki-button:active,#kode-lacak .cek-pos-button:hover,#kode-lacak .cek-pos-button:active{background:#ee4f3d;color:#fff}
</style>
<div id="kode-lacak">
Lacak resi <b>JNE</b><br />
<form action="http://www.jne.co.id/index.php" method="get" name="input" target="_new2">
<input name="mib" value="tracking.detail" type="hidden" />
<input name="awb" size="14" class="cek-jne" type="text" />
<input value="Cek" class="cek-jne-button" type="submit" /></form>
Lacak resi <b>TIKI</b><br />
<form method="post" action="http://www.tiki-online.com/tracking/track_single" name="input" target="_blank"><input id="TxtCon" name="TxtCon" size="14" class="cek-tiki" type="text" />
<input id="button" name="button" value="Cek" class="cek-tiki-button" type="submit" /></form>
Lacak resi <b>POS Indonesia</b>
<form method="get" action="http://www.posindonesia.co.id/home/modules/mod_search/tmpl/libs/lacakk1121m4np05.php" name="input" target="_blank"><input name="barcode" size="14" class="cek-pos" type="text" />
<input value="Cek" class="cek-pos-button" type="submit" /></form>
</div>

2. Simpan widget.