Total_Guide_Wordpress by aida-adi

VIEWS: 0 PAGES: 25

									      Total Guide : Build a Wordpress Sites!!!

A. Pendahuluan
          Wordpress merupakan sebuah Tools Opensource yang ditulis dalam
   kode pemprograman PHP dan membutuhkan Database MySQL. Sebenarnya
   Wordpress merupakan Bloging tools tetapi dia memiliki keleluasaan sehingga
   yang tadinya hanya bias digunakan untuk Blog dapat dikembangkan menjadi
   sebuah CMS yang serba guna. Sebagai contoh adalah website saya sendiri
   www.rizkhey.net merupakan website yang dibangun menggunakan aplikasi
   Wordpress. Seperti yang Anda lihat, website saya gabungan antara Blog dan
   juga unsur website yang lain (seperti page-page : galery, About me, dll).
          Sebenarnya saya telah menulis langkah-langkah pembuatannya dulu,
   tetapi banyak hal yan kurang mendetail sehingga bagi pemula mungkin
   merupakan sesuatu yang membingungkan. Maka                      dengan pembaruan ini,
   diharap   bisa     menjelaskan       lebih   jauh    dan   Anda    bisa   menghilangkan
   kebingungan.


B. Langkah-langkah
          Langkah-langkah          yang    dilakukan     untuk     membuat     sebuah     site
   Worpress yang utuh adalah pertama-tama kita                   harus memiliki web server
   agar situs yang kita miliki dapat dilihat orang. Tidak usah takut, kita akan
   menggunakan web hosting gratis yang mensuport segala kebutuhan untuk
   installasi Wordpress yaitu hosting yang mendukung PHP dan juga MySQL.
   Untuk turoturial ini saya menggunakan webhosting www.orgfree.com.
          Setelah itu tools yang Anda butuhkan adalah sebuah FTP tool. Sangat
   banyak    sekali       tools   FTP   yang    freeware,     diantarana     adalah    FileZila
   http://www.sourceforge.net/projects/filezilla.
          Ketiga adalah             source Wordpress yang bisa di download di:
   http://wordpress.org/download/


C. Mendaftarkan Diri di WebHosting Gratis
          Ada       dua     yang    bisa    saya       gunakan     dengan    gratis,    yaitu:
   www.orgfree.com dan www.byethost.com keduanya menawarkan free space
   dan semua yang dibutuhkan untuk membuat situs dengan Wordpress.
        Bukalah halaman utama www.orgfree.com yang akan muncul seerti
gambar di bawah ini:




        Scroll ke bawah layar sampai menemukan form quick registrasion:




        Isikan alamat yang Anda inginkan. Sebagai catatan saja, nama yang
anda masukan di form tersebut akan menjadi alamat website Anda nantinya.
Bila berhasil, Anda akan dibawa ke halaman penuh Form yang harus Anda isi
untuk melakukan registrasi. Ikuti saja apa yang mereka inginkan. Setelah
selesai, Anda akan mendapatkan email konfirmasi dan seluruh data account
Anda.
        Sampai disini semuanya sudah beres. Selanjutnya And abisa lanjut ke
lengkah berikutnya.
       Untuk Anda yang ingin menggunakan www.byethost.com Anda bisa
mencobanya sendiri. Registrasinya terhitung jauh lebih mudah dibandingkan
di   www.orgfree.com.   Sebagai   catatan   pilihlah   plan   yang   mendukung
MySQL(bukan yang Storage ataupun Trafic).




       Tetapi setelah selesai setup webhosting, Anda harus login ke dalam
Control panel (CP) untuk membuat account FTP sendiri. Caranya:
       Pilih menu seperti pada gambar berikut ini:
         Isilah field “Username”,” password” dan “password repeat” yang lain
  biarkan saja apa adanya. Bila berhasil akan muncul keluaran seperti berikut
  ini:




         Okey, untuk setup registrasi serer selesai


D. Download Wordpress Source
         Wordpress source bisa di download di http://wordpress.org/download/
  untuk mendownloadnya tidak dikenakan biaya. File yang di download sekitar
  500 KB lebih.
         Setelah selesai, Unzip file tersebut. Setelah selesai di unzip, maka
  akan muncul sebuah folder bernama “Wordpress” di dalam folder tersebut
  berisi banyak sekali file-file ber-ekstensi PHP yang nantinya kita upload.
         Tak usah kawatir, kita tidak akan membukanya kemudian menelisiri
  satu demi satu line codingnya. Seperti yang sudah saya ucapkan, semuanya
  bisa selesai tanpa coding!
E. Setting Control Panel Server
          Okey, next step!
          Setelah kita punya webhosting, dan juga sudah ada source code dari
   Wordpress,kita harus melakukan setting untuk Databasenya. Caranya sebagai
   berikut (untuk yang hosting di Byethost):




          Masukan nama database yang diinginkan(cek option “Use numerical
   ID), kemudian klik “Add” bila berhasil akan mucul tampilan seperti di bawah
   ini:




          Langkah selajutnya adalah menambahkan user untuk database yang
   ada, dengan cara klik “Add SQL user”
         Ingat kasih tanda cek pada option ”use Numerical ID” untuk
  mengurangi kemungkinan kegagalan.
         Untuk User yang menggunakan hosting www.orgfree.com Anda tidak
  butuh melakukan hal-hal tersebut karena sudah dibuatkan oleh pihak admin.




         Tetapi jikalau Anda ingin menginstall banyak aplikasi, orgfree memiliki
  kekurangan karena hanya bisa memberi database sebanyak satu saja, tetapi
  untuk yang di Byethost dapat memiliki sampai 10 Database(atau minimal 2
  SQL database).
         Sampai saat ini, persiapan webhosting telah selesai! Next step!!!!


F. Upload using FTP program
         Semua source code dari Wordpress (yang tadi sudah kita download)
  harus di Upload ke server kita.
         “How to Upload Them???
         It’s Easy!!!”

         Gunakan FTP tools seperti      FileZila yang bisa di     download di:
  http://www.sourceforge.net/projects/filezilla . FTP tools ini freeware dan
  sangat mudah digunakan.
      Untuk menguploadnya, pertama-tama kita harus melakukan beberapa
hal sebagai berikut (supaya bisa kita lakukan lagi tanpa harus mengingat-
ingat accont kita) hal ini dilakukan apabila menggunakan komputer pribadi.
      1.     Pilih “File >> Site Manager” sampai kotak dialog Site manager
             keluar




      2.     Kemudian pilih “New Site” kemudian isilah nama situsnya
             kemudian isilah seperti contoh di bawah ini(untuk Host,
             disesuaikan    dengan   server,    lihat   di   email   konfirmasi
             pendaftaran web hosting yang Anda terima), username dan
             password      juga   disesuaikan       dengan    langkah-langkah
             sebelumnya (untuk Byethost, untuk yang di orgfree, lihat di
             email konfirmasi).




      3.     klik “save and exit” kemudian pilih conect ke server yang Anda
             mau dengan mengeklik icon di kiri atas. Kemudian program FTP
             akan melakukan koneksi. Apabila koneksi berhasil, maka akan
             muncul tampilan seperti berikut ini!
     Untuk pengguna Byethost:




     Untuk pengguna OrgFree:




4.   Untuk pengguna Byethost masuklah ke folder htdocs dan
     hapuslah semua isinya, untuk orgfree, hapus semua files yang
     ada di main directory (diatas ada 3 files dan satu folder)
5.   Pilih folder Wordpress Anda, kemudian bukalah folder tersebut.
     Kemudian pilih semua file di dalam diretory tersebut. Kemudian
     klik kanan dan pilih “upload” Tunggulah sampai proses Upload
     selesai
                   catatan:
                   Sebaiknya     Anda    mengupload      sedikit   demi     sedikit   untuk
                   menghindari error.
          6.       Setelah selesai, berati Upload file telah selesai!!!


          Jangan tutup dulu FT tools Anda karena kita masih sedikit bermain
   dengannya.


G. Setting Setup
          Sebelum kita mulai setup, kita lihat kembali FTP Anda. Di sebelah
   kanan setiap file yang berada di server ada seperti huruf-huruf aneh seperti
   ini:




          Itu    adalah    permission    atau   dengan    kata     lain   status   tersebut
   menentukan apakah directory atau file tersebut bisa “dibaca(R)”, “Ditulis(W)”
   dan “Execute(X)”. Apabila satu file saja permissionnya tidak benar, maka
   Wordpress tiak akan bisa berjalan. Maka lakukan beberapa hal berikut ini:
          1. Klik kanan pada directory atau file-file berikut ini(tahan Control lalu
                click file/foldernya):
                        Main folder(ex: public_html bila ada)
                        wp-admin
                        wp-content
                        wp-includes
                        wp-config.php
          2. Kemudian klik kanan dan pilih “File Attributes” maka akan muncul
                kotak daialog seperti ini:
       3. Ubah permission tiap file/folder diatas(point satu) menjadi:
                    main folder : Owner/Group/Public beri tanda cek semua
                    wp-admin : Owner cek semua, Group dan Public read dan
                    execute saja
                    wp-content : cek semua
                    wp-includes : sama seperti wp-admin
                    wp-config.php : cek semua
       4. bila semua sudah selesai, Anda bole menutup FTP Anda karena kita
           mulai bekerja di browser.


Langkah pertama, Buka browser Anda. Bukalah alamat situs Anda. Maka akan
muncul layar seperti ini jika berhasil:




Piliha dan klik   create a wp-config.php file through a web interface setelah di
klk akan muncul tampilan berikutnya:
       Klik “Let’s go” dan selanjutnya Anda diminta mengisi informasi Database
       MySQL yang akan digunakan:




       Isilah dengan informasi sesuai dengan langkah “E” bila benar akan muncul
       pesan:


“All right sparky! You've made it through this part of the installation. WordPress can now
communicate with your database. If you are ready, time now to run the install!”

       Anda tinggal mengeklik link “Run The install” dan anda akan dibawa ke
       langkah berikutnya. Dan munculah halaman set-up dari Wordpress:
Klik “First Step” dan kemudian akan muncul halamana berikutnya sbb:




Isilah kedua field diatas (Bisa diganti nantinya) kemudian klik “Continue to
Second Step” Hati-hatilah di second step, karena bila Anda sampai salah
melangkah, Anda harus mengulangi setup dari awal!
Selamat!!! Anda telah memiliki Blog sendiri!!!
Sekarang yang harus Anda lakukan adalah mengcopy password (Jangan
gunakan ctrl+C kalau Anda tidak yakin pada keyoard Anda) lalu bukalah link
di bawahnya di window Baru!
Login dengan account Anda! Username Anda : “admin” dan password Anda
seperti yang tertera dalam halaman sebelumnya!
  Yup kini Anda telah masuk di Admin Control Panel!! Disini Anda mengelola
  seluruh isi Blog Anda dengan mudah!
  Okey, semenjak kita mendapat password yang aneh dan sulit diingat, Anda
  bisa merubahnya menjadi password yang mudah Anda ingat.
  Caranya, pergilah ke User Admin Control Panel, dengan mengeklik pilihan
  user di menu bagian atas. Lihatlah gambar berikut:




  Di bagian kanan bawah tuliskan Password Anda yang baru sebanyak dua kali,
  kemudian klik “Update Profile”
  Ok Sekarang Sudah beres. Sekarang kita melangkah ke Langkah berikutnya!


H. Managing Wordpress
  Okey sekarang saya akan mencoba menjelaskan beberapa hal yang penting.
  Beberapa yang penting diantaranya yaitu:
     1. Post & membuat Page
     2. managing (edit&Delete post/Page, Add/remove categories, Edit/Delete
         Comment, Awaiting Moderation)
     3. Link (Add/remove Link & Add/edit/remove Link categories)
   4. Presentation (themes)


Kita mulai saja mulai dari yang paling dasar:

Posting
Posting berarti membuat tambahan isi pada Blog kita. Ada dua jenis post.
Pertama posting ‘Post’ dan yang kedua pasting “page”
Bedanya dimana? Cobalah Anda pilih “Write>>Write Post” ketikan sesuatu
disana kemudian tekan publish. Lalu Pilih sekali lagi pilih “Write>>Write
Page” kemudian tulis sesuatu disana dan tekan “publish”
Setelah Anda melakukan keduanya, sekarang lihat di bagian atas halaman
Anda sekarang (sebelah kiri) kemudian bukalah di halaman baru (view
Site>>). Dan seharusnya Anda mendapatkan tampilan seperti ini:




Bila Anda membuka salah satu page, maka akan muncul tampilan seperti ini:
Sudah keliatan kan bedanya? Post merupakan inti dari Blog kita ini. Jadi kita
bisa membuat post sebanyak mungkin setiap hari. Page lebih berguna untuk
menyimpan informasi khusus seperti Biodata atau mungkin Hobby yang ingin
Anda buat page secara terpisah agar orang yang berkunjung tidak perlu
mencari di lusinan post yang Anda buat.
Sekarang saya akan mencoba menjelaskan bagaimana dan apa saja fasilitas
yang ditawarkan dalam Wordpress ini dalam membuat postingan baik post
biasa ataupun dalam pembuatan page.
Kita mulai dari text formating:




