Membuat Menu Horizontal

Cara yang paling sederhana untuk membuat menu horizontal dengan menggunakan list ialah
mengubah properti display dari elemen li menjadi bernilai inline. Dengan mengubah
properti ini, elemen li yang awalnya merupakan block level element akan berubah menjadi inline
level element, dan dapat saling tersusun secara horizontal.

Begitu mengubah nilai properti display menjadi inline, penanda daftar akan langsung hilang,
dan setiap elemen dalam daftar akan saling bergabung. Idealnya, kita harus memberikan jarak
secara manual menggunakan padding ataupun margin.
Kode HTML di bawah:

Dipadukan dengan script CSS berikut :

akan menghasilkan seperti gambar dibawah

Kita dapat memodifikasi sedikit CSS untuk membuat menu menjadi lebih indah
berikut script CSS:

dengan hasil seperti gambar dibawah

semoga bermanfaat !! 

• DEMO

Read More

Cara Membuat Menu Navigasi

List sebagia Menu

Membuat sebuah website yang terdiri dari beberapa atau banyak halaman. Untuk mempermudah pengguna dalam melakukan navigasi pada website kita, tentunya kita harus menyediakan menu yang diakses dan dilihat oleh pengguna.
Karena hal tersebut, elemen navigasi merupakan salah satu yang paling penting  dan hampir selalu ditemukan dalam sebuah website.

Menu Vertikal Menggunakan List
Sebuah menu dikatakan vertikal jika menu tersebut ditampilkan secara menurun kebawah. Misalkan

Kita dapat mengaplikaskan CSS untuk menggantikan warna latar belakang sari setiap li, kemudian menghilangkan penanda daftar, memberikan lebar yang sama dan berbagai pengukuran lainnya sehingga didapatkan kotak penuh yang menyerupai menu, seperti berikut :

Sehingga kita akan mendapatkan tampilan seperti gambar dibawah

Teks dari menu diatas masih belum selesai, kita perlu menambahkan sedikir kode untuk mengubah teks didalam menjadi terlihat dengan jelas, tidak bergaris bawah, serta memnuhi seluruh blok, scriptnya :

Sehingga hasil akhir dari script menu navigasi diatas seperti gamabar dibawah

Oiya, hampir kelupaan
Unutk membuat menu perlu diingat dalam pembuatan menu ialah bahwa kita harus memberitahukan pengguna dengan mudah dimana menu yang dipilihnya, misal kita dapat merubah warna warna latar dan teks serta menebalkan teks ketika pengguna sedang berada dalam satu halaman. Keberadaan pengguna dapat ditandai dengan sebuah class baru, yang diberikan secara dinamis sesuai dengan halamannya.
script css untuk mendapatkan efek tersebut

hasil yang akan kita dapatkan ,

Semoga bermanfaat !

• DEMO

Read More

Cara Menghubungkan HTML, PHP dan Database

Bingung bagaimana cara menghubungkan database ke html dan php dan database agar web menjadi lebih dinamis. Oke, disini saya akan menuliskan caranya, tapi kalau masih ada yang kurang benar tolong dikoreksi ya, karena saya juga masih belajar hehehehe.....
Berikut langkah-langkahnya :
1. Buat Database dengan nama biodata, nama tabel biodata

2. Buat file baru dengan ekstensi.php. (contoh.php)
3. Isikan kode html pada file yang telah dibuat. Misal

4. Setelah coding html selesai tambahkan script PHP, berikut scriptnya

Silahkan mencoba, semoga bermanfaat ! 

Read More

Cara Mudah Mempelajari Konversi Bilangan Binary, Desimal dan Hexadesimal

1. Konversi Bilangan Desimal ke Binary
Contoh Soal :
Coba konversikan bilangan desimal ke bilangan binary, dimana angka bilangan desimal yang dikonversikan adalah angka 67.

67 : 2 -> 1

33 : 2 -> 1

