Search

Jumat, 06 Juli 2012

Cara Membuat Kotak Admin di dalam Postingan dengan Script Pake Gambar / Foto


1. Seperti biasa, buka akun blog kawan.
2. Masuklah pada Rancangan Template anda kawan (sepertinya kawan-kawan sudah menggunakan tampilan blog yang baru kan), dimana pilih Opsi Lain lalu pilih lagi Template lalu klik Edit HTML.
3. Selanjutnya Klik / pilih Lanjutkan
4. Centang Expand Template Widget 
5. Carilah kode ]]></b:skin> di template anda (seperti biasa gunakan Ctrl + F untuk memudahkan pencarian.
6. Copy / Salin lah kode script di bawah ini dan paste-lah tepat berada di atas kode ]]></b:skin>
.admin-tulisan{
display:block;
width:auto;
background:#DFE6EF;
border:2px solid #DFE6EF;
box-shadow:0 1px 3px #CCE9FD;-moz-box-shadow:0 1px 3px #CCE9FD;-webkit-box-shadow:0 1px 3px #CCE9FD;
padding:0;
margin:30px 0 10px 0;
font:normal 12px Arial, Sans-Serif;
color:#222;
}
.admin-tulisan .kontainer{padding:5px;}
.admin-tulisan h4{
background:#777;
border:none;
border-bottom:1px solid #CCE9FD;
color:#fff;
text-transform:normal;
text-shadow:0 1px 0 rgba(0, 0, 0, 0.4);
font:bold 12px Arial,Sans-Serif;
padding:5px 10px;
margin:0 0 0 0;
display:block;
}
.admin-tulisan h4 a{color:#FEEA83;}
.admin-tulisan img{
width:70px;
height:70px;
margin:0 10px 0 0;
float:left;
border:1px solid #F0F5FA;
padding:2px;
background:#F5F9FD;
box-shadow:none;-moz-box-shadow:none;-webkit-box-shadow:none;
}
7. Setelah Anda menempatkannnya kemudian langkah selanjutnya adalah carilah kode<data:post.body/>. 
8. Setelah ketemu kode <data:post.body/>, copylah scrip di bawah ini dan paste-lah tepat di bawah kode <data:post.body/>
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<!-- Kotak Admin -->
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<div class='admin-tulisan'>
<h4><a expr:href='data:blog.homepageUrl'><data:post.author/></a> Tutorial Bagi Pemula</h4>
<div class='kontainer'>
<img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhxcNQrEI7n8TsLqxavaZvkMKs6stFCEtyb4r2MGfF7DQqji5dxVi_RulhNAW0XLX5Fg8QjqQPMCYJ-aJZxqHLzMA7tR8kpebATE22jnQ2NrR6hUTChAm55TRBokLSn57lpFK8uASoqyUMn/s45/sepeda_ontel.jpg'/>
Terimakasih Anda telah membaca tentang <a expr:href='data:post.url'><data:post.title/></a> Semoga informasi <a expr:href='data:post.url'><data:post.title/></a> bisa memberikan hiburan bagi Anda. Jangan lupa komentar Anda dan Jempol Anda di tunggu di Halaman Facebook Kami. Salam Sukses.
<div style='clear:both;'/>
</div>
</div>
</b:if>
<!-- Kotak Admin -->
</b:if>
9. Setelah selesai, simpan template blog anda. Dan lihat hasilnya.

Catatan :
  • Untuk tulisan berwarna pink silahkan ganti kode warna kesukaan anda klik disini untuk mencari kode warna
  • Untuk tulisan berwarna merah silahkan ganti apa saja, AB sarankan tulisanya Deskripsiblog anda.
  • Untuk tulisan berwarna orange silahkan gantilah dengan link gambar yang anda inginkan.
  • Untuk tulisan berwarna biru silahkan ganti dengan kata-kata anda.

Contoh Kotak Admin tanpa Gambar
Cara Membuat Kotak Admin di dalam Postingan dengan Tabel (tanpa gambar/foto).
1. Abaikan langkah no 5 dan no 6 di atas
2. Lakukan langkah no 7 pencarian kode <data:post.body/>
3. Copy-lah script di bawah ini dan paste-kan tepat di bawah kode <data:post.body/>
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<table><tr>

<td>&lt;center&gt;Terimakasih Anda telah membaca tentang <a expr:href='data:post.url'><data:post.title/></a> Semoga informasi <a expr:href='data:post.url'><data:post.title/></a>bisa memberikan hiburan bagi Anda. Jangan lupa komentar Anda dan Jempol Anda di tunggu di Halaman Facebook Kami. Salam Sukses.&lt;/center&gt;</td>

</tr></table>
</b:if>
4. Simpan template anda dan lihat hasilnya.

Tidak ada komentar:

Posting Komentar