Hướng dẫn thiết kế template joomla 1.5

Trước khi tìm hiểu về template Joomla chúng ta cần phải phân biệt rõ sự khác nhau giữa 2khái niệm module và component và vị trí xuất hiện của chúng trong template. Trong hình vẽsau, bạn hãy chú ý các khối được đánh dấu màu da cam. Chúng mô tả các vị trí của modulevà component mà template này cung cấp.
Nội dung trích xuất từ tài liệu:
Hướng dẫn thiết kế template joomla 1.5 Thiết kế Template cho Joomla 1.5 (phần 1 - giới thiệu)User Rating: / 16PoorBest Written by VINAORA Sunday, 16 December 2007 00:13 Phần 1: Căn bản về vị trí các module và component Trước khi tìm hiểu về template Joomla chúng ta cần phải phân biệt rõ sự khác nhau giữa 2 khái niệm module và component và vị trí xuất hiện của chúng trong template. Trong hình vẽ sau, bạn hãy chú ý các khối được đánh dấu màu da cam. Chúng mô t ả các v ị trí c ủa module và component mà template này cung cấp. Chú ý: Trên một trang bất kỳ các module có thể có nhiều (cả về s ố l ượng và v ị trí) hoặc không có module nào nhưng luôn có duy nhất một component (trừ 1 vài trường h ợp đặc bi ệt) Làm thế nào để biết template đang sử dụng cho phép những vị trí nào? Thật đơn giản, bạn chỉ cần đăng nhập vào trang quản trị (VD: http://vinaora.com/administrator). Sau đó, mở menu Extension >>> Modules Manager bạn sẽ trông thấy các vị trí có thể dùng được trong danh sách có dòng chữ Select Position như hình dưới đâyChúng ta hãy quay trở lại trang chủ Joomla và bạn sẽ nhận th ấy rằng, các module, component đã được bố trí như sau: Keyword: • template, thiet ke, component, module, vị trí Phần 2: Tìm hiểu về vị trí của các module khi viết mãChúng ta cần xem xét những đoạn mã nào đã t ạo ra các vị trí dành cho module và component. Bạn hãy quan sát hình sau:Chú ý: Tất cả các module bên trái đều sử dụng duy nhật một đoạn mã có dạng như sau:Chú ý: Tất cả các module bên phải đều sử dụng duy nhật một đoạn mã sau: Keyword: • Joomla, template, module, component Phần 3: Tạo những file cơ bản cho template Bước3.1: Mở thư mục [Joomla]/templates và tạo một thư mục có tên là vinaora_template Bước3.2:Mở thư mục vinaora_template vừa tạo ở trên và tạo 2 file có tên là: index.php và templateDetails.xml Bước3.3: Mở file templateDetails.xml và gõ vào nội dung sau: Hoặc copy đoạn mã sau:vinaora_template1.0.012/12/07VINAORA admin@vinaora.com http://vinaora.comGNU/GPLTPL_VINAORA_TEMPLATEindex.phptemplateDetails.xmlbreadcrumbsleftrighttopuser1user2user3user4footerdebugsyndicate Bước3.4: Mở file index.php và gõ vào nội dung sau: Keyword: • Joomla, template, templates, templateDetails Phần 4: Kích hoạt Template mới tạo Để kích hoạt Template vừa tạo mới, bạn thực hiện các bước sau: Bước 4.1: Đăng nhập vào trang quản trị (VD: http://vinaora.com/administrator) Bước 4.2: Mở menu Extensions >>> Template Manager Bước 4.3: Chọn template vinaora_template mà bạn mới tạo Bước 4.4: Nhấn nút [Default] trên thanh công cụ để kích hoạt vinaora_template làm template mặc định. Bước 4.5: Mở trang chủ và kiểm tra xem template mới đã được nạp chưa. Keyword: • joomla, template, thiết kế template Phần 5: Tạo Layout Bước5.1:Phácthảotrêngiấyvềbốcục(layout)củatemplate. Giả sử chúng ta có giao diện với layout như sau: Bước5.2:ViếtmãHTMLđểtạolayoutnóitrên.Trước đây người ta hay sử dụng kỹ thuật dàn trang bằng bảng (dùng thẻ ). Việc dàntrang bằng bảng có ưu điểm là dễ làm nhưng lại có nhược điểm là t ốc độ nạp trang ch ậm và không tối ưu cho các máy tìm kiếm. Do vậy ngày nay chúng ta sử d ụng k ỹ thuật dàn trang bằng thẻ . Mở file index.php của template vinaora_template và gõ vào nội dung sau: Hoặc copy đoạn mã sau:WELCOME TO VINAORA.COM|-TOP-||-USER3-||-USER4-||-LEFT-||-COMPONENT-||-RIGHT-||-FOOTER-| Bước5.3:Kiểmtralạilayout Mở trang web và xem template vừa được tạo. Phần 6: Nhúng mã của Joomla! Joomla! xây dựng một loại thẻ riêng cho việc thiết kế Template, đó là th ẻ . Thẻ được dùng để nạp các phần tử riêng biệt của Joomla, chẳng h ạn nh ư: Nạp phần Head, nạp các Module, nạp các Component. Thẻ này được khai báo như sau: Bây giờ hãy mở file index.php của templat ...