Jumat, 01 Juni 2012

Belajar Prestahop Template

Prestashop merupakan salah satu CMS online shop yang cukup popular di dunia.

Sayangnya, tidak banyak di luar sana developer dan programmer yang bersedia memberikan template prestashop yang indah dan banyak fitur secara cuma-cuma. Sehingga, kebanyakan orang menggunakan template defaultnya begitu saja.

Template default prestashop tidak buruk, tetapi juga tidak terlalu bagus tentunya.

Template prestashop disebut sebagai "Themes".

Menambahkan themes prestashop tidak sulit, cukup dengan menaruh folder themes-nya di dalam folder atau direktori:
home\themes\
dimana home adalah direktori di mana prestashop di-install.

Themes default prestashop memiliki folder sbb:
home\themes\prestashop


Secara struktur, di dalam themes prestashop berisi file-file template (.tpl), image files (.gif, .jpg, .png) file CSS, dan file-file Javascript seperti berikut:
\cache
\css
\img
\js
\lang
\modules
404.tpl
category.tpl
header.tpl
footer.tpl
dan file-file .tpl lainnya.


Sebuah theme memiliki file gambar bernama preview.jpg pada foldernya, yang memungkinkan preview dari back-office.

Folder /css berisi file css.
Folder /img berisi file gambar.
Folder /js berisi file-file javascript.
Folder /lang berisi file-file themes translation. Permission di file ini harus 666, supaya back-office dapat membaca dan menulisnya.
Root file berisi TPL files dan file preview.jpg.

File-file tpl biasanya merupakan file-file berbahasa html, php dan sedikit beberapa script khusus
Prestashop untuk memanggil modul, nama website, dan lain-lain. Script khusus Prestashop diawali dan diakhiri dengan tanda kurawal seperti berikut.
{include file="$tpl_dir./breadcrumb.tpl"}

Utk cheatsheet script prestashop, dapat di-download di sini:
Prestashop Cheat Sheet

atau dapat dipelajari di dokumentasi prestashop seperti ini:
http://doc.prestashop.com/display/PS14/Cheat-sheet+-+Concepts+outlined+in+this+tutorial


Website-website reference saya:
General:
http://doc.prestashop.com/display/PS14/Coding+a+theme
Membuat Hook baru dalam Prestashop
http://www.justwebdevelopment.com/blog/add-new-hook-in-prestashop/
// Sementara sampai disini dulu dokumentasi saya.




Tidak ada komentar: