Tag Archives: cms

Seri 3 Membangun Toko Online dalam 30 menit!. Memasukkan Produk Jualan Kita

Selamat siang pengunjung setia dedysetyo.net, semoga senantiasa sukses dalam segala aktivitasnya. Menyambung tulisan berseri membangun web store kita pada tulisan sebelumnya. Asumsinya anda telah berhasil melakukan instalasi wordpress dan aktivasi plugin WP-Online-Store anda.

Pada tulisan ini akan saya uraikan lebih khusus pada bagaimana menambahkan produk untuk jualan anda. Oke, sebagai orang yang mau buka toko tentunya anda telah menyiapkan produk yang mau dijual ya kan ?..wah, kalo gak ada barang yang mau dijual, trus mau jualan apa donk..he.he.

Menggunakan plugin WP-Online-Store, sebenarnya kita sudah otomatis diberikan sample produk, sample-sample itu bisa kita lihat melalui langkah-langkah berikut ini :

1. Masuk pada halaman dashboard, melalui http://localhost/wordpress/wp-admin kemudian masukkan User : admin dan Password : 123456 (user dan password silakan sesuaikan dengan instalasi Anda)

2. Begitu sudah masuk, silakan klik Add New di lajur kiri di bawah jendela Pages seperti tampak pada gambar berikut.

1

3. Buat judul misal : Toko Online, kemudian klik pada ikon trolly (jika anda telah aktivasi modul WP-Online-Store maka ikon ini otomatis ada)

2

4. Lanjutkan dengan klik Publish  pada sisi sebelah kanan untuk mempublikasi page yang baru saja anda buat.

3

5. Untuk melihatnya, pada link diatas dashboard di sebelah kiri atas, arahkan mouse anda nanti akan ada hover down link bertuliskan Visit Site

4

6. Nah penampakannya seperti ini, kemudian lanjutkan klik primary link TOKO ONLINE

5

Berikut merupakan tampilan contoh dari sample produk bawaan nya. Ini memberikan gambaran bagi kita bahwa jika kita nanti membangun toko online dengan baik, akan muncul seperti pada tayangan tersebut.

6

Oke sudah cukup melihat sample produk-produk tersebut, contoh-contoh ini silakan dilihat dulu untuk compare dengan produk kita nanti. Namun menurut saya, saya koq merasa lebih ribet ya, jika produk kita bercampur dengan produk-produk sample ini. Mending sample-sample ini kita hapuskan saja ya, sepakat ?. Kalo anda sepakat dengan saya, caranya begini :

Melalui link di WP Online Store di dashboard silakan di klik

Masuk pada tombol QUICK START >> Delete Demo Products

7

Ikuti dengan klik Yes
8

maka tak seberapa lama, akan muncul keterangan bahwa sample produk tersebut telah terdelete “All Default Products are formatted”
9

sekarang kita akan memunculkan produk-produk kita sendiri, siapkan display produk anda sekarang. Sebagai contoh, di tutorial ini saya akan entry 2 produk gadget terbaru. Saya siapkan gambarnya terlebih dulu seperti ini :

HTC One X dengan Android OS
Contoh 1 Untuk Gadget Kategori Android. HTC One X

Harga : Rp.5.000.000

Spesifikasi:

Beats Audio
Active noise cancellation with dedicated mic
TV-out (via MHL A/V link)
SNS integration
MP4/H.263/H.264/WMV player
MP3/eAAC+/WMA/WAV player
Google Search, Maps, Gmail,
YouTube, Calendar, Google Talk
Document viewer/editor
Voice memo/dial/commands

Prosessor Quad-core 1.5 GHz
Jaringan
GSM 850 / 900 / 1800 / 1900
HSDPA 850 / 900 / 1900 / 2100

Tipe Layar Super IPS LCD2 capacitive touchscreen, 16M colors
Ukuran Layar 720 x 1280 pixels, 4.7 inches
Proteksi Layar Corning Gorilla Glass
HTC Sense UI

Memori Internal 32 GB (26 GB user-available) storage, 1 GB RAM
Sistem Operasi Android OS, v4.0 (Ice Cream Sandwich)
Ragam Pesan SMS (threaded view), MMS, Email, Push Email
Ragam Ringtone Vibration, MP3, WAV ringtones
Audio Port 3.5mm jack

dan ini juga :

