Upload
kresnokoro1945
View
3.756
Download
6
Embed Size (px)
DESCRIPTION
Citation preview
Total Guide : Membuat Blog Wordpress ! 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 blog saya sendiri
www.nafasku.com 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). Panduan ini akan membahas menggunakan blog wordpress seperti di
www.nafasku.com dengan hosting dan domain sendiri secara gratis.
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. 2. 3.
Pilih “File >> Site Manager” sampai kotak dialog Site manager
keluar
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).
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!
4. 5.
Untuk pengguna Byethost:
Untuk pengguna OrgFree:
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)
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
6.
catatan:
Sebaiknya Anda mengupload sedikit demi sedikit untuk
menghindari error.
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>
Created and Edit by : http://www.nafasku.com