Tutorial Membuat WEB dengan XAMPP

Tutorial 1

Pengenalan
Kita akan belajar membuat Web menggunakan CMS yang cukup terkenal yaitu WordPress. Saya akan membuat web tentang Smk Darma Siswa yang berisi beberapa menu yaitu Home, Sejarah, Visi dan Misi, Program Keahlian yang terdiri dari beberapa sub menu dan juga Cerita.
Langsung saja langkah-langkahnya adalah sebagai berikut :

1. Penginstalan

Langkah pertama yang harus kita lakukan adalah penginstalam di,ama saya disini menggunakan wordpress 3.5,yang sudah saya sediakan di folder latihan.
Langkah awalnya kita check dulu apakah komputer kita sudah terinstall webserver,kita isikan URL “localhost/” maka akan muncul Welcome to XAMPP for Windows berarti komputer kita sudah terinstall.
Setelah itu kita copy wordpress 3.5-nya ke C -> xampp -> htdocs lalu kita paste di sini(ketika anda menggunakan webserver lain misalnya appserv,anda tidak bisa meng-copynya seperti cara yang tadi,anda haruss meng-copynya di C -> appserv -> www). Setelah kita copy lalu kita klik kanan -> extract here,maka akan terbentuk foldder baru dengan nama wordpress,kita rename folder ini dengan nama “belajarweb”.
Langkah ke-2 kita buat database-nya dulu,dalam browser kita isikan URL “localhost/phpmyadmin/” -> lalu kita klik Database -> kita isikan nama database dengan nama “belajarweb” -> create -> database telah terbuat.
Langkah ke-3 kita masuk ke penginstalannya,kita masukan di URL “localhost/belajarweb/”,nama belajarweb disini mengacu pada folder yang kita buat saat meng-extract wordpress 3.5 tadi,namanya harus sesuai dengan folder tadi -> Create and Configuration File -> Let’s go ->isikan nama databasenya sesuai dengan yang telah kita buattadi yaitu belajarweb,username kita isikan root,password kita kosongi,database host dan table prafix kita biarkan namanya demikian -> submit -> Run the Install ->lalu di site title kita isikan “Smk Darma Siswa”,username kita isi admin,lalu isikan password dan e-mail anda -> Install WordPress ->Log In -> kita sudah bisa masuk ke dalam Dashboard. Untuk melihat hasil web anda isikan pada URL “localhost/belajarweb/”,akan muncul tampilan dari webnya.

2. Back Up

Langkah pertama untuk mem-back up web kita harus meng-copy folder belajarweb ke directory lain,lalu kita buat folder baru dengan nama “back up web” lalu kita paste
Ke-2 kita ambil database-nya dengan cara isikan di URL “localhost/phpmyadmin” lalu kita klik Database,lalu anda pilih database-nya,setelah itu klik export -> Go -> secara otomatos kita akan mendownload file belajarweb.sql -> kita copy file-nya ke folder “back up web” yang tadi.
Selanjutnya kita akan belajar bagaimana cara me-restore,pertama folder belajar webnya saya hapus dan untuk databasenya juga akan saya drop.

3. Restore

Sekarang kita akan belajar bagaimana cara mengembalikan data yang telah kita haous tadi dengan menggunakan file yang sudah kita copy dan download tadi.
Langkah pertama kita check dengan meng-isikan pada URL “localhost/belajarweb”. Saat itu kita akan mendapati bahwa web yang telah kita buat tidak dapat di temukan karena kita sudah menghapus folder belajar web dan databasenya.
Untuk mengembalikan data web-nya kembali,yang pertama kita lakukan adalah mengembalikan folder belajarweb yang sudah kita copy di folder “back up web” terlebih dahulu ke htdocs. Setelah itu kita buat database baru dengan meng-import file sql yang kiita export tadi -> masuk ke “localhost/phpmyadmin” -> Database,tuliskan nama database dengan nama yang sama -> create ->setelah terbuat databasenya kita klik databasenya lalu klik import -> browse -> kita cari file sqlnya atau file database yang sudah kita download tadi -> Open -> Go -> “Import has been successfully finished”,kita coba buka webnya. Webnya sudah berhasil ter-restore kembali.
Akan terjadi maalah apabila anda ingin mengerjakannya di komputer 1 yang menggunakan xampp yang pada phpmyadmin passwordnya kosong,sedangkan pada komputer 2 menggunakan appserv yang passwordnya adalah 12345. Terjadi perbedaan password disini,cara mengaasinya adalah buka folder belajarweb yang telah kita copy tadi di htdocs,lalu cari file yang bernama “wp-config” -> klik kanan->”Edit With Notepad”,disini anda perhatikan bagian yang bertuliskan “define”,di sini anda bisa mengganti username,password dll (ini harus sama dengan websever yang anda gunakan di komputer anda,karena kalau terjadi perbedaan,web anda tidak akan bisa di back up).