Contoh 2 Untuk Gadget Kategori Android. Samsung Galaxy Tab
Contoh 2 Untuk Gadget Kategori Android. Samsung Galaxy Tab


Harga : Rp.6.000.000

Spesifikasi:

Fitur
  • Sensors : Accelerometer, gyro, proximity, compass, barometer
  • Browser : HTML5
  • Java MIDP emulator
  • S-Voice natural language commands and dictation
  • Smart Stay and Smart Rotate eye tracking
  • SNS integration
  • Active noise cancellation with dedicated mic
  • TV-out (via MHL A/V link)
  • MP4/DivX/XviD/WMV/H.264/H.263 player
  • MP3/WAV/eAAC+/AC3/FLAC player
  • Organizer
  • Image/video editor
  • Document editor (Word, Excel, PowerPoint, PDF)
  • Google Search, Maps, Gmail, YouTube, Calendar, Google Talk, Picasa integration
  • Voice memo/dial/commands
  • Predictive text input (Swype)
Prosessor Quad-core 1.6 GHz Cortex-A9
Jaringan GSM
  • 2G Network : GSM 850 / 900 / 1800 / 1900
  • 3G Network : HSDPA 850 / 900 / 1900 / 2100
  • HSDPA 850 / 900 / 2100 – N7105
  • 4G Network : LTE 800 / 900 / 1800 / 2600 – N7105

Model SIM CardMicro-SIM

saya siapkan juga gambar untuk icon kategori Gadget Android seperti ini

android

Setelah menyiapkan gambarnya, perlu juga anda persiapkan yaitu : Spesifikasi produk dan Harga.

Setelah semuanya siap, dari mana kita mulai ?.

1. Kita akan membuat kategori produknya terlebih dahulu, misalnya: Gadget Android. Silakan masuk pada konfigurasi WP-Online-Store anda di dashboard, kemudian dapatkan link nya seperti tampilan dibawah ini. Klik pada QUICK START >> Categories/Products

10

Pada bagian Categories/Products silakan klik New Category

11

Silakan tambahkan category baru, yang perlu diisikan ada Nama, Deskripsi dan Gambar. Seperti nampak di bawah ini, akhiri dengan SAVE ya.

12

Oke, sudah berhasil ditambahkan satu kategori baru yakni “Gadget Android”

13

2. Setelah berhasil ditambahkan kategorinya, kemudian kita tambahkan produk baru, klik “New Product”

14

Pada jendela baru ini, ada beberapa isian yang akan kita entry,

Product Status : Status Produk (pilih In Stock, maksudnya ready stok)

Date Available : Tersedia sejak tanggal

Products Manufacturer : Pabrik pembuat

Products name : Nama Produk (Isikan HTC One X)

Tax Classes : Kelas Pajak

Products Price (Net) : Harga Produk Bersih

Products Price (Gross) : Harga Produk kotor

Deskripsi Produk : Silakan masukan informasi yang anda tahu tentang produk

Input Gambar yang telah disediakan

Akhiri dengan SAVE.

15

16

Pada tampilan di bawah ini, nampak produk tadi sudah selesai kita buat.

17

Sekarang anda masuk pada tampilan toko nya. Maka jika berhasil akan didapati display menarik seperti ini. Oke, selamat ya, anda telah berhasil memasukkan produk baru. Memasukkan produk-produk lainnya caranya sama saja koq.
18

Ada satu hal perhatian dari produk kita dimana kita bertransaksi kebanyakan dengan orang Indonesia, maka akan kita sesuaikan mata uang/Currency untuk transaksi jual beli ini. Nantikan tipsnya di tulisan berikutnya ya ..he.he

Selamat mencoba.

Salam hangat,

Dedy Setyo

Seri 2 Membangun Toko Online dalam 30 menit!. Aktivasi Plugin Webstore WP-Online-Store

Melanjutkan tutorial sebelumnya disini, diasumsikan anda telah berhasil melakukan instalasi wordpress di pc anda. Sekarang kita lanjutkan bahasan tentang apa saja yang diperlukan lebih spesifik untuk membuat wordpress tersebut menjadi webstore siap pakai.

