 |
Untuk menampilkan sebuah gambar, tentu saja kamu harus mempunyai gambar yang telah di upload ke hosting tempat menyimpan gambar. Untuk contoh saja, alamat yang saya gunakan untuk contoh adalah sebagai berikut :
Untu membuat frame gambar silahkan teman-teman ikuti langkah-langkah berikut :
Sign in di blogger
1.Klik menu Layout
2.Klik menu Edit HTML
3.Klik tulisan Download Full Template, silahkan save dulu untuk berjaga-jaga apabila terjadi kesalahan editting
5.Copy paste kode berikut:
#gambar {
background:url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjy7gApyVydnx89g4uGnEbvXsv648zdDoK5s6WYYOqmaR1vxZK30y0ceQJsb8LSBSsmNFgCF8MWo1cDGrAub6iVTYSUI0sysOzl-OWjE-ztyKtAIb5tQvbdnZAi_UuAmo6lfYXO4sPmeEk/s320/h3llb0y.jpg'); /* alamat gambar yg mau ditampilkan */
height:300px; /* untuk mengatur tinggi gambar */
width:500px; /* untuk mengatur lebar gambar */
}
#tulisan {
font-size:300%; /* ini adalah kode untuk merubah besarnya hurup */
font-weight:normal; /* ini agar hurup yg tampil normal, jika ingin tebal ganti dengan bold */
color:#ffffff; /* ini kode warna untuk hurup */
}
code di atas kamu simpan persis di atas code ini ]]></b:skin>
6.Klik tombol SIMPAN TEMPLATE
ok selanjut nya
-Klik menu Elemen Halaman
-Klik tulisan Tambah sebuah Elemen Halaman
-Klik tombol TAMBAHKAN KE BLOG di bawah tulisan HTML/JavaScript
-Copy paste kode berikut pada elemen yang muncul
<table border="10" cellpadding="3" height="135" width="500"/>
<tr>
<td>
<div id="gambar">
<div id="tulisan">
<marquee onmouseover="this.stop()" onmouseout="this.start()" scrollamount="4" direction="left" width:500px height:25px;>
masukan url image kamu disini
</marquee>
</div>
</div>
</td>
</tr>
</table>
-Klik tombol SIMPAN PERUBAHAN
-Sorot elemen yang baru di buat, klik lalu tahan dan kemudian pindahkan pada tempat yang sobat inginkan (di drag and drop)
-Klik tombol SIMPAN
Selesai.
Pada kode-kode diatas sudah saya sertakan keterangan tentang kode-kode css yang saya pasang untuk memudahkan saya dalam hal mengedit sesuai keinginan
0 Komentar