Professional Documents
Culture Documents
<position>vinaora_new_position</position>
Trong đó thuộc tính "style" có thể là: rounded, none, table, horz, xhtml, outline
Trong đó tham số thứ hai của hàm mosLoadModules là một trong 5 số nguyên: 1 =
horizontal, 0 = normal, -1 = raw, -2 = XHTML và -3 = extra divs.
Keyword:
• module, vị trí, template
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 đây
Chú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:
• joomla, template
• thiết kế, trang chủ, 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:
<jdoc: include type="modules" name="left" style="...." />
Chú ý: Tất cả các module bên phải đều sử dụng duy nhật một đoạn mã sau:
<jdoc: include type="modules" name="right" style="...." />
Keyword:
• joomla, template, module
• thiết kế, trang chủ
Bước 3.1:
Mở thư mục [Joomla]/templates và tạo một thư mục có tên là "vinaora_template"
Bước 3.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ước 3.3:
Mở file "templateDetails.xml" và gõ vào nội dung sau:
Hoặc copy đoạn mã sau:
Bước 3.4:
Mở file "index.php" và gõ vào nội dung sau:
Keyword:
• joomla, template
• thiết kế, trang chủ
Bước 4.1: Đăng nhập vào trang quản trị (VD: http://vinaora.com/administrator)
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ế, trang chủ
<html>
<head>
<title>WELCOME TO VINAORA.COM</title>
</head>
<body>
<div id="top">|-TOP-|</div>
<hr />
<div id="user3-user4">
<div id="user3" style="float:left; width:350px;">|-USER3-|
</div>
<div id="user4">|-USER4-|</div>
</div>
<hr />
<div id="main">
<div id="left" style="float:left; width:150px;">|-LEFT-|
</div>
<div id="component" style="float:left; width:400px;">|-
COMPONENT-|</div>
<div id="right">|-RIGHT-|</div>
</div>
<hr />
<div id="footer">|-FOOTER-|</div>
</body>
</html>
Keyword:
• joomla, template, layout, div, module, modules, component, user, head, jdoc,
include
• thiết kế, thẻ, phần tử, giao diện, dàn trang
Bây giờ hãy mở file "index.php" của template và nhúng vào các đoạn mã của Joomla!
<html>
<head>
<jdoc:include type="head">
</head>
<body>
<div id="top"><jdoc:include type="modules" name="top" /></div>
<hr />
<div id="user3-user4">
<div id="user3" style="float:left; width:350px;">
<jdoc:include type="modules" name="user3" />
</div>
<div id="user4"><jdoc:include type="modules"
name="user4" /></div>
</div>
<hr />
<div id="main">
<div id="left" style="float:left; width:150px;">
<jdoc:include type="modules" name="left" />
</div>
<div id="component" style="float:left; width:250px;">
<jdoc:include type="component" />
</div>
<div id="right"><jdoc:include type="modules"
name="right" /></div>
</div>
<div style="clear:both;"></div>
<hr />
<div id="footer"><jdoc:include type="modules" name="footer"
/></div>
</body>
</html>
Keyword:
• joomla, template, layout, div, module, modules, component, user, head, jdoc,
include
• thiết kế, thẻ, phần tử