4. Create Page

Kali ini kita akan membuat menu pada web,dala, contoh ini kita akan membuat beberapa menu seperti Home,Sejarah,Visi Misi,Program Keahlian, dan Berita. Untuk bahan-bahan artikelnya sudah saya siapkan.
Pertama isikan di URL “localhost/belajarweb/wp-admin”. Kita rubah dulu templatenya agar sesuai dengan contoh yang telah di buat,kita klik Appearance -> themes -> pilih tema Twenty Eleven->Active->kita reload halaman web tadi,sehingga tema sudah di terapkan.
Selanjutnya kita masuk ke Page->add new->kita mulai untuk membuat isinya. Kita copy artikel yang sudah di siapkan terlebih dahulu,kita isikan Title dengan nama Home. Untuk memasukkan gambar kita klik add media->select file->kita pilih gambarnya lalu kita tunggu sampai gambarnya muncul->klik insert into page->publish. Lakukan hal ini sampai semua halamannya selesai. Untuk melihat hasilnya klik pages->all pages.

5. Menu

Setelah selesai membuat pages yang kita butuhkan,sekarang kita akan mengatur menu pada web,karena menu pada web belum teratur. Maka dari itu sekaran kita akan mengatur menu pada web.
Pertama kita klik Appearance->Menus->alu kita isikan nama menunya,kita misalkan “Menu Utama” ->klik Create Menu->pilih “Automatically add new top-level pages to this menu” ->save menu->pada “Theme Location” ada “Primary Page” kita pilih Menu Utama->save->selanjutnya anda memilih menu pada pages->klik add to menu dan dengan otomatis akan muncul sebagai menu->untuk membuat sub menu anda bisa memasukkan URL pada bagian Costum Links,isikan alamat web anda lalu pada Label di isi misalnya Program Keahlian,add to menu,setelah itu geser Menu Program Keahlian keatas,lalu geser Menu Teknik Pemesinan,Kendaraan Ringan, dan Komputer Jaringan ke kanan,dengan demikian Menu yang di geser ke kanan dapat di katakan sebagai sub menu dari Menu Program Keahlian->klik save menu->reload pada halaman web anda dan lihat hasilnya.
Tetapi ada yang sedikit janggal ketika anda masuk ke webnya,tampilan utama disana adalah “Hello World!” bukan Home. Agar yang muncul di awal adalah Home kita harus seting dahulu,kita masuk ke Dashboard->Setting->Reading->untuk bagian Front page displaysnya anda bisa memilih yang A static page (select below) dan Front Pagenya anda pilih Home->klik save change->reload pada halaman web anda dan lihat hasilnya.
Jika anda ingin menghilangkan comments di setiap pages, anda bisa melakukannya dengan cara klik Pages->All Page->klik menu Home->Quik Edit dan hilangkan Allow Comments->Update. Lakukan hal yang sama di Pages yang lain. Reload pada halaman web anda dan lihat hasilnya.

6. Post Categori

Pada tahap ini kita akan membuat bagian menu berita yang di dalamnya terdapat artikel yang dikategorikan sebagai berita. Caranya sebagai berikut :
Kalau biasanya kita menggunakan Pages,sekarang kita menggunakan Posts->add new->isikan artikel yang akan di postkan,lakukan seperti cara memasukkan artikel pada Pages->setelah itu pada kotak Categories anda klik add new category semisal namanya Berita->klik add new category yang ada di bawah->pastikan category Berita tercentang->klik Publish. Lakukan hal ini sesuai posts yang anda ingin tambahkan pada kategori.
Setelah itu kita buat menu unutk menampilkan post yang telah kita buat sebelumnya, klik Appearance->Menus->pada Categories centang berita lalu klik add to menu->save menu->reload pada halaman web anda dan lihat hasilnya. Jika anda ingin menghilangkan comments pada Posts Category caranya sama dengan menghilangkan comments pada Pages.


