PENGANTAR INTERNET

TUTORIAL MEMBUAT WEBSITE di LOCALHOST

dengan XAMPP dan Wordpress

Nama : David Fernanda Pribadi

Nim : 1310330025

Jurusan : D3 TI

Semester : I

Pendahuluan

WEB SITE atau sering disingkat dengan istilah situs adalah sejumlah halaman web yang memiliki

topik saling terkait, terkadang disertai pula dengan berkas-berkas gambar, video, atau jenis-jenis

berkas lainnya. Sebuah situs web biasanya ditempatkan setidaknya pada sebuah server web yang dapat

diakses melalui jaringan seperti internet, ataupun jaringan wilayah lokal (LAN) melalui alamat

internet yang dikenali sebagai URL.

Gabungan atas semua situs yang dapat diakses publik di internet disebut pula sebagai Waring

Wera Wanua atau lebih dikenal dengan singkatan WWW. Meskipun setidaknya halaman beranda

situs internet umumnya dapat diakses publik secara bebas, pada prakteknya tidak semua situs

memberikan kebebasan bagi publik untuk mengaksesnya, beberapa situs web mewajibkan pengunjung

untuk melakukan pendaftaran sebagai anggota, atau bahkan meminta pembayaran untuk dapat

menjadi aggota untuk dapat mengakses isi yang terdapat dalam situs web tersebut, misalnya situs-

situs yang menampilkan pornografi, situs-situs berita, layanan surel (e-mail), dan lain-lain.

Pembatasan-pembatasan ini umumnya dilakukan karena alasan keamanan, menghormati privasi, atau

karena tujuan komersil tertentu.

XAMPP adalah perangkat lunak bebas, yang mendukung banyak sistem operasi,

merupakan kompilasi dari beberapa program.

Fungsinya adalah sebagai server yang berdiri sendiri (localhost), yang terdiri atas program

Apache HTTP Server, MySQL database, dan penerjemah bahasa yang ditulis dengan bahasa

pemrograman PHP dan Perl. Nama XAMPP merupakan singkatan dari X (empat sistem

operasi apapun), Apache, MySQL, PHP dan Perl. Program ini tersedia dalam GNU General

Public License dan bebas, merupakan web server yang mudah digunakan yang dapat

melayani tampilan halaman web yang dinamis. Untuk mendapatkanya dapat mendownload

langsung dari web resminya.

WordPress adalah sebuah aplikasi sumber terbuka (open source) yang sangat populer

digunakan sebagai mesin blog (blog engine). WordPress dibangun dengan bahasa

pemrograman PHP dan basis data (database) MySQL. PHP dan MySQL, keduanya

merupakan perangkat lunak sumber terbuka (open source software). Selain sebagai blog,

WordPress juga mulai digunakan sebagai sebuah CMS (Content Management System) karena

kemampuannya untuk dimodifikasi dan disesuaikan dengan kebutuhan penggunanya.

WordPress adalah penerus resmi dari b2/cafelog yang dikembangkan oleh Michel Valdrighi.

Nama WordPress diusulkan oleh Christine Selleck, teman Matt Mullenweg. WordPress saat

ini menjadi platform content management system (CMS) bagi beberapa situs web ternama

seperti CNN, Reuters, The New York Times, TechCrunch, dan lainnya.

