Membangun Komunitas dengan Joomla! 1.0.x bagian 1 dari 2

- bazComp share -

Website resmi komunitas Joomla Indonesia (http://id-joomla.com) menggunakan beberapa extensions Community Builder sehingga dapat terbentuk sebuah komunitas secara lengkap. Membangun komunitas yang diintegrasikan ke dalam sistem Joomla sangatlah mudah. Beberapa pengembang pihak ketiga (3d party) telah menyiapkan berbagai macam aplikasi yang dibutuhkan, mulai dari security, form, community, e-commerce, multimedia, avatar, dan masih banyak lagi.

Umumnya, ketika ingin membuat sebuah fitur seperti komunitas diperlukan file instalasi yang terdiri dari Component, Plugin, dan Module. Jadi satu paket fitur komunitas terdiri dari beberapa file. Untuk itu, sangat perlu memperhatkan kebutuhannya agar fasilitas yang disediakan lengkap dan mudah digunakan. Untuk mendownload file yang dibutuhkan, silakan mengunjungi situs resmi Joomla (http://extentions.joomla.org). Anda juga dapat mendownload file tersebus di sini (Download)

Berikut ini, saya sajikan beberapa teknik untuk membuat sebuah komunitas yang diintegrasikan dengan sistem Joomla 1.0.x. Pengalaman yang pernah saya alami, beberapa kali mengintegrasikan Community Builder menggunakan Joomla 1.5.x sering terjadi “error” ketika membaca database yang dibutuhkan. Padahal database tersebut sudah tersedia. Terus terang sampai sekarang kurang tahu penyebabnya. Namun ketika saya integrasikan dengan versi Joomla yang lebih rendan (Joomla 1.0.x) tidak muncul masalah tersebut. OK, tidak perlu mempermasalahkan hal itu. Gunakan saja versi yang tidak menimbulkan masalah. Mungkin karena versin Joomla masih “sangat baru”, 3d party belum beradaptasi dengan baik.

TAHAP 1: KEBUTUHAN DASAR DAN INSTALASI
Beberapa file yang dibutuhkan untuk membuat fitur komunitas, pastikan telah tersedia. Sebelum mulai instalasi, usahakan menyiapkan file-file yang dibutuhkan, silakan Download file tersebut.

1. Pertama kali pilih menu Installer > Component.
   
2. Tekan tombol Browse, lalu temukan file com_comprofiler.zip yang berada di folder community builder.
   
3. Tekan tombol Upload File & Install.
   
4. Proses instalasi berhasil.
   
5. Langkah selanjutnya, menginstal modul yang masih satu paket dengan Community Building. Pilih menu Installer > Modules.
   
6. Tekan tombol Browse, lalu cari file mod_cblogin.zip
   
7. Tekan tombol Upload File & Install.
   
8. Apabila sudah berhasil, tekan Browse untuk memilih file mod_comprofilerModerator.zip.
   
9. Tekan tombol Upload File & Install.
   
10. Terkhir, uploadfile mod_profilerOnline.zip
    
    
11. Untuk memeriksa Component yang telah terinstal dengan cara memilih menu Component > Community Building.
    
12. Sedangkan untuk memeriksa Module yang telah terinstal dengan cara memilih menu Module > Site Module. Secara default, Module yang baru diinstal dalam kondisi tidak dipublikasikan (bertanda x). Aktifkan Module tersebut dengan cara menekan ikon tanda silang (tanda x).
    
13. Modul CB Login berfungsi untuk Form login yang dapat berintegrasi dengan Community Builder. Sedangkan modul CB Online adalah memeriksa status anggota komunitas yang sedang online.

TAHAP 2: MENGATUR KONFIGURASI
Konfigurasi yang di sini menyangkut beberapa hal diantaranya: pengaturan untuk Registrasi, Tampilan pengguna, Profil pengguna, Gambar, Moderasi, Koneksi, dan Integrasi.

1. Pilih menu Component > Community Builder > Configuration.
   
2. Setelah berada di halaman Configuration, pada Tab General aturlah settingnya seperti gambar berikut.
   
3. Pada Tab Registrasion berisi pengaturan yang berhubungan dengan registrasi seperti alamat email utama, reply, subjek, konfirmasi, informasi pending, dan dan-lain.
   
4. Tab User List berisi pengaturan tentang jumlah anggota yang akan ditampilkan pada setiap halaman dan mengatur link atau tidak ke nama pengguna.
   
5. Tab User Profile berisi pengaturan profil pengguna, diantaranya: apakah diijinkan mengganti username, siapa yang berhak melihat profil pengguna, minimal interval untuk menekan (hits) profil, template komunitas yang digunakan, dan lain-lain.
   
6. Tab Images berisi informasi untuk mengatur ukuran gambar (widht dan height), ukuran thumbnail, izin untuk mengupload gambar dari PC, memilih gambar yang tersedia (gallery), dan lain-lain.

   

   Add caption
7. Tab Moderation berisi informasi untuk mengatur sistem moderator menyangkut grup moderator, konfirmasi email ke moderator, izin pengguna untuk melaporkan, ijin moderator untuk mengedit profil pengguna, dan lain-lain.
   
8. Tab Connection berisi informasi pengaturan untuk membuat jaringan (koneksi) antar pengguna. Melalui sistem koneksi tersebut, dapat dipisahkan sesuai jenis koneksi, misal: pengguna IKC, pengguna PDII-LIPI, dan pengguna Pustekkom. Ini semacam jaringan antar pengguna. Sebagai gambaran, pengguna IKC dapat mengundang (invite) pengguna lain di luar IKC.
   
9. Tab Integration berisi informasi untuk mengatur koneksi versi terbaru (update) dari sistem komunitas yang digunakan. Pilih Manual jika tidak ingin memeriksa versi terbaru.
   

User Management
Tab ini berisi informasi pengguna, baik pengguna Front-end maupun Back-end. Informasi yang dapat ditampilkan antara lain nama pengguna, log in, group, dan lain-lain.

Tab Management
Pengaturan pada bagian ini menyangkut tentang posisi modul yang akan ditampilkan di halaman utama. Posisi Tab terdiri dari header, right, middle, dan tabmian. Plugin yang berwarna merah berarti perlu penambahan instalasi modul dan komponen lain. Oleh karena itu, sebelum mengaktifkan tab tersebut terlebih dulu harus menginstal plugin yang diperlukan. Untuk instalasi Simpleboard Forum akan dibahas pada bab lain dalam buku ini.

1. Pilih menu Components > Community Builder > Tab Management.
   
2. Baiklah, untuk mengetahui lebih jauh perlu dijelaskan beberapa fungsi masing-masing item tersebut.
   • Menu = ditampilkan di bagian atas (header). Posisinya dapat diatur, caranya: tekan link teks tersebut. Lalu aturlah pada bagian Position. Aturl pula hak akses untuk melihat menu tersebut.
   • Portrait = foto/gambar pengguna (dapat diganti sesuai keinginan. Posisi foto dapat diatur sesuai keinginan (administrator).
     
   • Article: jumlah artikel yang ditulis oleh pengguna. Posisi informasi artikel tersebut dapat pula diatur, umumnya berada di bagian bawah.
     
3. Untuk pengaturan Tab lain, bisa anda pelajari dan mencoba sendiri.

Artikel lanjutannya . . . . .
1. Tahap 3: Field Management
2. Tahap 4: Penerapan
3. Tahap 5: Plugin Manager

readmore »»  

Membangun Komunitas dengan Joomla! 1.0.x bagian 2 (Habis)

- bazComp share -

FIELD MANAGEMENT

Pada bagian ini, berisi informasi tambahan seperti  alamat website, alamat rumah, jabatan, no telp, no. Fax, dan lain-lain. Secara default, Tab informasi tambahan (additional info) berisi informasi seperti nampak pada gambar di bawah.

Beberapa hal yang perlu diperhatikan diantaranya: Required, dan Registered.

•    Required = apakah field tersebut harus diisi ketika orang melakukan registrasi
•    Registered = apakah field tersebut ditampilkan pada saat pertama kali orang melakukan registrasi
Membuat Tab baru
Kita dapat menambahkan field-field baru sesuai keinginan. Namun sebaiknya membuat Tab baru terlebih dulu agar informasi tambahan tersebut tidak menyatu dengan yang lain. Yang dimaksud Tab adalah seperti nambak pada gambar berikut.

1. Untuk membuat Tab baru, pastikan berada pada halaman Tab Management.

2. Selanjutnya, tekan tombol New Tab.

3. Masukkan judul Tab baru, dan deskripsinya. Jangan lupa, pada Publish diset Yes. Sedangkan untuk penempatan posisi Tab, bentuk tampilan dan hak akses pengguna bisa diatur di bagian bawah (tidak terlihat). Jika sudah selesai, klik tombol Save.

Membuat Field baru
Setelah membuat Tab baru, kini tinggal membuat field-field baru sesuai keinginan.

1. Pastikan sudah berada pada halaman Field Management, caranya dengan memilih menu Components > Community Builder > Field Management.

2. Klik tombol New Field.

3. Sebagai contoh, kita akan membut beberapa field tentang informasi tempat bekerja pengguna.
   a.    Nama Instansi
   b.    Alamat Instansi
   c.    Jabatan
   d.    No. Telp
   e.    No. Fax.
   f.    Website
   g.    Email
   h.    Pengalaman
4. Setelah menentukan field-field yang akan dibuat, langkah selanjutnya menentukan tipe field tersebut,  perhatikan keterangan berikut.
   a.    Nama Instansi = Text Field, Size = 25, Max Length = 40
   b.    Alamat Instansi = Text Area, Size = 20, Max Length = 75, Col = 20, Row = 2
   c.    Jabatan = Text Field, Size = 20, Max Length = 20
   d.    No. Telp = Text Field, Size = 20, Max Length = 10
   e.    No. Fax. = Text Field, Size = 20, Max Length = 10
   f.    Website = Web Address, Size = 20, Type = URL only
   g.    Email = Email Address, Size = 20, Max Length = 20
   h.    Pengalaman = Text Area, Size Size = 20, Max Length = 300, Col = 20, Row = 4
5. Agar lebih mudah dipahami, perhatikan gambar berikut ini.

6. Perlu diingat, ketika mengetikkan pada kolom Name (instansi) maka secara otomatis akan ditambahkan prefix cb_ sehingga namanya berubah menjadi cb_instansi. Langkah selanjutnya membuat field alamat instansi. Klik tombol New Field.

7. Untuk mengasah keterampilan Anda, silakan mencoba memasukkan field-field yang lain. Jika telah selesai dibuat, maka bentuknya seperti gambar berikut.

LIST MANAGER
Daftar anggota komunitas yang akan ditampilkan dapat diatur hak aksesnya. Jika hak aksesnya adalah Registered, artinya hanya diperuntukkan untuk pengguna yang sudah melakukan registrasi. Jadi, pengguna (Guest) tidak dapat melihat daftar anggota tersebut.
Setelah mengatur beberapa konfigurasi untuk user, interface, field, dan hal-hal lain yang berhubungan dengan komunitas, langkah selanjutnya menampilkan fasilitas tersebut di Frontpage (halaman depan) situs Anda.

1. Pertama kali, pilih menu Component > Communit Builder > List Management.

2. Secara default, hanya ada satu tampilan komunitas bernama Member List.

3. Editlah member tersebut dengan cara menekan teks Member List.

4. Pada bagian ini, dapat diatur judul komunitas (Title), group hak akses untuk melihat komunitas. Jika diset Everybody, setiap pengunjung dapat melihat anggotanya, namun tidak bisa melihat detail pengguna yang dimaksud. Pengunjung harus login atau registrasi terlebih dulu jika ingin melihat detail pengguna lain.

5. Pilihlah field-field yang akan ditampilkan pada kolom-kolom yang telah disediakan. Tombol di bagian atas, digunakan untuk menambahkan field-field di kolom 2. di bagian bawah, digunakan untuk menambahkan field-field di kolom 4.

6. Aturlah tiap kolom sesuai kebutuhan. Kolom 1 (column 1) posisinya  berada paling kiri.

7. Masukkan beberapa field untuk kolom 2.

8. Masukkan beberapa field untuk kolom 3.
9. Masukkan beberapa field untuk kolom 4.

10. Duplikasi (Copy) alamat link yang akan digunakan untuk melihat daftar anggota komunitas.

11. Simpan semua perubahan yang telah dibuat dengan cara menekan tombol Save di bagian atas.

12. Setelah yakin alamat link, ter-copy, saatnya meletakkan daftar komunitas tersebut. Tombol menu dapat diletakkan di bagian mainmenu, othermenu, maupun usermenu. Jika mengikuti petunjuk buku ini, letakkan pada top menu dengan cara memilih menu Menu > topmenu.

13. Klik tombol New.

14. Pilih Links, lalu pilih Link – Url.

15. Masukkan alamat URL yang telah di-copy sebelumnya pada kolom Link. Masukkan judul komunitas tersebut (misal: Komunitas) pada kolom Name.

16. Setelah selesai, klik tombol Save.

readmore »»  

Membuat Komentar dengan yvcomment untuk joomla 1.5

- bazComp share -

"Beginer only" (untuk para pakar mungkin sangat tidak berguna)

Berkomunikasi dengan pungunjung selain bisa membuat pengunjung lebih loyal kita juga bisa tahu apa yang diinginkan pengunjung seperti permintaan, saran dan keluhan. Salah satu cara berkomunikasi dengan pengunjung melalui menu  komentar. Saya akan coba membahas  bagaimana cara membuat menu kometar untuk joomla 1.5 dengan aplikasi yvcomment. berikut langkah langkahnya.
1. download yvcomment  disini
yang harus di install adalah plugin, commponent dan module nya
2. simpan di komputer anda
3. login ke menu administrator joomla anda. pilih menu extension dan lalu pilih instal / uninstall.
4. browse lokasi dimana anda menyimpan yvcomment  lalu install.
5. buat category dan section untuk komentar nya nanti
6. jika ingin pendatang ikut isi di menu komentar buat user dengan (nama : guest user sedangkan username: guest)
7.  pilih extention dan pilih plugin manager (sebenarnya silahkan atur sendiri apa yang ingin ditampilkan). contoh yang saya lakukan
Deskripsi     YVCOMMENT_DESCRIPTION
GLOBAL_YVCOMMENT_PARAMETERS    
USE_CONTENT_TABLE     Ya

USE_DESIGNATED_SECTION     Ya
SECTION_FOR_COMMENTS     (section yang anda buat)
CATEGORY_FOR_COMMENTS     (category yang anda buat)

SECTIONS_OF_ARTICLES     kosongkan
CATEGORIES_OF_ARTICLES     kosongkan
IDS_OF_ARTICLES     kosongkan
SECTIONS_OF_ARTICLES_EXCLUDE   Tidak

USE_CSS_FILE    
HIDE_TITLE     tampilkan
COMMENT_LINKABLE     comment_linkable_title
AUTHOR_MENTIONED_BY     Name
AUTHOR_LINKABLE     ya
EXECUTE_CONTENT_PLUGINS     Ya
JOOMLA_VERSION_WARNING      Ya


ALLOW_COMMENTS_ON_COMMENT     threadded comment
Editor     generik
USE_SMILEY_FORM     Ya
USE_BBCODE_FORM     Ya
ALLOW_HTML_EDIT_TEXT       tidak
MAX_CHARACTERS_FULLTEXT    
MIN_POST_PERIOD_USER    
AUTO_CLOSE_DAYS    
ADD_PUBLISHED      yesfor every body
NOTIFY_ADDEDIT_USERNAMES    
NOTIFY_ADDEDIT_AUTHORS  tidak   
DELETE_TO_TRASH     Tidak

ALLOW_GUEST_ADD     Ya
GUEST_USERNAME     guest
CHECK_GUEST_ALIAS     Tidak
GUEST_EMAIL_REQUIRED     Tidak
ALLOW_GUEST_LINK     Tidak
MIN_POST_PERIOD_GUEST    
USE_CAPTCHA                  Tidak
DELAY_CAPTCHA_IMAGE     Tidak
USE_OPENID              Tidak

PLUGIN_YVCOMMENT_PARAMETERS

POSITION_OF_COMMENTS_ARTICLE_VIEW below article box
WHAT_TO_SHOW_ARTICLE_VIEW     type_comment desc
POSITION_OF_COMMENTS_FRONTPAGE     below article box
WHAT_TO_SHOW_FRONTPAGE     comment n link
POSITION_OF_COMMENTS below article box   
WHAT_TO_SHOW      type_comment desc
SHOW_PLEASE_REGISTER     Tidak
ADDFORM_POSITION     position below
PRIMARY_ORDER     oldest first
SHOW_PAGINATION     tidak
8. pilih extention lalu pilih module manager
tampilkan judul : tidak
penempatan menu : pilih tidak ada
simpan
9. contoh situsnya http://wakakak.net
10. info lebih lengkap disini
11. smoga bermanfaat

readmore »»  

Memanfaatkan jQuery Magnifyer Pada Joomla

- bazComp share -

Sebuah gambar pada suatu situs, bisa dikatakan penting untuk memperjelas isi dari tulisan/ artikel pada situs tersebut. Tentunya gambar yg disisipkan harus bisa dilihat jelas. Kalo disisipkan dengan ukuran sebenarnya misal 800 x 600 px ato 480 x 640px, artikel akan dipenuhi oleh gambar, tulisan nya jadi tersisihkan. Untuk mengatasinya ukuran gambar diperkecil, masalah baru timbul, gambar jadi kurang jelas.

Solusinya mungkin dibuat hyperlink dari image tersebut ke ukuran yang sebenarnya. Misalkan ukuran gambar di artikel 150 x 100 px, dibuat link untuk membuka jendela baru/ popup windows dengan ukuran 480 x 640px. Cara ini cukup membantu, saya sendiri pernah menggunakannya. Tetapi setelah diperhatikan kayanya kurang menarik.

Akhirnya setelah berkunjung ke http://www.dynamicdrive.com , ada sebuah cara untuk memperbesar image (Image Magnify) dengan memanfaatkan jQuery Image Magnify. Caranya cukup mudah, tinggal kita menambahkan jquery.magnifyer.js dan sedikit menambahkan kode kelas pada image yg kita sisipkan.

Siapkan dulu file-file yang diperlukan yaitu jquery.magnifyer.js yang bisa diunduh di sini. Kemudian untuk kursornya (buat browser IE) di sini.

Inilah langkah-langkahnya:

1. Buka file index.php yg ada pada template aktif, sisipkan perintah berikut di antara tag untuk meload skrip javascript.
   
   
   /templates/template;?>/js/jquery.magnifier.js">
   Setelah itu simpan, kemudian tutup template editor.
2. Buka artikel yang terdapat image-nya. Aktifkan image yang akan kita magnify dengan cara di klik. Kemudian klik ikon insert/ edit image untuk membuka kotak dialog setingan image.
   
   

Ada tiga tab yg perlu kita isi yaitu general, appereance, advanced.

1. Pada tab general alamat image udh terisi, karena kita bukan mau menyisipkan image, tapi mau merubah properti image.
   
   
2. Jadi kita langsung ke tab kedua (appearance), terdapat beberapa parameter. Tetapi yg penting adalah: Class, kita isi dengan magnify. Parameter yg lain seperti posisi gambar, ukuran, spasi vertikal dan horizontal terserah
   
   
   
   
   
   Tab advanced tidak perlu dibuka, langsung aja klik update
   
3. Kita coba buka (preview) situs kita, dekatkan mouse ke atas image yg sudah diedit, kalo kursor mouse berubah jadi (+) langsung klik (Untuk IE sama Chrome kadang gak berubah). Klo gambar jadi membesar berarti sudah sukses.
4. Ulangi langkah 1 – 4 untuk gambar yang lain. Untuk melihat hasilnya bisa lbuka di sini.

Cara ini mungkin kurang praktis juga, cuma baru itu saja yang bisa saya tulis. Mungkin ada Joomlaers yang bisa membuatnya jadi plugin atao component sehingga jadi lebih praktis.

readmore »»  

Membuat link / URL pada module title Joomla.

- bazComp share -

Bagaimana membuat title module (judul module) pada joomla site kita bisa memiliki link / URL dan bisa diklik ? Berikut ini jawabannya :)
Secara keseluruhan yang saya amati pada joomla (baik itu versi 1.0.X maupun 1.5.X), ternyata masih memiliki satu kekurangan, yaitu pada judul module (module title text) hanya menjadi indikator module saja, tidak bisa diklik (menjadi link URL).

Untuk bisa membuat module joomla memiliki link URL pada title module-nya, maka kita perlu melakukan modifikasi langsung ke joomla-nya. Cara ini saya sebut "Core Hack" joomla :) Berikut ini langkah-langkah modifikasinya.

Untuk yang menggunakan Joomla versi 1.0.X :
1. download file "includes/frontend.html.php" dari joomla site anda
2. Gunakan text editor, Open / buka file "frontend.html.php" tersebut
3. Scroll ke baris #303 (bagian dari function "modoutput_table"), replace / timpa baris code berikut :

[start tag php] echo htmlspecialchars( $module->title ); [end tag php]

dengan code berikut ini (copy & paste) :

[start tag php] $linkurl = $params->get( 'titleurl','' ); $target_url = $params->get( 'titleurl_target','_self' ); if ($linkurl!="") echo ""; echo htmlspecialchars( $module->title ); if ($linkurl!="") echo ""; [end tag php]

5. Scroll ke baris #365 (bagian dari function "modoutput_xhtml"), replace / timpa baris code berikut :

[start tag php] echo htmlspecialchars( $module->title ); [end tag php]

dengan code berikut ini (copy & paste) :

[start tag php] if ($linkurl!="") echo ""; echo htmlspecialchars( $module->title ); if ($linkurl!="") echo ""; [end tag php]

6. Scroll ke baris #401 (bagian dari function "modoutput_rounded"), replace / timpa baris code berikut :

echo "[start tag h3]" . htmlspecialchars( $module->title ) . "[end tag h3]";

dengan code berikut ini (copy & paste) :

$linkurl = $params->get( 'titleurl','' ); $target_url = $params->get( 'titleurl_target','_self' ); echo "[start tag h3]"; if ($linkurl!="") echo "[tag a href='" . $linkurl . "' target='" . $target_url . "']"; echo htmlspecialchars( $module->title ); if ($linkurl!="") echo "[end tag a] "; echo "[end tag h3]";

7. Simpan / Save modifikasi yang anda lakukan pada file "frontend.html.php".
8. Tutup text editor yang anda gunakan.
9. Upload file "frontend.html.php" ke dalam folder "includes" dari Joomla site anda.


Untuk yang menggunakan Joomla versi 1.5.X :
1. Anda bisa mengedit file "[nama template]/html/modules.php", sesuai dengan template default yang anda gunakan di Joomla site anda.
2. Gunakan text editor, temukan code berikut ini :

function [nama_fungsi]($module, &$params, &$attribs) {

3. sesudahnya tambahkan code berikut ini :

$linkurl = $params->get( 'titleurl','' ); $target_url = $params->get( 'titleurl_target','_self' );

4. Temukan code berikut ini :

$module->title

5. Replace / Timpa dengan code berikut :

($linkur!="" ? "[tag a href='".$linkurl."' target='".$target_url."']".$module->title. "[end tag a] " : $module->title)

Beres ?? Nanti dulu :)

Sekarang untuk bisa menampilkan efeknya pada Joomla site, file XML dari module yang kita gunakan di joomla perlu ditambahkan 2 (dua) parameter berikut ini :

[start tag param name="titleurl" type="text" default="" label="Title URL" description="Put http link address here" ] [start tag param name="titleurl_target" type="list" default="_self" label="Title URL target" description="Choose open target"] [start tag option value="_self">Self[end tag option] [start tag option value="_parent">Parent[end tag option] [start tag option value="_blank">Blank[end tag option] [end tag param]

Reupload kembali file XML dari module-nya, lewat Backend Administrator melalui "Module Manager", kita edit kembali module-nya, isi 2 parameter berikut :
a. Title URL (berisi link / URL yang ingin anda referensikan pada title modulenya)
b. Title URL target

Sekarang semua module title di Joomla site anda telah memiliki link (bisa diklik :)

Contoh sederhana implementasi module link title ini bentuk "live"-nya bisa dilihat di : http://news.tpi.tv
Pada semua title modulenya di situ diterapkan link yang terhubung langsung ke Blog Category tertentu.

Semoga Bermanfaat :)

readmore »»