Tutorial 2

1. Download Template dan Install

Untuk mendownload template pada wordpress anda bisa langsung mengunjungi situs resmi wordpress itu sendiri yaiitu www.wordpress.org . Disana anda akan menemukan banyak sekali template dengan menge-klik Themes pada menunya,dan ini bersifat free atau tanpa bayar. Anda bisa melihat themes apa yang sering di diownload oleh orang lain dengan menge-kllik Most Populer atau anda ingin mencarinya sendiri,cara klik “search bellow or check out our new filter and tag interface”,disini anda bisa memilih warna themes apa yang ingin anda cari,berapa kolom yang anda inginkan. Misal kita ingin mencari themes dengan warna black dengan 3 kolom,maka langsung kita klik Find Themes.
Akan muncul pilihan berbagai theme,anda tinggal memilih salah satunya,anda klik lalu akan muncul tampilan preview dari themes tersebut. Jika sudah cocok dengan apa yang anda ingikan pada pojok kanan atas tampilan preview tersebut anda klik download”or aphene”,kita dowload themesnya.
Untuk mendownload themes di situs resmi wordpress ini hanya bisa kita lakukan dengan cara online. Sebenarnya kita juga bisa mencari themes selain dari situs resmi milik wordpress ini,kita bisa mencarinya dengan masuk ke dashboard->appearance->themes->. Caranya kita disini juga sama seperti mencari themes tadi,kita bisa pilih colors,colums,width,feature,subject. Jika sudah anda pilih klik Apply Filters,otomatis akan mencari themes yang sudah anda tentukan tadi (hal ini bersifat online,karena kita membuat web secara offline maka fasillitas ini tidak bisa digunakan).
Setelah download theme kita tadi selesai kita copy theme tersebut ke dalam folder “Back up Web”. Setelah itu kita lakukan proses upload theme tersebut,cara klik appearance->themes->lalu akan ada tulisan “Manage Themes dan Install Themes” kita pilih Install Theme->Upload->browse,kita cari theme yang tadi telah kita download->open->install now. Setelah install theme selesai kita klik active. Reload halaman web anda dan lihatt hasilnya.

2. Edit Template with Firebug
Kita akan memanipulasi template pada web. Yang pertama kita akan merubah warna pada bagian recent,kita klik kanan pada recent,kita klik Inspect Element. Jika anda menguasai bahasa css maka anda bisa memanipulasi pada bagian yang anda pilih,dalam kasus saya disini terpilih pada “<h3> recent posts </h3>”. Pada sidebar backgroundnya kita hapus kita ganti misalnya dengan “green”. Maka pada bagian recent yang kita pilih tadi akan berubah menjadi hijau. Pada bagian fontnya anda juga bisa rubah dengan mem-block font yang akan dirubah,klik kanan inspect element lalu ganti ukurannya sesuai kebutuhan,colornya juga bisa dirubah sesuai keinginan. Tapi cara ini sifatnya hanya sementara,jika kita reload maka akan kembali seperti semula lagi.
Nah, sekarang kita akan coba agar perubahannya permanen. Yang kita lakukan adalah mengubah settingan file css di dalam webservernya. Pertama klik kanan pada bagian yang akan dirubah,klik inspect element pada bagian background kita ganti misalnya black,lalu pada sidebar kita bisa merubah stylenya,bisa kita lihat saat kita arahkan kursor pada bagian teks berwarna biru kita akan melihat “http://localhost/belajarweb/wwp-content/themes/graphene/style…..”. Kita akan membukanya sesuai tulisan tadi,localhost disini berarti htdocs->belajarweb->wp-content->themes->graphene->style css kita buka menggunakan notepad. Lalu kita cari untuk linenya,dalam kasus saya linenya adalah 2018,jika sudah ketemu pada bagian background kita hapus semuanya,kita ganti misalnya Black lalu save(ctrl+s),kita reload pada halan web anda dan lihat hasilnya sendiri.

