Latest Posts

Friday, June 19, 2015

Membuat Member Card Menjadi Vertikal [ Portrait ] & Memodifikasi Tampilannya | SLiMS 7 [ Cendana ]

  



[ Latest update, 10 June 2015 ]

Ada permintaan dari seseorang ( klien ) yang ingin sekali membuat Kartu Anggota [Member Card] Perpustakaannya dapat di cetak seperti model vertikal [Portrait] ID Card karyawan, memang idenya adalah menjadikan kartu anggota perpustakaan tsb juga sebagai kartu identitas karyawan, memang lebih efisien dan menjadi multifungsi. Perpustakaannya sudah memakai library system management memakai open source software yang berbasis web yaitu SLiMS.

Saya mendalami dahulu pengetahuan tentang modifikasi Member Card SLiMS terutama versi 7 Cendana, setelah googling dapatlah beberapa referensi sebagai berikut :

Kustomisasi Kartu Anggota SLiMS 5
Kostumisasi Member Card Versi Tegak (seri ke-3) - SLiMS 5 Meranti
Modifikasi Kartu Anggota SLIMS (Senayan versi 3.14)

Dari referensi diatas saya mendapatkan petunjuknya, jadi untuk dapat melakukan modifikasi member card ini ada 2 buah file yang harus saya oprek kodenya yaitu :
  1. member_card_generator.php, yang berada di direktori admin/modules/membership
  2. printed_settings.inc.php, yang berada di direktori admin/admin_template
Set ulang juga konfigurasi membercard di Menu Keanggotaan > Kartu Anggota > Setting [ Icon Kunci Pas ] di sebelah kanan atas.

Dan juga mempersiapkan beberapa file pendukung seperti : background membercard vertikal blue-bg.jpg, header sebagai penganti logo header_40x200.png, 1 foto karyawan staff_1.jpg.

N.B.
--  Modifikasi kode dari kedua file php diatas dilakukan secara manual, lumayan rumit dan perlu ketelitian.
-- File lain seperti membercard_background_default.jpg, signature.png, stamp.png tidak saya gunakan.

Singkat cerita dibawah ini link download 2 file yang sudah saya modifikasi ulang, silahkan di download :

1. member_card_generator.php. [ Download ]
2. printed_settings.inc.php. [ Download ]

Berikut langkah-langkah penerapannya sebagai berikut :


  1. Backup kedua file diatas, lebih mudah kalau pakai slims yang portable atau slims yang di instal mengunakan xamp server atau wamp server di windows, tinggal copy paste lalu di rename misalnya menjadi member_card_generator.php.default dan printed_settings.inc.php.default.
  2. namun kalau slims sudah di hosting di webserver, dalam kasus saya webserver Debian 7 [Wheezy], di direktori /var/www/e-library maka gunakan command ini,
    root@webserver: cp /var/www/e-library/admin/modules/membership/member_card_generator.php /var/www/e-library/admin/modules/membership/member_card_generator.php.default
    dan
    root@webserver:cp /var/www/e-library/admin/admin_template/printed_settings.inc.php /var/www/e-library/admin/admin_template/printed_settings.inc.php.default

  3. Replace kedua file tersebut dengan kedua file yang saya berikan diatas, di download dahulu kemudian tinggal copy paste timpa file yang lama.

  4. Kalau pada hosting, webserver Debian tinggal di replace mengunakan WinSCP atau FileZilla dsb, kalau pakai editor nano dsb akan sulit karena kodenya panjang. Copy paste juga file background membercard yang model vertikal blue-bg.jpg, dalam kasus saya bersama header_40x200.png transparan (mengantikan file logo).

  5. Atur ulang di bagian Keanggotaan > Kartu Anggota > Setting. Seperti Box width : 5.4, box height : 8.6 beserta pengaturan lainnya yang diperlukan, disesuaikan saja, lalu simpan.

  6. Setting ID Card

    Setting 01

    Setting 02

    Setting 03
    Pada kolom Peraturan copy dan paste kode berikut, kemudian sesuaikan saja,

    <center>N.B. Please return this card to us if you found it.</center>


    Pada kolom Alamat copy dan paste kode berikut, kemudian disesuaikan juga,

    <div style="background-color: white; box-shadow: 6px 6px 3px #888888; font-family: courier;"> <br /> <center><b>SMAN Sumatera Selatan</b><br />Jl.Pangeran Ratu RT.11 RW.08<br /> Kel.08 Ulu Kec.Seberang Ulu I<br />Palembang 30252<br />Telp.(0711)7539549<br /><br />Website: http://smansumsel.sch.id<br />e-Mail : info@smansumsel.sch.id</center> <br /> <br /></div>


  7. Jika telah selesai, di coba Print [ akan ada Print Preview ], jika belum berhasilnya ulangi langkah nomor 3 diatas di kustomisasi lagi hingga hasilnya menjadi seperti gambar dibawah ini.