Jika anda mengenal pernah bermain-main dengan CMS (Content Management System) lain sebelumnya, maka pastilah pernah kenal dengan istilah plugins/module. plugins ini diperlukan untuk customize web kita agar dapat sesuai dengan tujuan pembuatan. Nah, wordpress sebagai salah satu CMS yang populer dengan banyaknya plugins yang tersedia, ratusan bahkan ribuan plugins disediakan untuk memnuhi kebutuhan anda. Ada yang berbayar, namun banyak juga yang gratis !. Sebagai penikmat gratisan.he.he..kita akan menggunakan plugin yang diberi nama oleh developer nya wp-online-store yang bisa didownload disini. Plugin ini kita perlukan untuk membuat wordpress menjadi webstore yang handal. Lumayan update pula, karena terakhir kali diupdate pada 10 April 2013 yang lalu.

Persiapan :

1. Silahkan download plugin wp-online-store yang bisa didownload disini. Bagi siswa NFBS di jaringan lokal bisa unduh disini

2. Simpan pada folder E:\xampp\htdocs\wordpress\wp-content\plugins (sesuaikan dengan instalasi xampp anda). Lihat ilustrasi gambar di bawah ini.

12

Jika sudah, mari kita mulai. Langkah-langkahnya kemudian :

3. Ekstrak filse dengan ekstensi zip teresbut. Jika anda menggunakan winrar tinggal klik kanan kemudian klik Extract Here

13

Sehingga akan muncul satu folder baru yang bernama wp-online-store

14

4. Login pada halaman dashboard melalui http://localhost/wordpress/wp-admin, masukkan user: admin dan password : 123456 (sesuaikan dengan instalasi wordpress anda sebelumnya).

Kemudian pada sisi sebelah kiri, anda akan mendapati link Plugins dan silakan di klik link tersebut. Seperti tampak pada gambar dibawah ini.

15

Anda akan mendapati beberapa plugin bawaan wordpress saat instalasi dan plugin yg bernama WP Online Store, lakukan aktivasi dengan cara klik Activate

16

Proses aktivasi plugin ini sebenarnya tergantung performa komputer anda, tunggu sampai muncul halaman baru yang berisi keterangan bahwa plugin telah diaktifkan, Plugin activated

17

5. Jika telah aktif, maka telah nampak link untuk konfigurasi WP Online Store pada sisi kiri bagian paling bawah.

18

Oke, sampai disini sebenarnya pemasangan dan aktivasi  plugin WP Online Store telah selesai. Berikutnya, kita akan seting sedikit tentang identitas toko online kita. Saya akan coba berikan sample tentang perubahan atribut toko online baru kita. Oke, masuk lewat link seperti gambar diatas, kemudian pada Quick Start klik My Store

19

6. Pada jendela baru di My Store, klik Store Name di link Action, kemudian Edit. Seperti gamabr di bawah ini.

20

Pada Store Name silakan isi dengan nama toko anda, semisal : “Toko Online Dedy” lanjutkan dengan Save

21

Lakukan hal yang sama pada atribut yang lain, misalnya Store Owner (pemilik toko), Email Address dll. Klik edit di sisi sebelah kanan, kemudian ganti sesuai isian anda dan SAVE.

Sampai disini toko anda sebentar lagi akan launching, tak terasa 5 menit telah berlalu ya ?. Dengan sesi 1 sebelumnya dan sesi ini berarti kita telah memakan waktu 15 menit. Ikuti terus serial berikutnya ya..

Selamat mencoba.

Salam hangat,

Dedy Setyo.

Seri 1 Membangun Toko Online dalam 30 menit!. Instalasi WordPress di PC Lokal

Membangun Toko Online, bagi yang ingin belajar wirausaha /serius usaha, saat ini tidak sesulit jaman dulu. Menggunakan wordpress sebagai salah satu CMS terpopuler di dunia, kita akan membahas step demi step bagaimana membangun toko online ini selesai dalam 30 menit saja. Ciyus ?. beneran lho.. emang sebegitu mudahnya ?. Ikuti dan praktekkan pembahasannya satu persatu. Seri 1 ini akan membahas instalasi wordpress ke dalam PC lokal, targetan saya, semua ini hanya akan dilakukan kurang dari 10 menit saja!. Harapannya bagi anda yang belum memiliki hosting berbayar, bisa mencobanya dengan mudah !.

Skenario ;

1. WordPress akan diinstal menggunakan pc lokal (OS Windows XP/7/8) sebagai servernya

2. Butuh koneksi internet untuk mendownload beberapa software pendukung, setelah instalasi maka praktis tidak diperlukan koneksi internet.