16 : 2 -> 0

8 : 2 -> 0

4 : 2 -> 0

2 : 2 -> 0

1

jadi, 67 = 1000011

Penjelasan,

kita akan mengkonversikan angka 67 dari bilangan desimal ke biner, langkah pertama yang harus kita lakukn adalah membagi angka yang akan dikonversikan dengan angka 2, kemudian jika hasil bagi memilki sisa maka sisanya bernilai 1 dan jika hasil bagi tidak memiliki sisa makan nilainya 0. Hasil dari bagi inilah yang merupakan hasil dari kenversi bilangan.

2. Konversi Bilangan Binary ke Desimal

Contoh soal :

Konversikan bilangan binary ke desimal, dimana  angka binary yang akan dikonversikan adalah 1000011

1000011 = (1 x (2-7)) + (0 x (2-6)) + .......

(1 x 26) + ( 0 x 25) +  (0 x 24) + (0 x 23) + (0 x 22) + (1 x 21) + (1 x 20)

= 26 + 0 + 0 + 0 + 0 + 21 + 20 = 67

Penjelasan:

Bilangan biner yang akan dikonversikan dengan 2n-1 seperti contoh diatas, kemudian jumlahkan setiap hasil perkalian, dimana n  adalah jumlah banyaknya atau jumlah angka pada bilangan biner yang akan dikonversikan. Misal bilangan biner diatas 1000011 terdapat 7 buah angka, jadi untuk merubah ke bilangan desimal kita perlu mengalikannya dengan 2n-1.

3. Konversi Bilangan Desimal ke Hexadesimal

Contoh soal :

Konversikan bilangan desimal ke hexadesimal, dimana angka desimal yang akan dikonversikan adalah 30

30 : 16 = 1, sisanya 14(E)

jadi, dec 30 = hex 1E

langkah pertama adalah membagi angka bilangan desimal yang akan dikonversikan dengan angka 16, kemudian tulis hasil bagi, jika tidak habis dibagi 16 tulis sisa pembagian disamping tulisan hasil, kemudian jika hasil bagi lebih besar dari 16 maka hasil bagi itu sendiri dibagi dengan 16.

contoh lain :

160 : 16 = 10(A) sisa 0

jadi, dec 160 = hex A0

4. Konversi Bilangan Hexadesimal ke Desimal

Contoh soal :

Konversikan bilangan hexadseimal ke desimal, dimana angka yang akan dikonversikan adalah 1E dan 188

1E = (1 x 161) (14 x 160) = 30

188 = (1 x 162) (1 x 161) (1 x 160) = 256 + 16 + 8 = 280

langkah yang dilakukan hanya kebalikan dari  konversi bilangan desimal ke hexadesimal, langkah pertama adalah mengalikan angka bilangan hexadesimal yang akan dikonversikan dengan angka 16n-1, kemudian jumlahkan hasil perkalian seperti contoh diatas, dimana n adalah banyaknya atau jumlah angka bilangan hexadesimal yang akan dikonversikan, misal bilangan diatas 188  terdapat 3 buah angka 1,1,8.

Read More

Dasar - dasar Bahasa Pemrograman Java

1. Program Hello Word !

public class Helloworld {
    public static void main (String[] args) {
        System.out.printIn("Hello World");
    }
}

Pada kode diatas, kita telah membuat sebuah program sederhana yang menampilkan tulisan "Hello World" pada console. Terdapat beberapa aturan dalam membuat program java yaitu :

1. Nama file harus sama dengan nama kelas program, misal pada kode diatas nama kelasnya adalah Hellworld, maka nama files harus Helloworld.java.
2. Hanya boleh terdapat satu kelas public pada sebuah file.
3. Kelas yang menjadi program harus memiliki metode public static void main(String[]args)
4. Terminal pada java menggunakan tanda ; (titik koma)

2. Tipe Data