http://id.wikipedia.org/wiki/Halaman_webhttp://id.wikipedia.org/wiki/Videohttp://id.wikipedia.org/wiki/Server_webhttp://id.wikipedia.org/wiki/Internethttp://id.wikipedia.org/wiki/Jaringan_wilayah_lokalhttp://id.wikipedia.org/wiki/URLhttp://id.wikipedia.org/wiki/World_Wide_Webhttp://id.wikipedia.org/wiki/World_Wide_Webhttp://id.wikipedia.org/wiki/WWWhttp://id.wikipedia.org/wiki/Pornografihttp://id.wikipedia.org/wiki/Surat_elektronikhttp://id.wikipedia.org/wiki/Perangkat_lunak_bebashttp://id.wikipedia.org/wiki/Sistem_operasihttp://id.wikipedia.org/wiki/Programhttp://id.wikipedia.org/wiki/Serverhttp://id.wikipedia.org/w/index.php?title=Localhost&action=edit&redlink=1http://id.wikipedia.org/wiki/Apache_HTTP_Serverhttp://id.wikipedia.org/wiki/MySQLhttp://id.wikipedia.org/wiki/Databasehttp://id.wikipedia.org/wiki/Penerjemahhttp://id.wikipedia.org/wiki/Bahasahttp://id.wikipedia.org/wiki/Bahasahttp://id.wikipedia.org/wiki/Pemrogramanhttp://id.wikipedia.org/wiki/PHPhttp://id.wikipedia.org/wiki/Perlhttp://id.wikipedia.org/wiki/Apachehttp://id.wikipedia.org/wiki/MySQLhttp://id.wikipedia.org/wiki/PHPhttp://id.wikipedia.org/wiki/Perlhttp://id.wikipedia.org/wiki/Programhttp://id.wikipedia.org/wiki/GNU_General_Public_Licensehttp://id.wikipedia.org/wiki/GNU_General_Public_Licensehttp://id.wikipedia.org/wiki/Bebashttp://id.wikipedia.org/wiki/Web_serverhttp://id.wikipedia.org/wiki/Webhttp://id.wikipedia.org/wiki/Downloadhttp://id.wikipedia.org/wiki/Aplikasihttp://id.wikipedia.org/wiki/Bahasa_pemrogramanhttp://id.wikipedia.org/wiki/Bahasa_pemrogramanhttp://id.wikipedia.org/wiki/PHPhttp://id.wikipedia.org/wiki/Basis_datahttp://id.wikipedia.org/wiki/MySQLhttp://id.wikipedia.org/wiki/Perangkat_lunak_sumber_terbukahttp://id.wikipedia.org/wiki/Bloghttp://id.wikipedia.org/wiki/CMShttp://id.wikipedia.org/w/index.php?title=Michel_Valdrighi&action=edit&redlink=1http://id.wikipedia.org/w/index.php?title=Christine_Selleck&action=edit&redlink=1http://id.wikipedia.org/wiki/Matt_Mullenweghttp://id.wikipedia.org/wiki/CNNhttp://id.wikipedia.org/wiki/Reutershttp://id.wikipedia.org/wiki/The_New_York_Timeshttp://id.wikipedia.org/wiki/TechCrunch

1. Untuk membuat web tetapi yang masi bersifat local/pribadi anda perlu memiliki aplikasi xampp

untuk termpat server web tersebut. Aplikasi xampp tersebut dapat di download di

http://www.apachefriends.org/en/xampp.html

2. Kemudian instal aplikasi xampp tersebut di local C

3. Jika telah terinstal maka terdapat comed prome seperti berikut : (anda tinggal ketik “y” dan enter)

4. Jika xampp sukses terinstal di pc anda, maka terdapat icon xampp di desktop anda

5. Selanjutnya nyalakan xampp tersebut. Maka muncul tampilan xampp seperti berikut, kemudian klik

start pada “Apache” & “MySql”

6. Jika berhasil dijalankan maka secara otomati terdapat kata “running” seperti berikut :

7. Kemudian download “rar wordpress” di www.wordpress.com, lalu copy rar wordpress tersebut ke

C/xampp/htdoc

8. Kemudian klik kanan rar wordpress – extract here, hingga muncul folder, kemudian Rename

menjadi “myweb”

9. Kemudian buka web browser apa saja lalu ketikan localhost/myweb, maka akan seperti berikut,

kemudian pilih Create a Configuration File

http://www.wordpress.com/

10. Setelah pilih Create a Configuration File maka muncul gambar berikut ini, kemudian pilih Let’s go!

11. Setelah pilih Let’s go!. Maka anda akan diminta mengisi data seperti berikut ini, tapi jangan di isi

terlebih dahulu !

12. Untuk membuat database buka tab web browser baru dan ketikan localhost/phpmyadmin maka

akan tampil seperti berikut. Pilih Database – pada kolom Create new database “isi” – Create

13. Jika berhasil maka muncul commend seperti berikut

14. Lalu kembali ke tab wordpress dan isi data seperti berikut “untuk password biarkan kosong”

kemudian pilih Submit