Langkah-langkahnya :

1. Download XAMPP disini, kemudian installkan di pc anda. Maka anda akan langsung mendapatkan apache web server, php sebagai bahasa pemrogramannya, mysql sebagai databasenya, mercury untuk mail server dan ftp server. Instalasi XAMPP pada tutorial ini terletak pada E:\xampp. Anda dapat menyesuaikan dengan folder instalasi anda ya 🙂

2. Download source wordpress disana, kemudian taruh di E:\xampp\htdocs. Lihat gambar dibawah ini

1

3. Ekstrak file zip yang telah anda download barusan, jika menggunakan winrar anda tinggal lakukan klik kanan kemudian klik Extract Here

2

4. Kemudian akan didapatkan folder baru dengan nama wordpress

 3

5. Jalankan service apache dan mysql lewat folder E:\xampp klik xampp-control.exe

6. Kemudian untuk melakukan instalasi, pada browser silakan ketikkan http://localhost/wordpress seperti pada gambar dibawah ini, lanjutkan dengan klik Create a Configuration File

4

7. Pada jendela berikutnya klik Let’s go!

5

8. Lakukan pembuatan database, buka tab baru (tekan CTRL+T bersamaan), kemudian akses http://localhost/phpmyadmin, kemudian klik pada ikon Databases

6

9. Buat nama database semisal dbdedy lanjutkan dengan klik Create lihat gambar peraga dibawah

7

10. Kembali pada tab browser sebelumnya, silakan isikan nama database dan konfigurasi lainnya, seperti gambar dibawah ini, akhiri dengan klik Submit
811. Nah, pada jendela berikutnya klik Run the install
912. Oke, selanjutnya tulis informasi yang diperlukan disini, ada

Data isian ini hanya contoh saja, anda dapat menyesuaikan dengan isian lainnya

Site Title (Judul Site) : Toko Online Dedy

Username : admin

Password (isikan 2x) : 123456

E-mail : bebas

Privacy : boleh di checklist/tidak

Akhiri dengan klik Install WordPress
1013. Jika muncul tulisan Success !, artinya instalasi anda telah berhasil. Anda dapat melakukan login dan konfigurasi macam-macam melalui http://localhost/wordpress/wp-admin

Sedangkan untuk user umum, hanya akan melihat pada http://localhost/wordpress
11

Mudah bukan ?. Tak terasa hanya 10 menit berlalu. Selamat mencoba !

Salam hangat,

Dedy Setyo.

Menggunakan module teks editor whizzywig pada Drupal

Coretan ini melengkapi sekaligus melanjutkan topik tentang drupal. Drupal sebagai salahsatu CMS terbaik di dunia dengan berbagai macam kelebihan telah dibahas pada tulisan sebelumnya. Berbagai kelebihan itu ditopang oleh banyaknya modules pendukung. Modules ini sendiri merupakan komponen pendukung, pelengkap dan masing-masingnya memiliki fungsi tertentu. Sebagai contoh mudahnya begini,  jika anda menaiki mobil, sebenarnya mobil ini disusun oleh bermacam-macam module, ada yang berfungsi melambatkan kecepatan (ini dinamakan module rem), ada pemutar audio (dinamakan audio player) dan berbagai macam perangkat yang lainnya inilah yang dinamakan module. Oke, sampai disini saya berharap anda sudah paham tentang module ini.

Sampai dengan tulisan ini dibuat drupal telah memiliki 20.221 module. Wow, banyak banget kan ?. untuk apa saja module2 ini ?. Ada untuk Administrasi, komunitas, e-commerces dan lain sebagainya. Pada bahasan ini kita akan membahas penggunaan module text editor yang ada di drupal.

Kenapa menggunakan text editor ?

Secara default, drupal sebenarnya memberikan kita kebebasan untuk menggunakannya termasuk menuliskan konten, pada drupal konten dituliskan dengan bahasa HTML. Bahasa inilah yang bagi orang awam akan kesulitan melakukan editing teks, sebagai contoh untuk menuliskan  BOLD  (tulisan BOLD dengan cetak tebal) maka dituliskan <b>BOLD</b>, dan semua perintah lainnya tergantung kemahiran anda menggunakan HTML. Penggunaan modul text editor ini untuk memudahkan pengguna awam sekalipun untuk mengoperasikan teks di drupal.

Text editor apa yang dipakai ?