3. Install
Pada tutuorial kali ini kita akan memaksimalkan add ons milik firefox unutk memanipulasi template. Langkah pertama yang harus di lakukan adalah mengintal firebug yang sudah di sediakan file installernya. Setelah terinstal kita buka firefox,pada pojok kiri atas anda klik firefox->add ons (ctrl+shift+A) ->klik “tools for all add-ons” yang bersimbol gerigi->klik Install add-on From File->kita cari file firebug dengan format xpi->open->install now.
Demikian tutorial penginstalan firebug dari firefox,anda sekarang bisa mengotak-atik template pada web yang telah dibuat dengan menggunakan firebug tersebut.

4. Seo dan Header
Mengganti template header dari webnya. Karena kita menggunakan cms dan semua cms pasti memiliki fasilitas untuk mengganti template,anda bisa menotak-atik template sesuai dengan defort dari bawaan wordpress. Untuk menggantinya pertama kita masuk ke dashboard->appearance->header->anda bisa mengganti gambar pada header sesuai keinginan anda dengan menekan browse,gambar yang akan anda gunakan sebagai tampilan pada header resolusinya harus sama dengan keterangan yang sudah tertera di tampilan select images tadi,hal ini dilakukan agar gambar tidak pecah->jika sudah terpilih open->upload->lakukan croping pada gambar header->crop and publish->header pun sudah terganti sesuai gambar yang anda inginkan.
Setelah header selesai kita akan belajar men-setting web kita agar seo friendly. Seo adalah singkatan dari search engine,anda bisa lihat saat kits menge-klik pada bagian menu,URLnya akan sedikit rumit untuk dihafalkan ataupun dikenali oleh mesin serchingnya sendiri. Agar URLnya mudah dihapalkan atau agar menjadi seo friendly cara adalah pada bagian setting kita klik permalinks->anda bisa rubah pada bagian common settings,misalkan kita rubah menjadi post name (anda juga bisa merubahnya sesuai keinginan dan kebutuhan anda) ->save changes->saat kita menge-klik kembali menu yang telah kita ubah tadi maka akan anda lihat bahwa URLnya sudah berubah.


Tutorial 3

1. Install Artisteer

Pada tutoril kali ini kita akan menginstal artisteer yaitu software yang digunakan untuk membuat template,jadi kita bisa membuatnya sendiri sesuai dengan kemauan kita tanpa harus mencari di situs resmi wordpress ataupun situs untuk mencari template. Yang pertama kita extract here file zip artisteernya,lalu kita install installer artisteernya klik next terus sampai finish lalu klik active,anda buka file keygen artisteer zipnya. Anda copy kode dari keygen ke artisteer activationnya,sehingga proses install akan sempurna.

2. Buat Template Artisteer

Setelah proses penginstallan selesai kita bisa langsung buka artisteernya,dan saat ada tampilan new project anda pilih wordpress karena kita disini menggunakan wordpress. Akan muncul tampilan awal template yang masih orisinil,anda bisa mengubahnya sesuai kemauan anda dengan berbagai macan menu yang tersedia di dalam toolbar artisteer ini. Anda bisa merubah gambar pada header,letak header,backgroungnya mau seperti apa,anda bisa menambahkan animasi,dan masih banyak sekali yang masih anda bisa lakukan disini. Dan yang lebih lagi, anda bisa merubah template sesuai keinginan anda dengan cara yang sangat mudah karena dipermudah dengan adanya toolbar yang menampilkan berbagai macam fiturnya. Jika anda sudah selesai merancang template anda,klik pada bagian WordPress Themes,akan muncul tampilan menu export,pada kolom template anda pilih wordpress,isikan folder namenya,anda tentukan mau anda simpan dimana->setelah itu anda tandai “create ZIP file” ->export. Anda lihat apakah templatenya sudah ada pada folder yang anda pilih tadi,setelah itu kita coba memasang template ini pada web kita. Caranya sama seperti memasang template yang sebelumnya, appearance->themes->install themes->upload->browse,cari file template tadi->open->install now->active->anda reload pada halaman web anda. Template sudah terpasang,silahkan mencoba.


Tutorial 4

1. Pengenalan plug in