Terdapat beberapa tipe data primitive yang ada di java yaitu :

String bukanlah merupakan tipe data di java, String merupakan object, namun string memiliki keunikan yaitu string dapat langsung dibuat tanpa harus membuat object.

3. Variabel

Variabel merupaka sesuatu yang digunakan untuk menampung sebuah data. Sebuah variabel harus ada dalam sebuah kelas atau metode. Pembuatan sebuah variabel di java terlihat pda kode dibawah ini,

Tipevariabel namavariabel;

Tipe variabel dapat berupa tipe data atau kelas, misal :

int nilai;

char indexnilai;

untuk menambahkan nilai ke sebuah variabel, maka dapa menggunakan tanda == (sama dengan), misal jika kita akan menambahkan nilai 100 pada variabel nilai dan A pada variabel indexnilai, maka dapat terlihat pada kode dibawah ini,

int nilai;

char indexnilai;

nilai = 100;

indexnilai = 'A';

atau dapat juga langsung saat pembuatan sebuah variabel.

int nilai = 100;

char indexnilai = 'A';

Syarat penamaan variabel adalah :

1. Harus diawali dengan huruf
2. Tidak boleh terdapat karakter unik  seperti @,#,% dan lain-lain.
3. Tidak boleh mengandung karakter putih (spasi,enter,tab)

4. Operator
Operator merupakan sebua karakter khusus yang digunakan untuk menghasilkan suatu nilai,

5. Operator Aritmatika

Contoh

int a = 10;
int b = 3;
int c = a / b;
System.out.printIn(c);

Hasil dari kode program diatas adalah 3 bukan 3,333. Hal ini dikarenakan dalam java jika kita melakukan operasi pembagian dengan tipe data intenger, maka hasilnyapun akan intenger, dan intenger tidak dapat mengandung nilai koma dalam java, sehingga jika akan melakukan perkalian yang menghasilkan nilai koma, maka harus menggunakan tipe data double atau float.

6. Operator Penugasan

Contoh

int a = 10;
a += 5;
System.out.printIn(a);

Hasil dari operasi diatas adalah 15. Hal ini dikarenakan a += 5 sama dengan a = a + 5, dikarenakan a sebelumnya adalah 10, maka itu berarti a = 10 + 5.
Jika akan melakukan penambahan atau pengurangan dengan nilai 1, maka dapat dengan mudah menggunakan karakter ++ untuk penambahan atau -- untuk pengurangan, misal:

int  a = 10;
a --;
System.out.printIn(a);

maka hasilnya adalah 9.

7. Operator Pembanding

Hasil dari operasi pembanding adalah boolean. True jika operasi pembanding tersebut benar, dan false jika operasi pembanding tersebut salah, misal:

boolean a = 10 == 100;
System.out.printIn(a);

Hasil dari program diatas adalah false, karena memang 10 tidak sama dengan 100.

Read More

Cara Upload File PHP dan Database Mysql ke Idhostinger

Idhostinger merupakan salah satu solusi untuk menyimpan file web secara online atau lebih sering dikenalh dengan hosting.
File berbasis web yang sudah kita buat pastinya ingin bisa diakses dari berbagai lokasi, tidak terbatas untuk lokal saja misalnya dilaptop atau pc kita. Hosting ini juga bisa dijadikan alat bantu untuk menyimpan database web secara online. Untuk itu pada kesempatan kali ini saya akan mencoba memandu rekan semua untuk mengupload file berbasis web sehingga web tersebut bisa diakses secara online. Berikut ulasannya :

1. Langkah Pertama. Kunjungi official site Idhostinger.com, tentunya rekan harus login terlebih dahulu menggunakan Email dan Password yang sudah di buat di Idhostinger. Apabila belum punya silahkan register terlebih dahulu atau melalui Google+. Jika sudah silahkan login menggunakan email dan password yang sudah dibuat tersebut.

