Thiết kế website bằng phần mềm Adobe Dreamweaver CS5 - Phần 3

Phần 3 sẽ giới thiệu đến các bạn cách tạo một template, đây là một trang không thể thiếu trong việc thiết kế website bằng Dreaweaver, vì nó giúp tạo ra một cấu trúc nhất quán cho cả hệ thống website và thay đổi cấu trúc này dễ dàng, nhanh chóng hơn...

11. Cách tạo Template

Hình 20. Chọn thư mục lưu trữ Website

Sau khi khai báo xong chọn Save và bắt đầu tạo template. Khi xác định thành phần nào trong web là không thay đổi, bạn sẽ tạo trang web với những thành phần đó, sau đó chọn File > Save as Template.

Ngoài ra, bạn cũng có thể tạo ra một template từ một trang web đã thiết kế trước đó bằng cách mở trang web đó lên bằng Dreamweaver, tiến hành khai báo Site mới cho trang web đó và chọn File > Save as template. Sau đó đặt tên cho template vừa tạo.

Tiếp theo, bạn xác định các vùng có thể thay đổi được như sau:

- Chọn vùng có thể thay đổi được bằng cách bấm chuột vào bảng của vùng đó (vùng được chọn sẽ có viền màu đen đậm bao quanh).

-  Chọn Insert > Tenplate > Editable Region (hình 21).

Hình 21. Chọn vùng thay đổi trên template

-  Đặt tên cho vùng vừa chọn và bấm OK trong cửa sổ tiếp theo.

Cuối cùng, chọn File > Save để lưu lại trang template vừa tạo.

12. Tạo trang web mới từ template

Bây giờ, bạn có thể tạo ra trang web đầu tiên từ template vừa tạo.

Chọn File > New. Trong cửa sổ hiện ra, chọn Page from Template và chọn File Template vừa tạo sau đó bấm nút Create (hình 22).

Lưu ý, các tập tin tạo ra từ template chỉ có thể soạn thảo ở vùng Editable Region mà bạn đã chọn lúc tạo template. Còn các vùng khác thì sẽ không được phép thay đổi.

 

Hình 22. Tạo trang web mới từ template

Ngoài ra , khi đã tạo xong template với đầy đủ nội dung và liên kết thì bạn lưu thay đổi trên template này. Dreamweaver sẽ xuất hiện hộp thoại nhắc nhở có muốn cập nhật thay đổi  trên các trang dùng template này hay không, bấm Update để cập nhật.

13. Đưa website lên hosting

Sau khi đã hoàn tất việc thiết kế một trang web, bạn tiến hành đưa trang web lên mạng Internet để thử nghiệm và chia sẻ thông tin. Đối với trang web thiết kế bằng Dreamweaver trong loạt bài này, để đưa website lên mạng bạn làm như sau.

Dùng phần mềm FileZilla FTP Client đưa trang web lên hosting. Khởi động FileZilla FTP Client nhập các thông tin cần thiết để kết nối với hosting.  Trong cửa sổ chương trình có 4 khung chính như hình 23

Hình 23. Cửa sổ chương trình FileZilla

- Trong khung số 1, tìm đến đường dẫn chứa bộ web (trong hình là thư mục Web server).

- Trong khung số 2, tìm và duyệt đến thư mục htdocs (đối với byethost) hoặc thư mục public_ html đối với 000webhost,….

- Trong khung thứ 3, lần lượt bấm chuột phải vào từng tập tin, thư mục (hoặc bấm Ctrl + A để chọn tất cả) và chọn Upload.

Đợi cho chương trình tải toàn bộ trang web lên hosting. Thời gian nhanh hay chậm tùy theo dung lượng tập tin, số lượng tập tin cần tải lên nhiều hay ít. Lưu ý, đối với Byethost thì có nhiều thư mục htdocs, bạn phải duyệt đến thư mục htdocs nằm trong thư mục tên miền và tập tin index.html phải nằm trong thư mục htdocs.

Sau khi chương trình tải xong, bạn mở trình duyệt lên và nhập vào địa chỉ web đã đăng ký, sẽ thấy được thành quả lao động của mình.

Sưu tầm