Kita akan memaksimalkan menu plug in,kita bisa melihat plug in di situs resmi wordpress yaitu wordpress.org lalu kita klik plugins,disini ada plug in yang bersifat berbayar ataupun gratis. Pertama kita akan tentukan plug in mana yang memang sesuai dengan kita,kita bisa memanfaakan seacrh engine atau mesin pencari,misalnya kita mau mencari plug in unutk buku tamu,maka otomatis kita memasukkan keyword guest book,akan muncul beberapa plug in. Disini kita harus pintar memilih plug in mana yang mempunyai kwalitas yang baik dan bersifat free. Ada beberapa indikator yang menyatakan kalau plug in ini berkualitas baik,pertama kita lihat dari ratingnya,paling tidak ada 4 bintang rating pada plug in tersebut. Selain itu anda juga bisa melihat jumlah pendownload yang telah mendownload plug in tersebut. Perlu di ingat bahwa hasil pencarian yang berada pada list paling atas belum tentu menandakan kalau itu berkualitas baik. Kita juga bisa membandingkan plug in satu dengan plug in yang lain,kita bisa menggunakan parameter yang sudah tersedia disana,misalkan ada requires,compatible up to,last update,download,rating dll. Pada bagian compability pastikan works,lalu anda lihat juga pada bagian instalation,usahakan pada bagian instalation pastikan mudah untuk di praktekkan. Anda juga bisa melihat bagian screenshoot agar anda bisa tahu bagaimana tampilannya kalau sudah di install, ada beberapa plug in yang menyatakan “will add later” yang meng-indifikasikan kalau screenshoot nya belum di sertakan,jika memang sudah disertakan maka akan tertera URL situs resminya,dalam kasus ini saya menggunakan DMS Guest Book. Demikian pengenalan mengenai plug in dan bagaimana cara untuk memilih plug in yang sesuai,silahkan mencoba.

2. DMS Guest Book

Kali ini kita akan belajar mengenai cara menginstall plug in untuk guest book atau buku tamu yang kan muncul di menu web. Pada guest book terdapat beberapa kolom yang harus di isi seperti kolom nama,e-mail,dan website anda,serta juga ada semacam kode yang harus anda ketik pada kolom yang telah di sediakan,setelah anda submit anda akan meninggalkan jejak. Cara penginstalannya adalah sebagai berikut :
Yang pertama kita masuk ke dashboard->plugins->karena plugin-nya sudah tersedia pada bahan maka kita tidak perlu susah payah mendownload plugin-nya lagi,tapi jika anda ingn mendownload plugin lagi silahkan,anda bisa melakukanya dengan cara searching pada mesin pencari,jika tidak kita bisa langsung upload->browse,kita cari file plugin-nya->install now->active plugin.
Langkah ke-2 anda but lagi pages baru untuk menaruh plugin-nya,klik pages->all page->masukkan pada title guest book->publish. Jika sudah kita lihat pada bagian menu sebelah kiri setelah menginstall plugin akan terbentuk menu baru,dalam kasus ini bernama DMSGuestBook,kita klik->pilih guestbook setting->klik basic,untuk languange-nya kita pilih english txt->lear all->lalu set pada guestbook->save,dalam menu ini anda juga bisa men-setting extented,color,time and date,e-mail notivication dll. Anda reload pada halaman web anda dan lihat hasilnya. Demikian tutorial kali ini selamat mencoba.


Tutorial 5

1. INSTALL PLUGIN NEXTGEN GALLERY

Teman teman jangan lupa sebelum melakukan install plugin minimal anda harus mempunyai file plugin.rar tersebut atau terkoneksi dengan internet. Cara instal Pluginnya adalah sebagai berikut :
1)    Jalankan XAMPP Control.
2)    Log In ke Web anda masing masing. Maka Dashborad akan muncul.
3)    Pilih Menu Plugin > Add New .
4)    Saat anda terkoneksi dengan internet ,anda dapat melakukan searching secara lagsung melalui kotak dialog seach,bila tidak anda dapat melakukan dengan cara lain .
5)    Saat jendela Install Plugin telah muncul,Pilih Tab Upload .
6)    Pilih Browse untuk melakukan searching file plugin di PC / laptop anda > Open.
7)    Setelah selesai mencari klik “ Install Now “
8)    Setelah itu akan muncuk sebuah opsi,pada opsi tersebut anda pilih Active Plugin.

2. MEMBUAT GALERI DENGAN NEXTGEN GALLERY