2. Langkah Kedua. Sesudah anda masuk kedalam Control Panel Hosting Idhostinger (Cpanel Hosting). Di dalam navigasi menu. Pilih Hosting kemudian pilih Order Hosting Baru.

3. Langkah Ketiga. Di halaman ini rekan akan dihadapkan dengan 3 jenis paket hosting ada yang Gratis, Premium maupun Bisnis. Seperti yang saya katakan di awal tadi karena tujuannya kita buat belajar dan ngirit pilih paket yang gratis saja. Lalu Klik Order.

4. Langkah keempat. Halaman ini merupakan halaman Setup Hosting diamana anda memilih alamat domain agar nantinya aplikasi anda bisa diakses secara online. Kemudian gunakan subdomain yang sudah tersedia atau bawaan dari Idhostinger. Buat juga password untuk aplikasi web kita. Kemudian kita Pilih Lanjutkan.

5. Langkah kelima. Di Halaman Ringkasan Order ini ketikkan kode Captcha atau kode verifikasi bukan robot, beserta checklist atau centang tulisan persetujuan kemudian klik Order.

6. Langkah Keenam. Di halaman Akun Hosting ini subdomain yang anda buat tadi sudah selesai dibuat. Klik pada nama subdomain yang kita buat tadi lalu klik tombol kelola. Semisal nama subdomainnya belum muncul coba anda refresh ulang halamannya.

7. Langkah Ketujuh. Anda akan dibawa di halaman Cpanel Hosting dari Subdomain yang dibuat tadi. Scroll ke bawah pada menu Database. Klik tombol Database MySQL untuk membuat nama database, nama user, dan password database. Isikan pada kolom yang tersedia lalu klik Buat. Hingga datanya tergenerate seperti gambar di bawah.

8. Langkah Kedelapan. Masuk Kembali ke halaman Cpanel Hosting dari Subdomain dibuat. Scroll ke bawah pada menu Database. Klik PhpMyAdmin untuk mengupload file database sql kita yang sebelumnya sudah kita buat di local. Jika belum ada database anda juga bisa membuatnya melalui menu tersebut. Tapi disini saya menggunakan cara meng import database yang sudah ada saja. Kemudian tunggu hingga tabel dari database yang kita import masuk ke dalam database servernya cpanel.

Jika proses import database sudah selesai anda bisa kembali lagi ke halaman utama cpanel subdomain anda.

9. Langkah Sembilan. Kembali lagi di halaman Cpanel Hosting dari Subdomain yang dibuat tadi. Jika anda bingung dimana letaknya mungkin gambar ini bisa membantu.

Setelah masuk ke halaman cpanel hosting, scroll ke bawah pada menu File. Kemudian pilih File Manajer 2.

10. Langkah Sepuluh. Kemudian anda klik folder public_html. Dan jika sudah berada di dalam folder public_html silahkan klik upload

11. Langkah Sebelas. Upload file aplikasi web nya dalam bentuk .zip kemudian klik icon centang warna hijau. Jika proses upload sudah selesai klik icon kembali warna biru.

12. Langkah Duabelas. Jika aplikasi menggunakan database sql, klik edit pada directory file koneksi.php anda, sesuaikanlah dengan nama server database, user dan password yang sudah kita buat di langkah B nomor 7 diatas. Kemudian anda klik icon save. Abaikan langkah ini jika aplikasi web anda tidak menggunakan database.

13. Terakhir jangan lupa untuk menghapus file default.php agar aplikasi web yang anda upload bisa dijalankan. Letaknya ada di dalam folder public_html. 

Sampai disini anda sudah sukses mengupload begitu pula mengkonfigurasi aplikasi web anda di hosting idhostinger. Akses Aplikasi yang anda menggunakan subdomain yang buat tadi melalui address bar web browser anda. 

Semoga dapat bermanfaat bagi rekan - rekan yang membutuhkan.

Selamat mencoba . . . .

Read More