Pada Wordpress versi 2.0.x telah mendukung fasilitas What You See, What
You Get atau WYSWYG. Tetapi       sejauh ini editor milik Wordpress ini hanya
bekerja pada Browser tertentu. Berhubung saya pengguna AvantBrowser(IE-
based browser), Mozilla Firefox, dan Opera saya menemukan bahwa dalam
browser IE-based browser dan Firefox, editor ini dapat berjalan dengan baik,
sebaliknya, dalam browser Opera, Editor WYSWYG tidak bekerja, sehingga
yang muncul adalah HTML Editor sehingga mungkin bagi pengguna awam
HTML akan kebingungan. Dalam contoh ini saya menggunakan Browser
Internet Explorer 7 Beta 2 tidak banyak berbeda dengan browser tipe IE dan
Firefox.


Tapi walau sudah menerapkan editor WYSWYG, Wordpress 2.0.x ini masih
terdapat banyak kesalahan. Sehingga terkadang menimbulkan keanehan saat
website kita lihat. Jadi mau tak mau, kita harus mengandalkan sedikit
pngetahuan HTML. Tenang saja, saya akan menjelaskannya di bab terakhir!


Saya rasa untuk elemen-elemen standart sepert “Title , Bold, Italic, formating
rata kiri, rata kanan, center” sudah tidak asing lagi bagi Anda. Yang saya
akan terangkan adalah “ Quote”, “Split Post….”, “insert Link”, “Unlink”, “Insert
Image”




Pertama adalah Quote, Text yang kita quote(Sebelah kanan) akan tampil
dalam post seperti gambar berikut ini:




Cara menggunakannya simpel saja, blok text yang ingin di quote, kemudian
klik tombol quoye(yang kanan) apabila mau mebatalkannya, blok tulisan yang
telah di quote kemudian klik icon yang sebelah kiri.




Link Adalah text yang bila klik akan membawa kita ke halaman lain. Cara
membuat link sangatlah mudah. Anda hanya perlu mengeblok kata atau
gambar(kalau gambar hanya cukup klik ada gambar tersebut sehingga
gambar tersebut terseleksi) kemudian klik tombol link(sebelah kiri) Maka
akan muncul kotak dialog seperti gambar berikut ini:




Link   URL    diisikan   dengan    alamat    yang      mau   dituju   misalnya
http://www.yahoo.com (ingat selalu menambahkan http:// sebelum alamat
situs atau link) Untuk “target” untuk mengatur link apakah link akan dibuka di
halaman baru atau di halaman yang sama. Title berguna untuk memberi
penjelasan kemana link tersebut akan menuju.




Untuk menghapus link di sebuah kata atau lebih, cukup blok link tersebut
kemudian klik “unlink”(sebelah kanan dari icon Link)



Split post Merupakan salah satu cara memagi satu buah post apabila post
yang kita buat sangatlah panjang. Sehingga yang tampil hanyalah sebagian
dari post tersebut. Sehingga Apabila pembaca ingin membaca keseluruhan,
harus mengeklik sebuah link. Contoh:




Cara menggunakannya sangat mudah, taruh kursor di baris yang ingin anda
hilangkan(masukan ke halaman detail), kemudian klik tombol icon Split post.

Terakhir, kalau yang sudah expert atau sudah agak kenal dengan HTML
script, bisa mencoba melihat susunan script HTML-nya dengan menekan
tombol ”Edit HTML Source”
Need help? Click Icon help di samping HTML editor




Option Lain: Allow Comment dan Categories




Comment memberikan hak pada pembaca memberikan komentar tentang
post kita. Semua coment yang disubmit oleh pembaca, akan butuh ijin dari
kita untuk dapat dilihat oleh orang lain (lihat sub-bab berikutnya).
Categories memberikan pengkelompokan berdasarkan tema post kita dan ini
hanya terdapat dalam post biasa tidak ada dalam posting page. Dapat
ditambah lagsung di kolom yang disediakan atau di dalam menu manage.
Setiap post bisa memiliki kategori lebih dari satu.

Upload files:
Anda bisa mengupload berbagai macam files yang Anda inginkan, tetapi
mungkin Anda harus memperhatikan space yang Anda miliki.



Manage




Manage , adalah tempat untuk mengedit/menghapus Post dan page,
menampilkan seluruh coment yang kita punya, memberi aproval/menolak
terhadap comment yang masuk, serta menambah/mengedit/menghapus
categories.
Untuk mengedit post dan pages, Anda tinggal memilihih post mana yang
hendak Anda edit, kemudian Anda tinggal memilih opsi “Edit” maka Anda
akan dibawa ke halaman editor(sama dengan halaman “write”).
Untuk menambah dan mengurangi kategori, Anda tinggal menuju ke
“categories”
“Name” diisikan nama kategori, untuk “category parent” bila kategori yang
Anda buat merupakan kategori induk(yang mungkin bukan bagian dari
sebuah kategori yang lebih luas) maka dibiarkan saja menjadi “none”