Namanya Whizzywig . Apakah ini satu-satunya module text editor yang ada di drupal ?. Tidak, ada beberapa yang ada didrupal, namun module Whizzywig  ini memiliki beberapa kelebihan dibandingkan module serupa. Apakah itu ?, cek gambar di bawah ini.

13

 

Whizzywig diklaim oleh pembuatnya sebagai module dengan kecepatan akses paling cepat, memiliki ukuran paling kecil dsb. Untuk lebih lengkapnya silakan dicek ke halamannya langsung disini.

Langsung saja kita mulai, bagaimana menggunakan modules ini ? Continue reading Menggunakan module teks editor whizzywig pada Drupal

Instalasi Drupal pada server PC Lokal

Seingat saya, di blog ini tulisan tentang drupal baru pertama kali saya angkat. Ini dilatarbelakangi oleh keluhan beberapa siswa dan teman2, tentang bagaimana mengoptimalkan penggunaan drupal sebagai aplikasi berbasis web yang handal dan mudah digunakan. Kesannya kok susah sekali ya menggunakan drupal ?.Kenapa drupal bukan yang lain ?. Dari pengamatan yang saya lakukan di internet, memang drupal sebagai platform yang belum seterkenal CMS lain terutama di indonesia. Cuman untuk luar negeri sudah banyak organisasi/lembaga atau publik figur yang menggunakan drupal. Ijinkan saya menyebutnya beberapa, whitehouse.gov (Website resmi Kepresidenan AS), ubuntu.com (website resmi distro linux Ubuntu), bagi penggemar dunia balap ada www.motogp.com, lembaga hiburan tersohor di dunia www.waltdisney.com, dan masih banyak lagi, sisanya silahkan bisa dicek langsung ke http://drupal.org/case-studies.

Apa kelebihan drupal ?

Apa alasan yang mendasari lembaga-lembaga besar dunia ini menggunakan drupal ?. dari sekian banyak alasannya, diantaranya adalah faktor keamanan dan update reguler penggemar/aktivis drupal juga sangat berperan. Update versi drupal, sangat terbilang cepat, antara versi satu dan versi berikutnya hanya terjeda beberapa bulan saja sehingga untuk urusan keamanan update patch ini relatif handal. Alasan lainnya, pada tahun 2011 Packt Publishing lembaga penerbitan buku2 spesialisasi open source ternama mengadakan Open Source Awards dan hasilnya drupal mendapatkan predikat 1st runner up dibandingkan semua CMS yang ada di dunia, tidak itu saja, pada perhelatan tersebut drupal juga mendapatkan penghargaan sebagai Best Open Source CMS for Performance, Best CMS for Best Community dan Best CMS for Ease of Use. Kelebihan drupal lainnya adalah fleksibilitasnya untuk dapat dipakai sebagai aplikasi apa saja semisal blog, forum, website, e-commerce, video sharing, jejaring sosial, bahkan aplikasi canggih semacam Sistem Informasi dapat dibuat menggunakan drupal.

Tulisan ini saya dedikasikan bagi siswa-siswa saya atau teman-teman yang berniat mempelajari drupal namun masih mentok pada instalasi, saya sajikan langkah-langkahnya dilengkapi dengan gambar, harapannya agar mudah dipahami dan dipraktekkan.

Saya bagi menjadi 2 macam instalasi, yakni : instalasi pada PC lokal dan pada hosting.

Langkah-langkah Instalasi pada PC lokal (windows XP/7 tahapannya relatif sama):

1. Install paket web server, database dan php anda. Cukup banyak program yang bisa dipakai, yang lumayan terkenal diantaranya xampp, wamp, atau appserv. Pada workshop ini kita akan memakai xampp, silakan download disini.

setelah terdownload dengan baik, kemudian lanjutkan dengan install, pada jendela dibawah ini pastikan anda tahu dimana letak folder instalasi

1

instalasi xampp terletak pada c:\xampp\

silakan dilanjutkan instalasi sampai selesai karena tidak sukar untuk instalasi ini.

2. Download aplikasi drupal disini. Walaupun sekarang sudah terdapat drupal versi 7, bahkan 8. Saya masih lebih recomended ke versi 6 dikarenakan dukungan module dan themanya lebih banyak dibandingkan 2 versi diatasnya yang masih sedikit.
Continue reading Instalasi Drupal pada server PC Lokal