Workshop Pembuatan Website menggunakan WordPress

3,369 views
3,286 views

Published on

Workshop Pembuatan Website menggunakan WordPress, presented at Ruang Serbaguna BSM Fakultas MIPA UI, on Friday, November 20th 2009

Published in: Technology, Business
1 Comment
2 Likes
Statistics
Notes
No Downloads
Views
Total views
3,369
On SlideShare
0
From Embeds
0
Number of Embeds
8
Actions
Shares
0
Downloads
248
Comments
1
Likes
2
Embeds 0
No embeds

No notes for slide

Workshop Pembuatan Website menggunakan WordPress

  1. 1. Workshop Pembuatan Website Menggunakan WordPress. Science Carnival FMIPA UI, 20 November 2009 Workshop Pembuatan Website menggunakan WordPress Science Carnival, FMIPA UI Jum’at, 20 November 2009
  2. 2. Workshop Pembuatan Website Menggunakan . Science Carnival FMIPA UI, 20 November 2009 supported by Muhammad Ilman AkbarMuhammad Ilman Akbar a blogger, entrepreneur, weba blogger, entrepreneur, web loverlover, co-founder of, co-founder of Univind, founder & lead admin of anakUI.com, andUnivind, founder & lead admin of anakUI.com, and more importantly,more importantly, WordPress enthusiastWordPress enthusiast! ;)! ;) ilmanakbar@gmail.com 0817 829788 facebook.com/ilmanakbar pyrokinesis88 twitter.com/ilmanakbar ilmanakbar.dagdigdug.com slideshare.net/ilmanakbar presented by:
  3. 3. Workshop Pembuatan Website Menggunakan . Science Carnival FMIPA UI, 20 November 2009 supported by Outline • Isi CD • Website Dinamis • Persiapan • Install XAMPP • Install WordPress • Mengatur WordPress • Topik Lanjutan
  4. 4. Workshop Pembuatan Website Menggunakan . Science Carnival FMIPA UI, 20 November 2009 supported by Isi CD • WordPress 2.8.6: wordpress-2.8.6.zip • Installer XAMPP: xampp-win32-1.6.7- installer.exe • WordPress Plugin dan WordPress Themes • Tutorial pembuatan WordPress Themes • Tutorial pembuatan website dengan hosting dan domain gratisan • Materi presentasi ini
  5. 5. Workshop Pembuatan Website Menggunakan . Science Carnival FMIPA UI, 20 November 2009 supported by Website Dinamis (1) • Website yang interaktif, bisa di-update isinya denga mudah, bisa komentar, dsb. • Terdiri dari file dan database
  6. 6. Workshop Pembuatan Website Menggunakan . Science Carnival FMIPA UI, 20 November 2009 supported by Website Dinamis (2) • File-file – File-file PHP yang membuat website terlihat oleh mata kita dan berfungsi sesuai fungsinya – File-file gambar, musik, dsb • Database – Tempat penyimpanan data-data yang dimasukkan oleh pengguna: tulisan, komentar, link menuju file gambar, dsb
  7. 7. Workshop Pembuatan Website Menggunakan . Science Carnival FMIPA UI, 20 November 2009 supported by Persiapan • Server hosting dan domain – Server hosting: tempat nyimpen file2 – Domain: alamat www.namadomain.com /.net /.org /dsb.. • Sewa dimana? Banyaak! Googling: web hosting dan domain Indonesia • Pilih ini aja: [N]eoHoster www.neohoster.com
  8. 8. Workshop Pembuatan Website Menggunakan . Science Carnival FMIPA UI, 20 November 2009 supported by Karena kita ga konek Internet • Program “simulasi” server hosting, namanya XAMPP • Di komputer sendiri • Butuh program untuk ngebuka dan ngezip (mis. WinZip, WinRar, IZArc, 7Zip, dsb)
  9. 9. Workshop Pembuatan Website Menggunakan . Science Carnival FMIPA UI, 20 November 2009 supported by Install XAMPP (1) • Jalankan Installer XAMPP: xampp-win32-1.6.7- installer.exe
  10. 10. Workshop Pembuatan Website Menggunakan . Science Carnival FMIPA UI, 20 November 2009 supported by Install XAMPP (2) • Install di My Documents, terus Next, dan Install
  11. 11. Workshop Pembuatan Website Menggunakan . Science Carnival FMIPA UI, 20 November 2009 supported by Install XAMPP (3)
  12. 12. Workshop Pembuatan Website Menggunakan . Science Carnival FMIPA UI, 20 November 2009 supported by Install XAMPP (4)
  13. 13. Workshop Pembuatan Website Menggunakan . Science Carnival FMIPA UI, 20 November 2009 supported by Jalankan XAMPP, klik Start pada Apache dan MySQL
  14. 14. Workshop Pembuatan Website Menggunakan . Science Carnival FMIPA UI, 20 November 2009 supported by Tes buka http://localhost
  15. 15. Workshop Pembuatan Website Menggunakan . Science Carnival FMIPA UI, 20 November 2009 supported by XAMPP • My Documentsxampphtdocs – Tempat menaruh file-file kita – Diibaratkan dengan File Manager di cPanel server hosting beneran
  16. 16. Workshop Pembuatan Website Menggunakan . Science Carnival FMIPA UI, 20 November 2009 supported by XAMPP • http://localhost/phpmyadmin > tempat database
  17. 17. Workshop Pembuatan Website Menggunakan WordPress. Science Carnival FMIPA UI, 20 November 2009 Install WordPress Mempersiapkan file-file
  18. 18. Workshop Pembuatan Website Menggunakan . Science Carnival FMIPA UI, 20 November 2009 supported by Buat folder My Documents XAMPPhtdocswebsiteku
  19. 19. Workshop Pembuatan Website Menggunakan . Science Carnival FMIPA UI, 20 November 2009 supported by Extract WordPress di sana
  20. 20. Workshop Pembuatan Website Menggunakan . Science Carnival FMIPA UI, 20 November 2009 supported by Pindahkan dari dalam folder websiteku/wordpress ke luar
  21. 21. Workshop Pembuatan Website Menggunakan . Science Carnival FMIPA UI, 20 November 2009 supported by Summary: Install WordPress Mempersiapkan file-file • Download dari website (buka dari CD) • Buat folder My DocumentsXAMPPhtdocswebsiteku • Extract di sana
  22. 22. Workshop Pembuatan Website Menggunakan WordPress. Science Carnival FMIPA UI, 20 November 2009 Install WordPress Mempersiapkan database
  23. 23. Workshop Pembuatan Website Menggunakan . Science Carnival FMIPA UI, 20 November 2009 supported by Buka http://localhost/phpmyadmin
  24. 24. Workshop Pembuatan Website Menggunakan . Science Carnival FMIPA UI, 20 November 2009 supported by Buat database, masukkan websiteku
  25. 25. Workshop Pembuatan Website Menggunakan . Science Carnival FMIPA UI, 20 November 2009 supported by Buat database selesai Catat informasi ini: Nama database: websiteku Nama user: root Password: (tidak ada password) Note: di server hosting sebenarnya, ada password
  26. 26. Workshop Pembuatan Website Menggunakan . Science Carnival FMIPA UI, 20 November 2009 supported by Summary: Install WordPress Mempersiapkan database • Jalankan XAMPP • Buka http://localhost/phpmyadmin • Buat database bernama ‘websiteku’ (tanpa kutip, boleh juga dengan nama lain) • Catat nama database, nama username dan password (root dan ‘’)
  27. 27. Workshop Pembuatan Website Menggunakan WordPress. Science Carnival FMIPA UI, 20 November 2009 Install WordPress Menginstall WordPress
  28. 28. Workshop Pembuatan Website Menggunakan . Science Carnival FMIPA UI, 20 November 2009 supported by Buka http://localhost/websiteku • Klik “Create a Configuration File”
  29. 29. Workshop Pembuatan Website Menggunakan . Science Carnival FMIPA UI, 20 November 2009 supported by Siapkan informasi database yang tadi sudah disiapkan
  30. 30. Workshop Pembuatan Website Menggunakan . Science Carnival FMIPA UI, 20 November 2009 supported by Masukkan informasi-informasi itu
  31. 31. Workshop Pembuatan Website Menggunakan . Science Carnival FMIPA UI, 20 November 2009 supported by Lanjut..
  32. 32. Workshop Pembuatan Website Menggunakan . Science Carnival FMIPA UI, 20 November 2009 supported by Hampir Selesai..
  33. 33. Workshop Pembuatan Website Menggunakan . Science Carnival FMIPA UI, 20 November 2009 supported by Selesai! • Catat username dan password sementara itu di notepad
  34. 34. Workshop Pembuatan Website Menggunakan . Science Carnival FMIPA UI, 20 November 2009 supported by http://localhost/websiteku
  35. 35. Workshop Pembuatan Website Menggunakan . Science Carnival FMIPA UI, 20 November 2009 supported by Summary: Install WordPress • Buka http://localhost/websiteku • Install > masukin informasi database, judul blog dsb • Selesai > catat password • Bikin website selesai
  36. 36. Workshop Pembuatan Website Menggunakan WordPress. Science Carnival FMIPA UI, 20 November 2009 Mengatur WordPress Membuat tulisan baru
  37. 37. Workshop Pembuatan Website Menggunakan . Science Carnival FMIPA UI, 20 November 2009 supported by Buka http://localhost/websiteku, masukkan username + password
  38. 38. Workshop Pembuatan Website Menggunakan . Science Carnival FMIPA UI, 20 November 2009 supported by Halaman Admin WordPress (disebut dashboard)
  39. 39. Workshop Pembuatan Website Menggunakan . Science Carnival FMIPA UI, 20 November 2009 supported by
  40. 40. Workshop Pembuatan Website Menggunakan . Science Carnival FMIPA UI, 20 November 2009 supported by Dashboard WordPress
  41. 41. Workshop Pembuatan Website Menggunakan . Science Carnival FMIPA UI, 20 November 2009 supported by Membuat tulisan
  42. 42. Workshop Pembuatan Website Menggunakan . Science Carnival FMIPA UI, 20 November 2009 supported by Tampil di website kita deh!
  43. 43. Workshop Pembuatan Website Menggunakan WordPress. Science Carnival FMIPA UI, 20 November 2009 Mengatur WordPress Mengganti template/themes
  44. 44. Workshop Pembuatan Website Menggunakan . Science Carnival FMIPA UI, 20 November 2009 supported by Tempat themes WordPress: http://wordpress.org/extend/themes
  45. 45. Workshop Pembuatan Website Menggunakan . Science Carnival FMIPA UI, 20 November 2009 supported by Tempat nyari themes WordPress: Google
  46. 46. Workshop Pembuatan Website Menggunakan . Science Carnival FMIPA UI, 20 November 2009 supported by Download themes
  47. 47. Workshop Pembuatan Website Menggunakan . Science Carnival FMIPA UI, 20 November 2009 supported by Download themes
  48. 48. Workshop Pembuatan Website Menggunakan . Science Carnival FMIPA UI, 20 November 2009 supported by Masukin themesnya ke website kita
  49. 49. Workshop Pembuatan Website Menggunakan . Science Carnival FMIPA UI, 20 November 2009 supported by Upload themesnya (tersedia di CD, folder WordPress Theme)
  50. 50. Workshop Pembuatan Website Menggunakan . Science Carnival FMIPA UI, 20 November 2009 supported by
  51. 51. Workshop Pembuatan Website Menggunakan . Science Carnival FMIPA UI, 20 November 2009 supported by Cek websitenya untuk perubahan template
  52. 52. Workshop Pembuatan Website Menggunakan . Science Carnival FMIPA UI, 20 November 2009 supported by Bisa edit template? • Bisa banget! • Perlu sedikit kemampuan HTML, CSS, dan bahasa pemrograman PHP
  53. 53. Workshop Pembuatan Website Menggunakan . Science Carnival FMIPA UI, 20 November 2009 supported by Edit Themes
  54. 54. Workshop Pembuatan Website Menggunakan WordPress. Science Carnival FMIPA UI, 20 November 2009 Topik Lanjutan Plugin
  55. 55. Workshop Pembuatan Website Menggunakan . Science Carnival FMIPA UI, 20 November 2009 supported by Plugin • ‘Tambahan’ untuk WordPress, membuat fitur- fitur website bisa lebih banyak daripada fitur dari instalasi WordPress standar • Contoh: – bikin kalender kegiatan – bikin galeri foto – bikin form kontak
  56. 56. Workshop Pembuatan Website Menggunakan . Science Carnival FMIPA UI, 20 November 2009 supported by Tempat themes WordPress: http://wordpress.org/extend/plugins
  57. 57. Workshop Pembuatan Website Menggunakan . Science Carnival FMIPA UI, 20 November 2009 supported by Install Plugin
  58. 58. Workshop Pembuatan Website Menggunakan WordPress. Science Carnival FMIPA UI, 20 November 2009 Topik Lanjutan Membuat/edit themes sendiri
  59. 59. Workshop Pembuatan Website Menggunakan . Science Carnival FMIPA UI, 20 November 2009 supported by Contoh edit themes yang sudah ada
  60. 60. Workshop Pembuatan Website Menggunakan . Science Carnival FMIPA UI, 20 November 2009 supported by Contoh themes bikin dari 0: tentangcad.com
  61. 61. Workshop Pembuatan Website Menggunakan . Science Carnival FMIPA UI, 20 November 2009 supported by Buat dari 0 Yang dibutuhkan • Sedikit kemampuan disain grafis • Sedikit HTML, CSS, dan PHP Langkah-langkah • Buat disain HTML-nya • Ubah jadi Themes WordPress – Lihat folder Create Wordpress Template
  62. 62. Workshop Pembuatan Website Menggunakan . Science Carnival FMIPA UI, 20 November 2009 supported by Selesai
  63. 63. Workshop Pembuatan Website Menggunakan . Science Carnival FMIPA UI, 20 November 2009 supported by bersama Matt Mullenweg, founder WordPress.com, 16 Januari 2009 di Jakarta ~ semoga kesuksesannya menginspirasi saya dan seluruh masyarakat Indonesia ~ “..don’t be scared to share your idea, tell a lot of people, so you could get feedback about it..” terima kasih..

×