1)    Jalankan XAMPP Control.
2)    Log In ke Dashboard anda masing-masing.
3)    Setelah anda menginstall plugin nextgen gallery otomatis akan muncul menu gallery.
4)    Buka menu Gallery
5)    Pilih Add New Gallery / Image . Jendela New Galleryakan muncul.
6)    Ketik nama gallery yang akan kita buat > Piih Add Gallery.
7)    Setelah gallery terbuat akan ada opsi Upload Image,Anda bisa meng uploadnya satu persatu / langsung meng upload suatu album yag sebelumnya telah anda rubahformatnya menjadi .zip / .rar file.
8)    Pilih Browse untuk melakukan pencariangambar yang akan anda upload .
9)    Pilih Start upload untuk memulai . setelah selesai ,untuk megatur gallery anda dapat melalui menu Gallery > Manage Gallery.

3. MENGATUR NEXTGEN GALLERY

Anda dapat melakukan pengaturan pada Gallery anda melalui menu Gallery > Option .
Contohnya adalah mengedit Hint untuk emanampilkan slide show Gallery di web anda .Caranya adalah :
1)    Buka Menu Gallery > Option . Jendela Gallery setting akab muncul .
2)    Setelah mncul ganti nama hint default di bagian “Intregrate Slidshow” .
Pada Tab menu effect adalah untuk mengatur effect pada gambar yang di tampilkan .
Di Tab menu Slide show anda dapat mengatur semua tentang slide show gallernya,seperti durasi waktu,uuran gambar dan bagaimana gambar tersebut ditampilkan.

4. CARA MENGATUR WATERMARK PADA GALLERY

Caranya dalah sebagai berikut ::
1)    Jalankan XAMPP dan buka Dashbard web anda.
2)    Masuk ke menu Gallery > Option.
3)    Pilih Tab menu watermark . Anda dapat melakukan pengaturan watermark anda sesuka hati . seprti memilih font yan akan digunakan,size, posisi watermark dll.
4)    Bila sudah selesai menyetting > Pilih Save Changes.
5)    Langkah selanjutnay adalah set watermark,Buka menu Gallery > Manage Gallery.
6)    Tandai gallery mana yang akan anda pasangi watermark.
7)    Pada menu dropdown “Bulk option” pilih “Set Watermark”.
8)    Pilih Apply . Setelah berhasil akan ada hint , dan kita harus menghapus Cookies pada Browser kita.
9)    Bukapengaturan Browser anda,Pada tab privasi .
10)  Lalu bersihkan riwayat terakhir > Ok.
11)  Anda dapat melihat hasilnya dengan me refresh web anda.

5. CARA MENGATUR WATERMARK PADA GALLERY

Kita dapat menambahkan gallery di sebuah page di web anda,Caranya sebagai berikut :
1)    Buka Dashboard web anda .
2)    Pilh menu Page > All page .
3)    Pilih halaman mana yang akan anda beri gallery , Pilih edit . Maka jendela edit page akan muncul.
4)    Tempat kursor dimana gallery akan ditempatkan.
5)    Pilh icon Next Gent Gallery.
6)    Akan muncul kotak dialog dan pilih gallery mana yang akan di gunakan > Add
7)    Pilih Publish . Untuk melihat hasilnya, lihat web anda di page yang telah anada beri gallery tadi.
Anda juga bisa menempatkan galley pada halaman baru , caranya sama tinggal buat page baru aja.

6. CARA MEMBUAT ALBUM

Album yang anda buat digunakan untuk menampilkan foto foto dari gallery masing masing. Caranya adalah sebagi berikut :
1)    Buka Dashboard web anda.
2)    Masuk pada menu Gallery > Album . Maka jendela album akan muncul .
3)    Maukksn nama album yang akan di buat pada kotak add new album > Pilih Add.
4)    Select album yang akan diisi .
5)    Drag Gallery gallery yang akan di tampilkan pada album tersebut > Update .
6)    Untuk menampilkan di web nya dalah sebagai berikut :
7)    Buat Page baru dimana anda akan menempatkan album tersebut pada menu Page > Add New. Jenedela Add new page akan muncul .
8)    Ketik nama page yang akan di buat .
9)    Untuk contentnya ,Pilih icon Nextgen Gallery.
10)  Setelah muncul kotak dialog Nextgen Gallery ,Pilih album mana yang akan anda masukkan. > Pilih Insert .Pilih Publish.


TUTORIAL6

1. Cara membuat fitur Contact Us

Fitur Contact Us ini berfungsi untuk mengirimkan email ke admin webnya.
Caranya yaitu :

