0
Tải bản đầy đủ (.doc) (44 trang)

Thiết kế website

Một phần của tài liệu TÌM HIỂU VỀ HTML5 VÀ CSS 3, ỨNG DỤNG ĐỂ VIẾT MỘT WEBSITE ĐƠN GIẢN (Trang 32 -44 )

Sử dụng open source joomla (phiên bản 1.5) để làm website tin

tức.

Các bước chuẩn bị:

Host: Nơi đặt Web Site, trong đề tài Web Site sẽ được đặt trên

Tạo Database: Tạo cở sở dử liệu cho Web Site Cài đặt Joomla!:

Download và cài đặt Joomla! 1.5

Cài ngôn ngữ tiếng Việt: Download và cài đặt ngôn ngữ tiếng Việt

Joomla! 1.5

Cấu hình: Thiết lập các thông số cho Web Site trong Global

Configuration

 Đăng nhập vào Admin (Back-end)

1.Tạo các cấp lưu trữ nội dung cho từng chủ đề:

Có thể xóa các Section, Category và các Content Item mẫu có sẵn

trong Joomla! hoặc đổi tên để sử dụng lại.

Tạo Section: Chọn Content -> Section Manager để tạo các phần

chính cho Web Site, có thể sửa lại các các Section có sẵn hoặc tạo

thêm cái mới.

Chọn New để tạo các Section Tin trong nước, Tin thế giới, Tin thể

thao...

Tạo Category: Chọn Content -> Category Manager để tạo các

mục phụ cho Web Site, có thể sửa lại các các Category có sẵn hoặc

tạo thêm cái mới.

Chọn New để tạo các Category Xã hội, Kinh tế, An ninh trong phần

(Section) Tin trong nước, Tin thế giới, và Category Trong nước,

Chọn Menus -> mainmenu -> New -> Articles -> Section Blog

Layout

Các Menu còn lại nếu muốn có thể sử dụng còn không thì xóa đi

bằng cách chọn các Menu muốn xóa và nhấn vào nút Trash.

Tạo Menu phụ (Sub Menu):

- Chọn Menus -> mainmenu -> New -> Articles -> Blog - Content

Category

Tạo thêm các Sub Menu khác với các lựa chọn Blog – Content

Category trong đó CategoryParent Item tương ứng với các

SectionCategory của nó.

Sau khi tạo xong các Menu có thể sắp xếp lại theo thứ tự như ý bằng

cách đánh số thứ tự trong mục Order và nhấn vào biểu tượng dĩa mềm

để Save hoặc cũng có thể dùng các nút mũi tên lênxuống để sắp

xếp.

3. Tạo phần liên hệ (Contact):

Chọn Components -> Contacts -> Manage Contacts -> chọn

Contact mẫu có sẵn hay tạo mới bằng cách nhấn New.

Nhập địa chỉ Email vào mục E-mail, đây là địa chỉ được hiển thị

trong phần người gửi và người nhận sẽ trả lời lại cho địa chỉ này.

Nhập đầy đủ các thông tin trong các mục khác của phần này nếu

muốn hoặc có thể bỏ bớt các mục này bằng cách chọn Tab

Parameters và chọn Hide các mục này. Nhấn Save để hoàn tất.

4. Tạo bài viết mới

- Chọn content -> Article Manager – New

+ Title: Tiêu đề của bài viết

+ Section: Lựa chọn chuyên mục

+ Category: Lựa chọn chuyên mục con

- Ngoài ra còn có các chức năng như Published, Front Page lần lượt là

đã được phê duyệt và hiển thị trên trang chủ


II. Đăng bài viết có sử dụng các thẻ HTML5 và CSS3:

Ví dụ về thẻ HTML5:

- Ví dụ 1: Thẻ video

- Với thẻ video của HTML5, người sử dụng có thể xem video ngay lập

tức mà không cần cài thêm bất kỳ phần hỗ trợ nào cả!

Ví dụ 2: Thẻ <table>:

 Ta được kết quả:

Ví dụ về thẻ CSS3:

- Ví dụ 1: Thẻ DIV

Chương 4

Kết luận và hướng phát triển

I. Kết quả đạt được:

1. Trang chủ của ứng dụng:

3. Trang thêm bài viết mới:

Một phần của tài liệu TÌM HIỂU VỀ HTML5 VÀ CSS 3, ỨNG DỤNG ĐỂ VIẾT MỘT WEBSITE ĐƠN GIẢN (Trang 32 -44 )

×