Themes
      Themes Wordpress hampir sama dengan seperti Skin Winamp…
membuat wordpress berganti kulit atau tampilan.
      Kita tidak akan belajar bagaimana membuat Themes itu karena sudah
barang tentu minimal Anda harus sudah bisa HTML dan PHP. Saya rasa, saya
sendiri belum mampu membuatnya. Maka dari itu, sampai saat ini yang saya
lakukan hanya memodifikasi themes yang sudah ada.
      Beberapa Contoh Skin dapat Anda cari di www.wordpress.org atau
mungkin cari di dengan menggunakan Google atau Yahoo.
      Biasanya, Skin Wordpress di download dalam bentuk ZIP. Dan untuk
dapat menggunakannya, Anda harus meng-ekstrak file tersebut kemudian
meng-upload-nya ke folder : “wp-content/themes/” Pada mulanya, ada 2
buah themes default yang disediakan oleh Wordpress




      Uploadlah file Themes tersebut bersama Foldernya:
          Setelah itu Anda loginlah ke Account Anda di Wordpress Anda. Dan
  pergilah ke “Presentation” maka aka muncul satu themes baru:




          Untuk mengaktifkanya, cukup mudah. Klik themes yang Anda ingin
  gunakan.


I. Masalah?
  Seperti yang sudah saya katakan, Wordpress 2.0.x masih belum sempurna.
  Beberapa kesalahan yang terjadi mungkin seharusnya tak terjadi.
  Masalah yang selalu terjadi kebanyakan berasal dari WYSWYG editor pada
  post.
Perhatikan tulisan Path yang diberi kotak hitam di sebelah kiri bawah…. Dan
tag <div /> yang yang ada di sebelah kanan. Ini sering terjadi apabila saat
mengetik kita menekan enter sebanyak 2 kali apabila Path saat kita
menekan berubah menjadi tag div.


Ask : Apa yang terjadi bila kesalahan diatas disubmit post-nya?
Yang akan terjadi adalah:




Dapat dilihat bahwa Sidebar yang seharusnya berada di samping akan
berpindah ke bawah.
Ask: Memangnya ada tag selain div/bagaimana cara mengatasinya?
Seharusnya yang benar saat kita menekan enter satu kali, yang tampil pada
path adalah huruf “p”!! Contoh:




Perhatikan beda antara yang error tadi dan yang benar. Seharusnya saat kita
menekan “Enter” sekali yang keluar adalah TAG “P”.
Setiap awal paragraf baru diawali oleh <p> dan akhir paragraf selalu diakhiri
oleh </p>.
Apabila Anda ingin memulai baris baru tanpa membuat pargraf baru, tekan
kombinasi “shift+ENTER” maka di HTML Source Editor akan muncul sebuah
tag baru <br /> yang merupakan tag/perintah untuk membuat baris baru.
Apabila path telah menunjukan tag “p” apabila Anda menekan Enter 5 kali-
pun tidak ada kejadian seperti tag div seperti diatas.
Apabila sudah terlanjur berubah menjadi tag div, tak perlu kawatir!!
Anda cukup membuka HTML Source Editor dan mengganti tag <div> dengan
tag <p> dan untuk tag penutup </div> diganti dengan </p>.
Apabila ada tag <div /> yang berdiri sendirian ganti saja dengan tag
<p>[space]</p> maka semuanya akan beres.


Untuk masalah lain seperti image juga bisa anda pakaikan tag <p> dan
</p> untuk mencegah kembalinya tag menjadi tag <div>
Masalah lainnya:
Lagi-lagi yang membuat masalah adalah editor WYSWYG-nya. Terkadang hal
ini memang membuat sebal dan kesal.
Masalah lainnya yang tidak begitu fatal tetapi cukup membuat penampilan
berubah adalah adanya tag pembuka tetapi tak ada tag penutup.
Dalam dunia koding bahasa mana saja, selalu ada Awal dan Akhir begitu
pula dengan HTML.
Biasanya yang terjadi adalah tag penutup “Strong” (pembuat tulisan menjadi
Bold) kelebihan (yang kita tidak tahu darimana asalnya). Contoh :


. . . . <strong /><strong /><strong /><strong /><strong /> </p>


Cara mengatasinya sangatlah mudah, cukup hapus tag yang berlebihan. Tetapi
Anda tak bisa sembarangan menghapusnya. Ingatlah bahwa setiap satu tag
<strong> harus memiliki satu tag penutup <strong /> atau </strong>

								
To top