Selamat Sore... Hari ini kita akan belajar menginstall debian. Emangnya saya bisa ya? Kalau ada niat dan usaha, kenapa tidak? Toh tidak ada salahnya kita nafsu mencari ilmu bukan?
Hari ini kita ditemani oleh admin blog tetangga, http://gunawanblognet.blogspot.co.id. yang sudah mau meminjakan laptopnya sambil ngajarin caranya nginstall beginian. Baiklah, kita mulai saja ya...
1. Setelah booting, kita akan mendapati tampilan seperti berikut. Tidak usah bingung. Kita pilih Install, karena tujuan kita memang untuk menginstall.
2. Kemudian akan muncul tampilan yang mempertanyakan bahasa yang kita gunakan. Berhubung saya sudah terbiasa dengan bahasa Inggris, maka kita pilih English. Tapi jika anda menginginkannya, anda bisa memilih bahasa lain.
3. Lalu kita akan ditanyai tentang teritory atau wilayah kita. Karena Indonesia tidak ada di situ, maka kita pilih Other.
4. Ini mirip dengan yang di atas, bedanya ini cakupannya lebih besar. Mari kita pilih daerah di mana Indonesia berada yaitu Asia.
5. Sekarang, cari Indonesia. Dijamin pasti ada. Tapi, kenapa kita harus memilih Indonesia? Tentu saja karena kita ada di Indonesia.
6. Sekarang, kita pilih local buat encode. Pilih saja yang United States.
7. Kalau yang ini, kita memilih jenis keyboard kita. Di Indonesia, kebanyakan keyboard itu American English, jadi pilih itu.
8. Kita klik Continue, jika muncul peringatan seperti ini.
9. Lalu kita pilih Configure Network Manually
10. Isikan IP address-nya.
11. Jangan lupa, isi juga ip yang menjadi gateway-nya.
12. Lalu isi IP yang akan menjadi alamat server kita.
13. Isi kan hostname-nya. Contohnya di sini, gunawan
14. Isi nama domain yang kita gunakan.
15. Isi kan password root kita.
16. Isi lagi, harus sama seperti yang sebelumnya.
17. Lalu kita buat user baru yang bukan root.
18. Lalu kita isi password user tersebut.
20. Lalu kita sesuaikan dengan zona kita. Berhubung kita berada di jawa, maka kita pilih yang Western. Jika kita berada di Papua, maka yang kita pilih bukan Western akan tetapi Eastern.
21. Setelah itu, kita mengatur partisi. Untuk yang pemula-pemula, lebih baik pilih Guided - use entire disk. Tapi bila kita sudah biasa, mungkin kita akan memilih yang Manually saja.
22. Selanjutnya, kita pilih disk yang akan kita gunakan.
23. Lalu kita pilih All files in one partition.
24. Lalu kita pilh Finish partitioning and write changes to disk.
25. Lalu pilih Yes.
26. Kalau yang ini, pilih No saja.
27. Yang ini juga pilih No saja.
28. Ini juga No.
29. Kita pilih sesuai dengan kebutuhan kita. Untuk memilih atau tidaknya, kita gunakan tombol spasi. Kita bisa memilih yang GUI atau yang CLI. Kita pilih saja SSH Server dan Standart system utilities.
30. Lalu di tengah loading akan ada seperti ini, pilih Yes.
31. Jika akhirnya muncul yang seperti ini, pilih disk yang kita gunakan.
32. Dan yang terakhir, kita pilih continue.
33. Selanjutnya debian akan reboot atau restart. Setelah reboot, maka debian kita sudah siap digunakan.
Begitulah pelajaran singkat hari ini. Semoga berguna ya...
Tampilkan postingan dengan label prakerin. Tampilkan semua postingan
Tampilkan postingan dengan label prakerin. Tampilkan semua postingan
Kamis, 15 Oktober 2015
Selasa, 06 Oktober 2015
Beres-beres kamar belakang
Senin kemarin, atau lebih tepatnya senin sore kemarin, kami beres-beres kamar belakang. Beres-beres yang kami maksud di sini bukan hanya sekedar menyapu, mengepel atau sekedar bersih-bersih lainnya. Akan tetapi kami juga menambal bagian-bagian tembok yang tidak rata dan mengecat tembok. Sebenarnya, tujuannya sih membuat kamar tersebut menjadi lebih nyaman digunakan. Karena kamar belakang itu biasanya digunakan untuk sholat. Selain itu kamar belakang juga sering digunakan sebagai tempat bersantai.
Kegiatan ini di awali dengan menyemprot bagian tembok yang berlubang. Tentunya, sebelum hal itu dilakukan kami sudah memindahkan barang-barang yang sebelumnya ada di sana ke tempat yang lebih aman.
Setelah itu kami meracik bahan penambalnya, yaitu semen putih dengan air.
Karena keterbatasan alat, hanya dua orang yang melakukan penambalan. Sedangkan yang lain bertugas untuk merapikan hasil tambalan, membasahi lubang yang masih kering, menemukan lubang-lubang tersembunyi di balik cat, dan mengelupas cat sebelumnya.
Setelah kami rasa cukup menambal temboknya, kami mempersiapkan catnya. Cat warna putih 1/3 ember besar. Awalnya hanya ada 3 kuas yang digunakan untuk mengecat. Jadi, dari 6 orang yang ada di sana hanya setengahnya saja yang mengecat. Beruntungnya lagi, kami menemukan sebuah kuas roll di gudang. Tambah satu orang lagi yang mengecat.
Setelah itu, pengecatan didominasi oleh kuas roll karena pengecatan menggunakan kuas roll jauh lebih cepat dibandingkan kuas biasa. Strategi pengecatan kami ubah. Kuas roll untuk pengecatan dinding, sedangkan kuas biasa untuk mengecat bagian-bagian sudut ruangan.
Sehari kemudian, atau lebih tepatnya hari ini. Kamar yang kemarin kami cat menjadi seperti ini:
Kelihatan lebih nyaman bukan?
Kegiatan ini di awali dengan menyemprot bagian tembok yang berlubang. Tentunya, sebelum hal itu dilakukan kami sudah memindahkan barang-barang yang sebelumnya ada di sana ke tempat yang lebih aman.
Setelah itu kami meracik bahan penambalnya, yaitu semen putih dengan air.
Karena keterbatasan alat, hanya dua orang yang melakukan penambalan. Sedangkan yang lain bertugas untuk merapikan hasil tambalan, membasahi lubang yang masih kering, menemukan lubang-lubang tersembunyi di balik cat, dan mengelupas cat sebelumnya.
![]() |
Setelah itu, pengecatan didominasi oleh kuas roll karena pengecatan menggunakan kuas roll jauh lebih cepat dibandingkan kuas biasa. Strategi pengecatan kami ubah. Kuas roll untuk pengecatan dinding, sedangkan kuas biasa untuk mengecat bagian-bagian sudut ruangan.
![]() |
Sehari kemudian, atau lebih tepatnya hari ini. Kamar yang kemarin kami cat menjadi seperti ini:
Kelihatan lebih nyaman bukan?
Selasa, 15 September 2015
Naik Tower Jaringan
Kemarin sore saya belajar caranya naik tower yang baik dan benar (saya tidak bisa mengatakan 100% benar). Untuk lebih jelasnya lagi, saya naik tower tiga kaki (triangel tower) yang ada di BLC Klaten. Meskipun cuma naik 2 meter, sih. Tapi yang penting sudah pernah nyoba. Saya ingin banyak cerita, tapi saya cuma naik sedikit, praktek dengan safety belt, leyeh-leyeh sejenak dan turun buat gantian sama yang lain.
Di sini ada 2 alat keamanan yang tersedia dan bisa dipakai. Yaitu Safety Belt dan Seat Harness.
Seat Harness itu kira-kira seperti ini:
Kalau Safety Belt seperti ini:
Cara pakainya kayak orang ini:
Berhubung yang praktek bukan cowok saja, maka seat harness-nya diprioritaskan buat cewek. Sedangkan yang cowok pakai safety belt.
Lalu ilmu yang saya dapatkan adalah... saya tidak mencatat ketika dijelasin, jadi saya hanya mengungkapkan apa yang saya tangkap saja ya.
Seat Harness setidaknya bisa membawa beban sampai 100 kg. Keunggulan Seat Harness ketimbang safety belt adalah bisa digunakan untuk bergelantungan. Bergelantungan yang saya maksud adalah baik tangan atau kaki tidak berpijak atau berpegangan pada tower, tapi memanfaatkan Seat Harness.
Tentang tower tiga kaki:
Tower itu terdiri dari beberapa bagian yang disebut dengan stage. Masing-masing stage biasanya memiliki panjang 4 meter. Lalu jarak spanner terhadap tower adalah tidak boleh kurang dari 1/3 tinggi tower. Serta harus sama jarak masing-masing spanner terhadap tower. Contohnya, tower di BLC memiliki tinggi 32 meter (8 stage), maka jarak spanner terhadap towernya tidak boleh kurang dari 10,7 meter.
Sebelum kita naik, ada beberapa hal yang harus kita perhatikan terlebih dahulu.
Yang pertama adalah kondisi tubuh. Apakah mampu untuk melakukan pemanjatan tower atau tidak? Jika keadaan kurang memungkinkan, maka lebih baik tidak memaksakan diri naik tower.
Yang kedua adalah keadaan sekitar. Walaupun saya bilang keadaan sekitar, tapi bukan berarti cuma melihat keadaan sekitar lho. Maksud saya, perhatikan keadaan lingkung, cuaca, dan jangan lupa keadaan tower. Apakah cuacanya memungkinkan untuk melakukan pemanjatan? Apakah keadaan towernya memungkinkan untuk dipanjat? Jangan sampai ketika kita memanjat tower, tiba-tiba saja towernya roboh.
Lalu pastikan kita membawa alat-alat yang diperlukan sesuai dengan keadaan. Minimal, kita memakai sepatu atau sandal yang tidak licin. Jika memakai kerudung atau mempunyai rambut yang panjang, lebih baik kerudung atau rambutnya diikat (sesuai keinginan, tapi jangan aneh-aneh) agar tidak terjadi hal-hal yang tidak diinginkan akibat rambut atau kerudung yang berkibar diterpa angin. Pakai alat keamanan miniman safety belt, jika ada yang lebih baik maka gunakan yang lebih baik.
Oh, iya. Harap melakukan pelemasan ketika hendak memanjat ya.
Jika keadaan (tubuh, cuaca, tower) bagus, perlengkapan memadahi (sesuai kebutuhan), dan sudah ada tim(sesuai kebutuhan kerja). Maka anda siap untuk memanjat, kecuali anda belum mengerti tehniknya.
Ulurkan tangan ke atas depan, raih bagian tiang yang vertikal bukan horizontal, perlahan panjat tuh tower. Usahakan tangan tidak terlalu menekuk ketika memanjat. Kalau bisa, tangan diluruskan dan badan agak condong ke belakang. Tapi kalau towernya tidak dalam keadaan yang bagus, jangan condongkan badan kebelakang karena dapat menimbulkan gerakan tower bergoyang. Jika ada tali spanner yang kendor, maka usahakan kita memanjat sambil membelakangi bagian tali yang kendor tersebut. Maksudnya bukan tali tersebut berada di belakang kita, tapi tali tersebut ada di depan kita dan kita memanjat tower sambil menarik tali yang kendor tersebut.
Jika sudah sampai pada ketinggian atau tempat untuk bekerja, maka kita tinggal mengintegrasikan (memasang) alat keamanan kita dengan tower agar kita dapat lebih berkonsentrasi untuk bekerja. Tapi, bagaimana caranya?
Yang pertama adalah mengunci kaki. Apaan tuh? Akan saya jelaskan berdasarkan imajinasi saya, karena lebih mudah jika kita langsung praktek.
Perhatikan gambar jelek saya di bawah:
Kira-kira ini yang akan kita lihat kalau naik tower kaki tiga. Jika kaki kita berhenti di area warna merah, maka kita menggunakan kaki kanan untuk membuat kuncian pada area biru. Sedangkan kalau kaki kita berhenti di area warna hijau, maka kita membuat kuncian dengan kaki kiri pada area warna kuning. Ketika melakukan kuncian kaki, biasanya tubuh diserongkan ke arah kaki yang akan menunci. Setelah melakukan kuncian kaki, salah satu tangan masuk dan mendekap tower. Tunggu, rasanya penjelasan saya agak kurang bisa dimengerti. Pokoknya salah satu tangan mendekap bagian tower yang horizontal dengan lengan atas (taruh bagian horizontal tower di ketiak). Sedangkan tangan yang satunya lagi memasang alat pengaman pada tower. Kuncian tangan tersebut dilakukan secara bergantian. Sedangkan kuncian kaki tetap. Jika alat pengaman (entah itu safety belt atau seat harness) sudah terpasang, silahkan lepaskan kuncian kaki dan bekerja.
Jika pekerjaan sudah selesai, buat kuncian kaki lagi, lalu kuncian tangan dengan salah satu tangan sedangkan tangan yang lain melepaskan alat pengaman pada tower. Lakukan hal tersebut dengan kedua tangan secara bergantian. Setelah alat pengaman sudah terlepas, lepas kuncian kaki tapi pada saat yang sama harus ada salah satu tangan yang melakukan kuncian. Jika kuncian kaki sudah terlepas, lepas kuncian tangan dan turun pelan-pelan. Aturan turun masih sama dengan aturan ketika memanjat. Tangan selalu berpegangan pada bagian tower yang vertikal dan kaki selalu menginjak bagian yang horizontal. Usahakan lengan tidak terlalu tertekuk.
Ada pertanyaan? Meskipun saya bukan ahlinya dalam hal ini, akan tetapi saya harap apa yang saya sampaikan bisa berguna untuk orang lain. Terima kasih...
Di sini ada 2 alat keamanan yang tersedia dan bisa dipakai. Yaitu Safety Belt dan Seat Harness.
Seat Harness itu kira-kira seperti ini:
Kalau Safety Belt seperti ini:
Cara pakainya kayak orang ini:
Berhubung yang praktek bukan cowok saja, maka seat harness-nya diprioritaskan buat cewek. Sedangkan yang cowok pakai safety belt.
Lalu ilmu yang saya dapatkan adalah... saya tidak mencatat ketika dijelasin, jadi saya hanya mengungkapkan apa yang saya tangkap saja ya.
Seat Harness setidaknya bisa membawa beban sampai 100 kg. Keunggulan Seat Harness ketimbang safety belt adalah bisa digunakan untuk bergelantungan. Bergelantungan yang saya maksud adalah baik tangan atau kaki tidak berpijak atau berpegangan pada tower, tapi memanfaatkan Seat Harness.
Tentang tower tiga kaki:
Tower itu terdiri dari beberapa bagian yang disebut dengan stage. Masing-masing stage biasanya memiliki panjang 4 meter. Lalu jarak spanner terhadap tower adalah tidak boleh kurang dari 1/3 tinggi tower. Serta harus sama jarak masing-masing spanner terhadap tower. Contohnya, tower di BLC memiliki tinggi 32 meter (8 stage), maka jarak spanner terhadap towernya tidak boleh kurang dari 10,7 meter.
Sebelum kita naik, ada beberapa hal yang harus kita perhatikan terlebih dahulu.
Yang pertama adalah kondisi tubuh. Apakah mampu untuk melakukan pemanjatan tower atau tidak? Jika keadaan kurang memungkinkan, maka lebih baik tidak memaksakan diri naik tower.
Yang kedua adalah keadaan sekitar. Walaupun saya bilang keadaan sekitar, tapi bukan berarti cuma melihat keadaan sekitar lho. Maksud saya, perhatikan keadaan lingkung, cuaca, dan jangan lupa keadaan tower. Apakah cuacanya memungkinkan untuk melakukan pemanjatan? Apakah keadaan towernya memungkinkan untuk dipanjat? Jangan sampai ketika kita memanjat tower, tiba-tiba saja towernya roboh.
Lalu pastikan kita membawa alat-alat yang diperlukan sesuai dengan keadaan. Minimal, kita memakai sepatu atau sandal yang tidak licin. Jika memakai kerudung atau mempunyai rambut yang panjang, lebih baik kerudung atau rambutnya diikat (sesuai keinginan, tapi jangan aneh-aneh) agar tidak terjadi hal-hal yang tidak diinginkan akibat rambut atau kerudung yang berkibar diterpa angin. Pakai alat keamanan miniman safety belt, jika ada yang lebih baik maka gunakan yang lebih baik.
Oh, iya. Harap melakukan pelemasan ketika hendak memanjat ya.
Jika keadaan (tubuh, cuaca, tower) bagus, perlengkapan memadahi (sesuai kebutuhan), dan sudah ada tim(sesuai kebutuhan kerja). Maka anda siap untuk memanjat, kecuali anda belum mengerti tehniknya.
Ulurkan tangan ke atas depan, raih bagian tiang yang vertikal bukan horizontal, perlahan panjat tuh tower. Usahakan tangan tidak terlalu menekuk ketika memanjat. Kalau bisa, tangan diluruskan dan badan agak condong ke belakang. Tapi kalau towernya tidak dalam keadaan yang bagus, jangan condongkan badan kebelakang karena dapat menimbulkan gerakan tower bergoyang. Jika ada tali spanner yang kendor, maka usahakan kita memanjat sambil membelakangi bagian tali yang kendor tersebut. Maksudnya bukan tali tersebut berada di belakang kita, tapi tali tersebut ada di depan kita dan kita memanjat tower sambil menarik tali yang kendor tersebut.
Jika sudah sampai pada ketinggian atau tempat untuk bekerja, maka kita tinggal mengintegrasikan (memasang) alat keamanan kita dengan tower agar kita dapat lebih berkonsentrasi untuk bekerja. Tapi, bagaimana caranya?
Yang pertama adalah mengunci kaki. Apaan tuh? Akan saya jelaskan berdasarkan imajinasi saya, karena lebih mudah jika kita langsung praktek.
Perhatikan gambar jelek saya di bawah:
Kira-kira ini yang akan kita lihat kalau naik tower kaki tiga. Jika kaki kita berhenti di area warna merah, maka kita menggunakan kaki kanan untuk membuat kuncian pada area biru. Sedangkan kalau kaki kita berhenti di area warna hijau, maka kita membuat kuncian dengan kaki kiri pada area warna kuning. Ketika melakukan kuncian kaki, biasanya tubuh diserongkan ke arah kaki yang akan menunci. Setelah melakukan kuncian kaki, salah satu tangan masuk dan mendekap tower. Tunggu, rasanya penjelasan saya agak kurang bisa dimengerti. Pokoknya salah satu tangan mendekap bagian tower yang horizontal dengan lengan atas (taruh bagian horizontal tower di ketiak). Sedangkan tangan yang satunya lagi memasang alat pengaman pada tower. Kuncian tangan tersebut dilakukan secara bergantian. Sedangkan kuncian kaki tetap. Jika alat pengaman (entah itu safety belt atau seat harness) sudah terpasang, silahkan lepaskan kuncian kaki dan bekerja.
Jika pekerjaan sudah selesai, buat kuncian kaki lagi, lalu kuncian tangan dengan salah satu tangan sedangkan tangan yang lain melepaskan alat pengaman pada tower. Lakukan hal tersebut dengan kedua tangan secara bergantian. Setelah alat pengaman sudah terlepas, lepas kuncian kaki tapi pada saat yang sama harus ada salah satu tangan yang melakukan kuncian. Jika kuncian kaki sudah terlepas, lepas kuncian tangan dan turun pelan-pelan. Aturan turun masih sama dengan aturan ketika memanjat. Tangan selalu berpegangan pada bagian tower yang vertikal dan kaki selalu menginjak bagian yang horizontal. Usahakan lengan tidak terlalu tertekuk.
Ada pertanyaan? Meskipun saya bukan ahlinya dalam hal ini, akan tetapi saya harap apa yang saya sampaikan bisa berguna untuk orang lain. Terima kasih...
Rabu, 26 Agustus 2015
Menyimpan Data dari textarea TinyMCE Menggunakan MySQL
Bagaimana caranya menyimpan teks yang ditulis pada textarea WYSIWYG TinyMCE?
Pertama, buat tabel tiny di database db_tiny dengan struktur sebagai berikut:
Kemudian buat sebuah file tiny.php dengan skrip seperti berikut:
Baiklah, waktunya penjelasan.
1. Pada tabel, data yang akan menampung data dari textarea harus bertipe TEXT. Kalau VARCHAR, masih kurang mencukupi.
2. Ketika menyimpan ke MySQL, harus diberi addslashes agar kalau ada tanda petik dua (") tidak menyebabkan error pada saat eksekusi query tersebut.
Itu saja, kalau ada yang kurang dipahami silahkan bertanya.
Pertama, buat tabel tiny di database db_tiny dengan struktur sebagai berikut:
Field | Type | Length | Extra | Primary |
---|---|---|---|---|
id_berita | INT | 5 | auto_increment | |
judul | VARCHAR | 100 | ||
isi | TEXT |
Kemudian buat sebuah file tiny.php dengan skrip seperti berikut:
<?php
if(isset($_POST['simpan'])){
$isi = addslashes($_POST['isi']);
mysql_connect("localhost","root","");
mysql_select_db("db_tiny");
mysql_query("insert into tiny(judul, isi) values('$_POST[judul]','$isi')");
}
?>
<!doctype html>
<html>
<head>
<title>TinyMCE MySQL</title>
<script type="text/javascript" src="tinymce/tinymce.min.js"></script>
<script type="text/javascript">
tinymce.init({
selector: "textarea",
plugins: [
"advlist autolink lists link image charmap print preview anchor",
"searchreplace visualblocks code fullscreen",
"insertdatetime media table contextmenu paste"
],
toolbar: "insertfile undo redo | styleselect | bold italic | alignleft aligncenter alignright alignjustify | bullist numlist outdent indent | link image"
});
</script>
</head>
<body>
<form method="post" action="">
Judul : <input type="text" name="judul" maxlength="50">
<br><br>
isi Berita :<br>
<textarea name="isi" rows="15" cols="80">
</textarea>
<br>
<input type="submit" name="simpan" value="Simpan">
<input type="reset" value="Batal">
</form>
</body>
</html>
Baiklah, waktunya penjelasan.
1. Pada tabel, data yang akan menampung data dari textarea harus bertipe TEXT. Kalau VARCHAR, masih kurang mencukupi.
2. Ketika menyimpan ke MySQL, harus diberi addslashes agar kalau ada tanda petik dua (") tidak menyebabkan error pada saat eksekusi query tersebut.
Itu saja, kalau ada yang kurang dipahami silahkan bertanya.
Selasa, 25 Agustus 2015
Mengenal, Memasang dan Menggunakan Font Awesome
Pernahkah kita kebingungan mencari icon-icon untuk blog atau website? Entah yang kita cari itu icon user, icon menu, atau icon sosial media. Pokoknya, icon itu berperan cukup penting dalam mempercantik tampilan sebuah web. Jika kita mencari icon di google.com, maka kita perlu mendownload satu per satu gambar yang akan digunakan. Kalau cuma beberapa icon sih tidak masalah, tapi bagaimana kalau kita akan menggunakan puluhan icon?
Untuk itu, kali ini saya ingin mengenalkan pada kalian yang belum kenal dengan "Font Awesome". Pernah dengar tentang Font Awesome?
Singkat saja, Font Awesome adalah font icon yang dapat dipanggil menggunakan css. Font Awesome dibuat oleh Dave Gandy dalam GitHub Project. Kita dapat mengunjungi halaman resminya di http://fortawesome.github.io/Font-Awesome/
Baik-baik, kemampuan Font Awesome meliputi :
Pertama, download Font Awesome di http://fortawesome.github.io/Font-Awesome/. Tekan tombol download, lalu akan muncul sebuah modalbox, tekan tombol download yang ada.
Kemudian ekstrak file zip-nya, dan copy ke dalam folder projek kita.
Lalu tambahkan font-awesome.min.css dalam tag <head> pada projek kita.
Daftar icon yang bisa digunakan bisa kalian lihat pada halaman http://fortawesome.github.io/Font-Awesome/icons/
Cukup sekian yang kita pelajari tentang Font Awesome. Kalau ada pertanyaan, jangan ragu untuk bertanya. Arigatou...
Untuk itu, kali ini saya ingin mengenalkan pada kalian yang belum kenal dengan "Font Awesome". Pernah dengar tentang Font Awesome?
Singkat saja, Font Awesome adalah font icon yang dapat dipanggil menggunakan css. Font Awesome dibuat oleh Dave Gandy dalam GitHub Project. Kita dapat mengunjungi halaman resminya di http://fortawesome.github.io/Font-Awesome/
Timbul, pertanyaan. Apa aja sih yang ia bisa?
Baik-baik, kemampuan Font Awesome meliputi :
- 1. Satu font, tapi berisi banyak icon. Icon yang adapun saya rasa sudah cukup lengkap.
- 2. Tidak memerlukan sintaks JavaScript dalam pengaplikasiannya.
- 3. Icon menggunakan gambar Scalable Vector Graphics (SVG) sehingga kualitas gambar tetap terjaga dalam berbagai ukuran.
- 4. Gratis. Yang paling penting adalah... Font Awesome itu gratis.
- 5. Style dapat dimodifikasi menggunakan css. Seperti mengganti warna, ukuran, shadow dan apapun yang mungkin menggunakan css.
- 6. Cocok digunakan pada tampilan resolusi tinggi.
- 7. Meskipun pada awalnya dibuat untuk Bootstrap, namun tetap bisa digunakan pada semua framework.
- 8. Dapat digunakan pada dekstop.
- 9. Mudah dideteksi pada layar.
Timbul, pertanyaan. Bagaimana kita menginstal atau memasang Font Awesome?
Ada beberapa cara yang bisa kita gunakan untuk memasang Font Awesome. Tapi, saya akan menjelaskan dua cara saja. Satu untuk online dan satu untuk offline.1. Menggunakan BootstrapCDN dari MaxCDN
Ini adalah cara yang paling mudah. Tidak perlu mendownload atau menginstall apapun. Cukup menambahkan satu baris kode html di dalam tag <head> pada website kita.
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.4.0/css/font-awesome.min.css">
Dengan satu syarat, yaitu harus online.2. Menggunakan CSS
Kalau ini cara biasa. Di netbook saya, saya bisa menggunakan Font Awesome meskipun offline. Tapi, kadang ada icon tertentu yang tidak mau nampil dan saya kurang tahu mengapa.Pertama, download Font Awesome di http://fortawesome.github.io/Font-Awesome/. Tekan tombol download, lalu akan muncul sebuah modalbox, tekan tombol download yang ada.
Kemudian ekstrak file zip-nya, dan copy ke dalam folder projek kita.
Lalu tambahkan font-awesome.min.css dalam tag <head> pada projek kita.
<link rel="stylesheet" href="path/font-awesome/css/font-awesome.min.css">
Pastikan path atau alamat benar, dan Font Awesome sudah terpasang.Bagaimana menggunakan Font Awesome?
Cara menggunakannya tidak sulit kok. Cukup tambahkan class="fa fa-icon" dan atur ukuran dan warna menggunakan css. Contoh :
<!doctype html>
<html>
<head>
<title>Contoh Font Awesome</title>
<link rel="stylesheet" type="text/css" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.4.0/css/font-awesome.min.css">
</head>
<body>
<a href="#" class="fa fa-ambulance" style="color:gray;font-size:100px;"></a>
</body>
</html>
Dan hasilnya adalah Daftar icon yang bisa digunakan bisa kalian lihat pada halaman http://fortawesome.github.io/Font-Awesome/icons/
Cukup sekian yang kita pelajari tentang Font Awesome. Kalau ada pertanyaan, jangan ragu untuk bertanya. Arigatou...
Senin, 24 Agustus 2015
Mengenal Editor WYSISYG TinyMCE
Pernah mendengar tentang editor WYSISYG?
Baiklah, WYSIWYG adalah singkatan dari What You See Is What You Get yang artinya apa yang kamu lihat adalah apa yang kamu dapatkan. Menurut Wikipedia, editor WYSISYG adalah suatu sistem di mana konten (teks dan grafis) pada layar selama proses editing muncul dalam bentuk erat sesuai dengan penampilan saat dicetak atau ditampilkan sebagai produk jadi, seperti dokumen, halaman web, atau slide presentasi.
Timbul, pertanyaan. Editor WYSIWYG itu gunanya buat ngapain, sih?
Bayangkan kita adalah seorang programmer yang ingin membuat sebuah website berita. Tentunya programmer harus bisa memberikan website dengan antarmuka yang mudah digunakan oleh reporter dalam menuliskan isi beritanya. Untuk memenuhi hal itu, biasanya disediakan texarea yang memungkinkan user untuk mengetik lebih dari satu baris.
Sayangnya, teks yang berada di dalam textarea tidak bisa diformat, seperti dimiringkan, ditebalkan, atau diatur ukuran hurufnya pada kalimat tertentu. Kecuali user hafal perintah HTML dan menuliskannya secara manual di dalam textarea tersebut. Tentunya ini sangat menyulitkan bagi reporter ataupun user yang awam dengan HTML.
Jalan keluarnya adalah menggunakan editor WYSIWYG (What You See Is What You Get). Editor WYSIWYG akan memudahkan user dalam mengisi konten website layaknya menggunakan aplikasi pengolah kata(Microsoft Word atau Open Office).
Lagi-lagi, timbul pertanyaan. Editor apa aja sih yang termasuk WYSIWYG dan gimana dapetinnya? Cara nginstalnya gimana? Gunainnya gimana? Implementasinya di web gimana? Waduh~ Sabar ya...
Ada bayak editor WYSIWYG yang bisa kita pakai. Kalau nanya mbah google, nanti pasti akan nongol banyak, seperti :
Dari pada bingung mau pilih yang mana, kali ini saya akan menggunakan TinyMCE dan sedikit membahas editor WYSIWYG tersebut.
Download TinyMCE di http://www.tinymce.com/download/download.php (pilih yang deskripsinya "Contains all you need for production usage" dan tekan tombol download di samping kanannya)
Ekstrak file zipnya, kemudian pindahkan hasil ekstrak tersebut (tinymce) ke folder htdocs (atau folder projek kalian).
Lalu pasang masukkan file tinymce.min.js dari tinymce ke dalam file html atau php kalian. Contohnya, kita akan membuat sebuah file yang bernama tini.html di htdocs dengan script :
Hasilnya seperti berikut :
Tapi, itu belum kelihatan semua fiturnya lho! Karena di atas kita menggunakan cara yang paling mudah. Bagaimana kalau mau yang standar? Cukup ubah
Kalau mau yang full fiturnya, ganti
Bagaimana? Menarik? Menurut saya, fitur yang disediakan oleh TinyMCE sudah terbilang memadahi. Sayangnya, plugins untuk Upload File atau File Manager yang tersedia berbayar. Jadi tidak bisa tinggal pasang gambar, langsung terupload. Salah satu solusinya adalah menggunakan Responsive File Manager yang dapat diunduh di http://www.responsivefilemanager.com.
Lain kali kita akan membahas tentang menyimpan hasil dari editing menggunakan TinyMCE ke dalam database MySQL. Sampai jumpa lagi...
Kalau ada yang tidak anda pahami, jangan sungkan untuk bertanya.
Baiklah, WYSIWYG adalah singkatan dari What You See Is What You Get yang artinya apa yang kamu lihat adalah apa yang kamu dapatkan. Menurut Wikipedia, editor WYSISYG adalah suatu sistem di mana konten (teks dan grafis) pada layar selama proses editing muncul dalam bentuk erat sesuai dengan penampilan saat dicetak atau ditampilkan sebagai produk jadi, seperti dokumen, halaman web, atau slide presentasi.
Timbul, pertanyaan. Editor WYSIWYG itu gunanya buat ngapain, sih?
Bayangkan kita adalah seorang programmer yang ingin membuat sebuah website berita. Tentunya programmer harus bisa memberikan website dengan antarmuka yang mudah digunakan oleh reporter dalam menuliskan isi beritanya. Untuk memenuhi hal itu, biasanya disediakan texarea yang memungkinkan user untuk mengetik lebih dari satu baris.
Sayangnya, teks yang berada di dalam textarea tidak bisa diformat, seperti dimiringkan, ditebalkan, atau diatur ukuran hurufnya pada kalimat tertentu. Kecuali user hafal perintah HTML dan menuliskannya secara manual di dalam textarea tersebut. Tentunya ini sangat menyulitkan bagi reporter ataupun user yang awam dengan HTML.
Jalan keluarnya adalah menggunakan editor WYSIWYG (What You See Is What You Get). Editor WYSIWYG akan memudahkan user dalam mengisi konten website layaknya menggunakan aplikasi pengolah kata(Microsoft Word atau Open Office).
Lagi-lagi, timbul pertanyaan. Editor apa aja sih yang termasuk WYSIWYG dan gimana dapetinnya? Cara nginstalnya gimana? Gunainnya gimana? Implementasinya di web gimana? Waduh~ Sabar ya...
Ada bayak editor WYSIWYG yang bisa kita pakai. Kalau nanya mbah google, nanti pasti akan nongol banyak, seperti :
- CKEditor (http://ckeditor.com/)
- TinyMCE (http://www.tinymce.com/)
- Froala Editor (https://www.froala.com/wysiwyg-editor)
- NicEdit (http://nicedit.com/)
- Redactor (http://imperavi.com/redactor/)
- Aloha Editor (http://www.alohaeditor.org/)
- dan lain-lain.
Dari pada bingung mau pilih yang mana, kali ini saya akan menggunakan TinyMCE dan sedikit membahas editor WYSIWYG tersebut.
Instalasi atau Pemasangan TinyMCE
Sebelum menggunakan TinyMCE rasanya kurang afdhol kalau kita tidak mengenal TinyMCE terlebih dahulu. Jadi... menurut halaman awal TinyMCE...TinyMCE adalah platform web independen berdasarkan Javascript HTML editor WYSIWYG kontrol dirilis sebagai Open Source di bawah LGPL.Intinya, TinyMCE merubah textarea standar menjadi sebuah editor WYSIWYG. Adapun langkah-langkah pemasangan dan penggunaannya adalah sebagai berikut :
TinyMCE memiliki kemampuan untuk mengkonversi bidang TEXTAREA HTML atau elemen HTML lainnya untuk kasus redaksi.
Download TinyMCE di http://www.tinymce.com/download/download.php (pilih yang deskripsinya "Contains all you need for production usage" dan tekan tombol download di samping kanannya)
Ekstrak file zipnya, kemudian pindahkan hasil ekstrak tersebut (tinymce) ke folder htdocs (atau folder projek kalian).
Lalu pasang masukkan file tinymce.min.js dari tinymce ke dalam file html atau php kalian. Contohnya, kita akan membuat sebuah file yang bernama tini.html di htdocs dengan script :
<!doctype html>
<html>
<head>
<title>Contoh</title>
<script src="tinymce/js/tinymce/tinymce.min.js"></script>
<script>
tinymce.init({selector:'textarea'});
</script>
</head>
<body>
<textarea>Easy! You should check out MoxieManager!</textarea>
</body>
</html>
Bagian yang saja warnai adalah bagian untuk memanggil tinymce.min.js. Bagian ini perlu disesuaikan dengan alamat atau path dari file tinymce.min.js tersebut.
<script>
tinymce.init({selector:'textarea'});
</script>
Sedangkan script tinymce.init({selector:'textarea'}); digunakan untuk menempatkan editor WYSIWYG ke dalam textarea. Jangan lupa dengan <!doctype html> yang berada paling atas. Tanpa itu, editor ini tidak bisa digunakan.Hasilnya seperti berikut :
Tapi, itu belum kelihatan semua fiturnya lho! Karena di atas kita menggunakan cara yang paling mudah. Bagaimana kalau mau yang standar? Cukup ubah
<script>
tinymce.init({selector:'textarea'});
</script>
Menjadi
<script>
tinymce.init({
selector: "textarea",
plugins: [
"advlist autolink lists link image charmap print preview anchor",
"searchreplace visualblocks code fullscreen",
"insertdatetime media table contextmenu paste"
],
toolbar: "insertfile undo redo | styleselect | bold italic | alignleft aligncenter alignright alignjustify | bullist numlist outdent indent | link image"
});
</script>
Dan hasilnya agak beda :Kalau mau yang full fiturnya, ganti
<script>
tinymce.init({selector:'textarea'});
</script>
Menjadi
<script>
tinymce.init({
selector: "textarea",
theme: "modern",
plugins: [
"advlist autolink lists link image charmap print preview hr anchor pagebreak",
"searchreplace wordcount visualblocks visualchars code fullscreen",
"insertdatetime media nonbreaking save table contextmenu directionality",
"emoticons template paste textcolor colorpicker textpattern imagetools"
],
toolbar1: "insertfile undo redo | styleselect | bold italic | alignleft aligncenter alignright alignjustify | bullist numlist outdent indent | link image",
toolbar2: "print preview media | forecolor backcolor emoticons",
image_advtab: true,
templates: [
{title: 'Test template 1', content: 'Test 1'},
{title: 'Test template 2', content: 'Test 2'}
]
});
</script>
Dan tampilan semua fiturnya seperti ini :Bagaimana? Menarik? Menurut saya, fitur yang disediakan oleh TinyMCE sudah terbilang memadahi. Sayangnya, plugins untuk Upload File atau File Manager yang tersedia berbayar. Jadi tidak bisa tinggal pasang gambar, langsung terupload. Salah satu solusinya adalah menggunakan Responsive File Manager yang dapat diunduh di http://www.responsivefilemanager.com.
Lain kali kita akan membahas tentang menyimpan hasil dari editing menggunakan TinyMCE ke dalam database MySQL. Sampai jumpa lagi...
Kalau ada yang tidak anda pahami, jangan sungkan untuk bertanya.
Langganan:
Postingan (Atom)