Tampilkan postingan dengan label html. Tampilkan semua postingan
Tampilkan postingan dengan label html. Tampilkan semua postingan
Minggu, 13 April 2014
3 Cara Meletakan Gambar Pada Bahasa HTML
Gambar merupakan suatu elemen penting dalam sebuah halaman HTML untuk meningkatkan cita rasa sebuah website atau blog selain dari fungsionalitasnya. Penggunaan gambar pada halaman HTML bisa berupa ilustrasi di dalam tulisan/posting, foto, sponsor dll. Nah kali ini saya akan membahasa Cara Meletakan Gambar Pada Bahasa Pemrograman HTML, cara yang paling mudah untuk meletakan gambar biasanya menggunakan kode tag <img> ini merupakan modal awal untuk meletakan gambar pada pengaplikasian HTML begini strukturnya :
<img src="alamat-url-gambar.jpg" alt="Nama/Judul Gambar" />
tag <img> adalah tag yang unik saya rasa, karena kode tersebut tidak menjepit dengan kodenya melainkan menjepit dirinya sendiri coba kalian perhatikan pada kode terakhir dia menjepit dirinya sendiri dengan kode /> adalagi pengguna src dan alt apa fungsinya? penggunaan atribut src atau kependekan dari Source bertujuan untuk mengetahui alamat url sumber dari gambar itu sendiri. Sedangkan atribut alt atau kependekan dari alternatif teks berguna untuk meletakan tulisan/keterangan jika browser yang digunakan tidak mendukung penampilan menggunakan gambar.
ohya penempatan gambar bisa kalian modifikasi sendiri sesuai selera kalian dengan penambahan atribut align. Coba kalian perhatikan kode dibawah ini :
Text Dibawah :
<img src="http://planetdiponk.blogspot.com/ujicoba/gambar.jpg" alt=" Nama/Judul Gambar" align="bottom" />
Text Ditengah - tengah :
<img src="http://planetdiponk.blogspot.com/ujicoba/gambar.jpg" alt=" Nama/Judul Gambar" align="middle" />
Text Diatas :
<img src="http://planetdiponk.blogspot.com/ujicoba/gambar.jpg" alt=" Nama/Judul Gambar" align="top" />
Penggunaan align="bottom untuk membuat bagian bawah dari gambar rata dengan bagian bawah tulisan, dan gunakan align="middle" untuk membuat gambar berada di tengah-tengah tulisan, namun apabila kalian menginginkan bagian atas gambar rata dengan bagian atas tulisan (rata atas) maka kalian dapat menggunakan align="top".
Jika kalian ingin meletakan pada bagian kanan atau kiri? kalian bisa merubah atribut align="left" dan align="right" ohya untuk posisi ditengah atau align=center perlu modifikasi yang berbeda dengan penambahan tag <center>.
Kiri
<img src="http://planetdiponk.blogspot.com/ujicoba/gambar.jpg" alt=" Nama/Judul Gambar" align="left" />
Kanan
<img src="http://planetdiponk.blogspot.com/ujicoba/gambar.jpg" alt=" Nama/Judul Gambar" align="right" />
Tengah
<center>
<img src="http://planetdiponk.blogspot.com/ujicoba/gambar.jpg" />
</center>
Kalian juga dapat menambahkan backgroound halaman dengan gambar dengan cara meletakan pada tab <body> kemudian tambahkan dengan atribut background.
<body background="namagambarkalian.gif">
Supaya terlihat rapi gunakan gambar berukuran 800 X 600 piksel. atau kalian bisa menambahkan sesuai dengan ukuran halaman kalian. Itulah cara meletakan gambar pada pengaplikasian bahasa HTML,
Semoga Bermanfaat.
<img src="alamat-url-gambar.jpg" alt="Nama/Judul Gambar" />
tag <img> adalah tag yang unik saya rasa, karena kode tersebut tidak menjepit dengan kodenya melainkan menjepit dirinya sendiri coba kalian perhatikan pada kode terakhir dia menjepit dirinya sendiri dengan kode /> adalagi pengguna src dan alt apa fungsinya? penggunaan atribut src atau kependekan dari Source bertujuan untuk mengetahui alamat url sumber dari gambar itu sendiri. Sedangkan atribut alt atau kependekan dari alternatif teks berguna untuk meletakan tulisan/keterangan jika browser yang digunakan tidak mendukung penampilan menggunakan gambar.
ohya penempatan gambar bisa kalian modifikasi sendiri sesuai selera kalian dengan penambahan atribut align. Coba kalian perhatikan kode dibawah ini :
Text Dibawah :
<img src="http://planetdiponk.blogspot.com/ujicoba/gambar.jpg" alt=" Nama/Judul Gambar" align="bottom" />
Text Ditengah - tengah :
<img src="http://planetdiponk.blogspot.com/ujicoba/gambar.jpg" alt=" Nama/Judul Gambar" align="middle" />
Text Diatas :
<img src="http://planetdiponk.blogspot.com/ujicoba/gambar.jpg" alt=" Nama/Judul Gambar" align="top" />
Penggunaan align="bottom untuk membuat bagian bawah dari gambar rata dengan bagian bawah tulisan, dan gunakan align="middle" untuk membuat gambar berada di tengah-tengah tulisan, namun apabila kalian menginginkan bagian atas gambar rata dengan bagian atas tulisan (rata atas) maka kalian dapat menggunakan align="top".
Jika kalian ingin meletakan pada bagian kanan atau kiri? kalian bisa merubah atribut align="left" dan align="right" ohya untuk posisi ditengah atau align=center perlu modifikasi yang berbeda dengan penambahan tag <center>.
Kiri
<img src="http://planetdiponk.blogspot.com/ujicoba/gambar.jpg" alt=" Nama/Judul Gambar" align="left" />
Kanan
<img src="http://planetdiponk.blogspot.com/ujicoba/gambar.jpg" alt=" Nama/Judul Gambar" align="right" />
Tengah
<center>
<img src="http://planetdiponk.blogspot.com/ujicoba/gambar.jpg" />
</center>
Kalian juga dapat menambahkan backgroound halaman dengan gambar dengan cara meletakan pada tab <body> kemudian tambahkan dengan atribut background.
<body background="namagambarkalian.gif">
Supaya terlihat rapi gunakan gambar berukuran 800 X 600 piksel. atau kalian bisa menambahkan sesuai dengan ukuran halaman kalian. Itulah cara meletakan gambar pada pengaplikasian bahasa HTML,
Semoga Bermanfaat.
Sabtu, 07 Desember 2013
Upload File CSS Javascript HTML di Host Google Drive
Google terus melakukan perubahan guna kenyamanan pengguna serta peningkatan efektifitas sistem. Googlecode merupakan tempat untuk melakukan upload file dengan berbagai jenis seperti CSS, JS (Javascript) , HTML, jQuery, dan sebagainya. Namun ketika anda pergi ke Google Code sekarang, Menu download sudah tidak ada lagi sehingga fungsi untuk upload file ke browser pun hilang. Proyek-proyek yang telah dibangun sebelumnya tetap akan masih tersimpan dan dapat digunakan.
Anda bisa dengan mudah mengupload kode css, ataupun javascript pada web anda. Caranya adalah dengan memanfaatkan fasilitas Google Drive. Google Drive akan mempermudah kita dengan banyaknya Aplikasi yang disediakan oleh Google , mulai dari Pengolah kata , Pengolah angka , Formulir , Presentasi , Pemutar Lagu , Video , Pembuatan Contact Form + Upload File (Integrasi dengan JOTFORM) , terus Alat konversi File , dan masih banyak lagi.
Berikut panduan, Tutorial cara mengupload file css, javascript di Google Drive Hosting :
1. Go to Googledrive on your browser.
2. Lalu jika anda adalah pengguna baru silahkan Login lewat email Gmail anda dan Buatlah satu buah folder sebagai tempat untuk menyimpan proyek file file penting anda. Caranya click CREATE.
3. Setelah folder jadi, klik logo icon Upload berwarna merah seperti gambar ini
4. Pilih File.
5. Cari document anda yang akan diupload.
6. Tunggu hingga proses unggah selesai yang ditampilkan pada bagian kanan bawah layar desktop anda.
7. Klik SHARE.
8. Copy link yang disediakan, paste di notepad terlebih dahulu.
9. Pada bagian Privacy, klik CHANGE. Mengubah privacy bertujuan untuk bagaimana file tersebut dapat diakses, jika private berarti khusus diri sendiri dan tidak dapat diakses oleh browser ketika meminta file css, js yang terupload tadi.
10. Pilih Public, agar semua browser dan orang lain yang membuka web blog anda dapat menggunakan file css atau javascript code yang diupload.
11. Maka akses akan berubah dari Private ke Public.
12. Click Save and save your link to share.
Sekarang, untuk mengkoneksikan antara file yang ada di Googledrive dengan blog anda caranya adalah :
Perhatikan, link to share file tadi, contohnya seperti ini :
https://docs.google.com/file/d/0B5s9APyz09BWXFjeVptY1dnZzA/edit?usp=sharing
Kode berwarna biru, silahkan anda copy dan ambil dan letakkan pada kode berikut untuk memanggil file anda :
Nah, sekarang struktur link tersebut sudah dapat digunakan untuk mengakses file kita dan coba buka URL diatas lalu lihat hasilnya , sama seperti ketika kalian menghosting File ke Yourjavascript atau googlecode kan ! Struktur URL itulah yang bisa berfungsi untuk diterapkan ke Blog kita , lalu dibagian ini kalian juga bisa meletakkan ekstensi .js .css .html .php atau yang lainnya tapi harus sesuai dengan Bahasa Pemrograman yang kalian Host.
9. Kemudian untuk penerapannya ke Blog atau website kita ngga ada perbedaan kok dengan saat menghosting File ke GoogleCode , yah kurang lebih kayak gini :
Untuk File CSS penulisannya seperti ini :
Bagaimana cara melakukan upload file css, javascript dengan googledrive? Tentu mudah kan. Ya, hampir sama dengan googlecode hanya berbeda sedikit dan cepat host tersebut. Itulah tadi panduan tentang memanfaatkan layanan Google Drive yang didalamnya anda dapat mengupload file musik, document, presentasi, aplikasi kecil, data Microsoft office Excell, sistematika statistik dan lainnya.
Berikut panduan, Tutorial cara mengupload file css, javascript di Google Drive Hosting :
1. Go to Googledrive on your browser.
2. Lalu jika anda adalah pengguna baru silahkan Login lewat email Gmail anda dan Buatlah satu buah folder sebagai tempat untuk menyimpan proyek file file penting anda. Caranya click CREATE.
3. Setelah folder jadi, klik logo icon Upload berwarna merah seperti gambar ini
5. Cari document anda yang akan diupload.
6. Tunggu hingga proses unggah selesai yang ditampilkan pada bagian kanan bawah layar desktop anda.
7. Klik SHARE.
8. Copy link yang disediakan, paste di notepad terlebih dahulu.
9. Pada bagian Privacy, klik CHANGE. Mengubah privacy bertujuan untuk bagaimana file tersebut dapat diakses, jika private berarti khusus diri sendiri dan tidak dapat diakses oleh browser ketika meminta file css, js yang terupload tadi.
11. Maka akses akan berubah dari Private ke Public.
12. Click Save and save your link to share.
Sekarang, untuk mengkoneksikan antara file yang ada di Googledrive dengan blog anda caranya adalah :
Perhatikan, link to share file tadi, contohnya seperti ini :
https://docs.google.com/file/d/0B5s9APyz09BWXFjeVptY1dnZzA/edit?usp=sharing
Kode berwarna biru, silahkan anda copy dan ambil dan letakkan pada kode berikut untuk memanggil file anda :
https://googledrive.com/host/MasukkanKodeFileDisini
Maka, hasilnya akan seperti :https://googledrive.com/host/0B5s9APyz09BWXFjeVptY1dnZzA
Nah, sekarang struktur link tersebut sudah dapat digunakan untuk mengakses file kita dan coba buka URL diatas lalu lihat hasilnya , sama seperti ketika kalian menghosting File ke Yourjavascript atau googlecode kan ! Struktur URL itulah yang bisa berfungsi untuk diterapkan ke Blog kita , lalu dibagian ini kalian juga bisa meletakkan ekstensi .js .css .html .php atau yang lainnya tapi harus sesuai dengan Bahasa Pemrograman yang kalian Host.
9. Kemudian untuk penerapannya ke Blog atau website kita ngga ada perbedaan kok dengan saat menghosting File ke GoogleCode , yah kurang lebih kayak gini :
Untuk File CSS penulisannya seperti ini :
<link href=https://googledrive.com/host/0B9bAUAMahvVPV19JSk3tQnQ3MFU rel=stylesheet/>Untuk File Javascript strukturnya seperti ini :
<script type="text/javascript" src="https://googledrive.com/host/0UPloadPyz09BWXFjeVptY1dnZzA/"></script>10. Silahkan anda copy dan letakkan pada blog anda diatas kode </head>
Bagaimana cara melakukan upload file css, javascript dengan googledrive? Tentu mudah kan. Ya, hampir sama dengan googlecode hanya berbeda sedikit dan cepat host tersebut. Itulah tadi panduan tentang memanfaatkan layanan Google Drive yang didalamnya anda dapat mengupload file musik, document, presentasi, aplikasi kecil, data Microsoft office Excell, sistematika statistik dan lainnya.
Langganan:
Postingan (Atom)