Print Preview Membercard SLiMS

ID Card Karyawan + Membercard Perpustakaan
Contoh Background Membercard
Contoh header penganti logo


[ Update 10 Juli 2015 ]
ID Card Staf + Member Card Library
ID Card Staf + Member Card Library



Tugas berhasil dan klien pun senang :)

Tips. Kedua file hasil modifikasi saya diatas bisa dipelajari secara mandiri dengan cara membandingkannya dengan file yang asli (sebelumnya), edit saja kode-kodenya bila perlu beri tanda comment [ /* & */ ] pada suatu baris kode lalu simpan & reload Print Preview Membercard-nya. Hasil akhir tampilan Membercard bisa anda desain sendiri sesuai selera, apalagi ditambah dengan keahlian photoshop/ coreldraw yang baik.

Selamat Mencoba!

6 comments:

  1. mau tanya ni kang ,, koq alamat ma no tlpn jadi kocar kacir,, mohon bantuan buat edit scriptnya ,, terima kasih

    ReplyDelete
    Replies
    1. anda Sii Lupii (id fb) ya? :)

      maaf baru ingat sebelumny sy sudah balas via komen fb ya, ini cara alternatifnya

      1. Login ke SLiMS > Keanggotaan > Kartu Anggota > klik pada setting icon kunci pas.
      2. Masukan kode berikut pada bagian address,
      <center><b>SMAN Sumatera Selatan</b><br />Jl.Pangeran Ratu RT.11 RW.08<br /> Kel.08 Ulu Kec.Seberang Ulu I<br />Palembang 30252<br />Telp.(0711)7539549<br /><br />Website: http://smansumsel.sch.id<br />e-Mail : info@smansumsel.sch.id</center>

      3. Sesuaikan dengan alamat instansi anda.

      btw nanti sy update artikel ini agar semakin mudah dimengerti. :write:

      Delete
    2. Mlm Bang...mf ganggu..mw tanya.. Dikartu member slims7 ada ikon image (retak) setelah saya ganti logo_y dengan instansi saya..kenapa ya??

      Delete
    3. saat ganti logonya apakah anda rename jg nama logonya? jika iya maka ada pengaturan yg harus di sesuaikan.

      Delete
    4. masih berhubungan image retak pada logo, tanda tangan, stempel dan juga photo, bagaimana cara menghilangkan image retaknya?? tolong donk jawabannya segera bang andi...

      Delete
    5. Ini untuk mengatasi masalah image retak > http://www.bangandi.web.id/2015/09/bagaimana-cara-menghilangkan-broken.html

      Delete
N.B.
1. Berkomentarlah dengan sopan.
2. Dilarang membuat spam, terutama yang mengandung SARA/ Pornografi/ Judi dan Iklan.

Emoticon : Untuk menyisipkan emoticon dalam komentar, silahkan klik pada emoticons icon yang tersedia dibawah ini untuk melihat kodenya lalu tinggal di copy dan di paste [ sisipkan ] kodenya ke dalam komentar.