15. Setelah pilih Submit lalu muncul gambar seperti berikut, dan pilih Run the Install

16. Kemudian anda akan disuruh untuk mengisi data kembali seperti gambar berikut ini, dan jika sudah

diisi pilih Install WordPress

17. Setelah anda memilih Install WordPress maka akan muncul gambar seperti berikut, kemudian pilih

Log In

18. Setelah itu akan muncul seperti berikut, isi username & password sesuai dengan saat anda mengisi

data kedua, lalu pilih Log In

19. Jika sukses anda akan masuk ke halaman Dashboard Website yang anda buat, seperti berikut, dan

untuk melihat tampilan website anda, klik yang saya lingkari / atau petunjuk arah panah. Disini saya

membuat Website Game Online

20. Berikut adalah tampilan website yang sudah kita buat, memang masi kosong karena untuk mengatur

isi,tema, gambar, dll bisa kita atur di halaman dashboard

21. Untuk membuat post / berita utama, Pada halaman dashboard pilih Post – Add New

22. Setelah kita pilih Add New maka akan terdapat lembar kerja seperti berikut, isikan judul terserah,

berita sesuai keinginan, dan untuk memasukan gambar / file ke lembar kerja, pilih Add Media

23. Setelah pilih Add Media anda akan dibawa ke window untuk mengupload gambar, video, music, file.

Pilih Upload Files – Select Files – Cari file yang diinginkan - Open

24. Jika telah menguload file Pilih Media Library – Pilih File – Insert into post

25. Dan berikut adalah tampilan lembar kerja saya yang sudah saya isi dengan berita, dan untuk

menayangkannya di web, pilih Publish

26. Setelah kita pilih Publish maka akan muncul pemberitahuan seperti berikut. Untuk melihat hasilnya,

pilih yang saya lingkari/ditunjuk arah panah “Website Game Online”

27. Dan berikut hasil postingan berita saya

28. Sekarang kita akan membuat menu dan sub menu untuk web kita. Pilih Posts – Categories

29. Maka terbuka window baru, kemudian isikan sesuai keinginan, berhubung ini menu untuk Parent

pilih None lalu pilih Add New Category

30. Kemudian untuk membuat sub menu ulangi langkah no 28, kemudian isi tabel dan berhubung ini

sub menu untuk Parent pilih sesuai dengan menu yang kita buat tadi (yang penting untuk menu

dan sub menu harus berkaitan / sesuai) lalu pilih Add New Category

31. Selanjutnya kita akan membuat isi menu atau sub menu “jadi saat menu atau sub menu di web

dipilih maka secara otomatis yang dipilih tersebut akan muncul” pada halaman dashboard pilih Posts

– Add New kemudian pada lembar kerja, isi judul – pada All Catagories centang menu/sub menu

yang ingin ditampilkan - Publish

32. Untuk mengatur tata letak menu atau sub menu bisa ikuti cara berikut ini, Pada halaman dashboard

pilih Appearance - Menus

33. Maka Akan muncul tampilan berikut ini, pilih Edit Menus- Categories – View All – Centang daftar

menu yang ingin ditampilkan – Add to Menu

34. Setelah dipilih Add Menu maka akan tampil seperti gambar berikut kemudian atur deretan menu -

Isi Menu Name – Save Menu

35. Dan masi banyak lagi yang bisa kalian edit untuk website kali masing-masing. Untuk Menambah jam,

kalender, hit-counter pada Halaman Dashboard – Appearance – Widgets – Kolom Text, seperti

gambar berikut beri judul – masukkan java script - save

36. NB : Untuk mendapatkan jam, kalender, hit counter, dll bisa kunjungi website berikut :

a. Jam : http://www.clocklink.com/

b. Kalender : http://www.free-blog-content.com

c. Hit-Counter : http://www.easycounter.com/

d. Tema : http://www.bietemplates.com

37. Untuk melihat hasil website yang telah kita buat. Silakan masuk ke web masing-masing ^ ^

Berikut ini adalah tampilan menu & sub menu

http://www.easycounter.com/http://www.bietemplates.com/

38. Berikut adalah tampilan web saya secara keseluruhan

Berikut adalah tampilan saat menu identitas dipilih