• Pertama setting terlebih dahulu. Ketika ada orang yang mengirim ke Contact Us maka Anda harus memasukkan email saya misalnya arisbelajarweb@gmail.com kemudian minimize.
• Isikan pada kolom yang ada pada layar seperti First name, Last name, E-mail address, alamat. Untuk email address masukkan email orang lain (email pengirim pesan) kemudian klik browse.
• Buka windows Explorer klik local disk (D:), buka folder Anda missal work lalu pilih file Ngajar kemudian double klik Final Ngajar. Klik 2tkj -> tutorial -> video version -> contac from -> dat.bt
• Isikan subject missal haii dan isikan Message missal hai hello pak boz. Masukkan Captcha kemudian submit
• Jika ada kata Your massage has been sent, thank you. Berarti pesan anda sudah berhasil dikirim.

1. Membuat Fitur di web langsung

• Masuk ke dashdoard kemudian klik please update now agar versinya terbaru. Klik update now
• Tunggu beberapa menit, klik update wordPress Database, klik continue, klik plugins kemudian add new. Masukkan tulisan Contact Form di kolom search lalu klik search plugins
• Langkah selanjutnya Anda harus menginstall lagi untuk Contact Formnya, klik install now. Active plugins.
• Terdapat Akismet maka anda juga harus di Activekan. Proses membuat fitur di web langsung sudah selesai.

1. Cara mensetting dari Fast Secure Contact Form

• Setelah mengistal otomatis ada menu dibagian plugins FC Contact Form Options kemudian Anda klik.
• Disana terdapat form 1 – 4. Ketika Anda di form 1, anda tuliskan di Form Label : Administrator. Untuk Form 1 : <p> silakan tulis pesan disertai untuk administrator <p>
  kemudian isikan email anda.
• Untuk send email Function pilih wordPress
• Di konfirmasi email (Form 1) isikan seperti gambar :

\

• Pada CAPTCHA pilih hight
• Anda bisa atur label bertulis alamat, dan filed type

Tutorial 7
Di tutorial ini kita belajar cara membuat fitur download dan upload menggunakan WP-Filebase.
a. Menambahkan file

1. Pilih WP-filebase
2. Pilih file
3. Select file
4. Pada kotak file pilih upload file
5. Beri judul file, nama author dan keterangan lainnya. Jangan lupa untuk memasukan pada category.
6. Post ID berfungsi untuk menampilkan file yang diupload. Bisa diisi atau dikosongkan.
7. tulis diskripsi file yang diupload
8. pada kotak custom 1 dan 2 bisa diisi atau dikosongi.
9. Klik add file
10. Upload beberapa file lagi.

b. Menambahkan di page

1. Pilih Page
2. Klik Add New
3. Buat sebuah halaman
4. Lalu klik icon WP-Filebase
5. Pilih Attachment (untuk menampilkan beberapa file saja)
6. Pilih Single File (untuk menampilkan satu file saja)
7. Pilih File URL (untuk memberikan link download)
8. Pilih File List (Untuk menampilkan semua file yang sudah diupload)
9. Pilih File Tree View (untuk menamoilkan keseluruhan tetapi akann dibagi-bagi sesuai kategorinya)

c. Instal Plug In

1. Masuk ke Dashboard
2. Pilih Plug In
3. Pilih Add New
4. Pilih Telusuri
5. Pilih File, open
6. Klik Instal Now
7. Pilih Active Plug In

d. Kategori

1. Klik Wp-Filebase
2. Pilih Category
3. Pilih Add Category
4. Beri Title dan deskripsi
5. “Acces Permission” pilih “everyone”
6. Klik Add New Category
7. Buat beberapa category

e. Setting Plug In

1. Pilih WP- Filebase
2. Pilih Setting
3. Pilih Display (untuk mengatur file yang akan ditampilkan)
4. Pilih File Browser (untuk pengaturan dalam pencarian file)
5. Pilih Download (untuk pengaturan download)
6. Pilih Security (untuk pengaturan keamann file)
7. Ok

f. Widget

1. Pilih Appareance
2. Pilih Widget
3. Ada 5 Widget dari WP-Filebase, tambahkan pada Main Sidebar
4. Save

diambil dari --> https://muhikrom.wordpress.com/2014/06/05/tutorial-membuat-web-dengan-xampp/