Thiết kế web với DotNetNuke 5.x Khoa CNTT - Trường Cao đẳng nghề Đà Lạt
Phạm Đình Nam Trang 80
BÀI 4: SỬ DỤNG CÁC MODULE
I. Sử dụng module Text/HTML
Module Text/HTML là "Swiss Army Knife" của module. Nó cung cấp một trình
soạn thảo WYSIWYG để tạo ra một nội dung của chính bạn bằng HTML hoặc là văn
bản thuần túy. Giao diện module tương tự như một trình biên tập document phổ biến
và rất dễ làm.
Dùng những gì mà bạn đã học ở trong phần thêm module vào trang để thêm một
Text/HTML mới vào trang của bạn.
Các bước để soạn thảo văn bản(đơn giản)
Module ban đầu bạn tạo ra không có nội dung. Nó chỉ hiển thị một Container
trống, với Title và Action Buttons.
1. Nhấp vào nút Edit Text (hoặc chọn Edit text từ Module Actions Menu).
Trên trang Edit Text/HTML bạn sẽ thấy rằng bạn (mặc định) đang sử dụng “Rich
Text Editor” trong mẫu thiết kế. Nó sẽ cung cấp cho bạn một ý kiến tốt nhất để khi
mà bạn hoàn thành thì nội dung sẽ như thế này.(WYSIWYG = “ What you see is what
you get”).
Thiết kế web với DotNetNuke 5.x Khoa CNTT - Trường Cao đẳng nghề Đà Lạt
Phạm Đình Nam Trang 81
II. Sử dụng module thông báo
Module thông báo đưa ra một danh sách các đoạn thông báo đơn giản bao gồm tiêu
đề và những hướng dẫn ngắn gọn. Nó rất thuận tiện để những người truy cập website
nhận biết được các mục quan tâm khi có liên kết những thông tin thêm vào.
Dùng những gì bạn đã học trong thêm module vào trang để thêm module thông
báo vào trang của bạn.
Các bước để thêm thông báo mới
Module của bạn được tạo ra lúc ban đầu thì không có nội dung. Nó chỉ hiển thị
một Container trống, với Title và Action Buttons.
1. Nhấp vào Add New Announcement (hoặc chọn Add New Announcement từ
Module Actions Menu).
Trên trang Edit Announcements bạn sẽ thấy rằng có một vài vùng bạn cần phải
điền vào trình văn bản WYSIWYG như lúc sử dụng cho module Text/HTML.
Thiết kế web với DotNetNuke 5.x Khoa CNTT - Trường Cao đẳng nghề Đà Lạt
Phạm Đình Nam Trang 82
2. Đặt con trỏ chuột vào vùng Title và nhập vào đó một câu lệnh ngắn gọn để tóm
tắt thông báo của bạn. Tùy chọn, đánh vào hộp Add Date để nối dữ liệu vào ngày hiện
hành tiêu đề thông báo của bạn.
3. Đặt con trỏ chuột vào phần mô tả và dùng những tính năng của trình văn bản
WYSIWYG để tạo ra phần nội dung cho thông báo của bạn.
4. Chọn dạng liên kết cho thông báo của bạn và hoàn thành những thông tin thích
hợp. Bạn có thể chỉ rõ đường liên kết cho website, trên trang của website bạn hoặc đến
một tập tin trên website (như là hinh ảnh hoặc tài liệu PDF).
5. Chọn đường liên kết từ những hộp tùy chọn có sẵn.
Nếu như chọn Tracking, bạn sẽ có thể kiểm tra đường liên kết này được click vào
bao nhiều lần. Nếu bạn chọn Logging, bạn có thể đoán được ai đã click vào đuờng liên
kết này ( Nếu người sử dụng đăng nhập vào hệ thống). Và nếu như bạn chọn New
Window, đường link của bạn sẽ làm cho một cửa sổ trình duyệt được mở ra cho
đường link đó.
Thiết kế web với DotNetNuke 5.x Khoa CNTT - Trường Cao đẳng nghề Đà Lạt
Phạm Đình Nam Trang 83
6. Chỉ rõ ngày mà thông báo của bạn ngưng không hiển thị nữa. Bạn có thể nhấp
vào Calendar để bật lên lịch biểu là nơi mà bạn có thể chọn cái ngày đó.
7. Bao gồm View Order để sắp xếp lại thông báo của bạn. Theo mặc định, chúng
sẽ được sắp xếp như lúc mà bạn đã tạo ra chúng.
8. Khi bạn đã làm xong, phải bảo đảm rằng bạn đã nhấp vào Update ở giữa trang
để lưu lại những thay đổi của bạn. Bạn phải update như thế nào để người truy cập
website có thể nhìn thấy.
III. Sử dụng module liên kết
Module liên kết hiển thị danh sách của những đường siêu liên kết để đến được bất
cứ trang nào, hình ảnh hoặc tập tin trên website bạn; hoặc là một tập tin, hình ảnh hoặc
một trang nào đó ở website khác.
Dùng những gì bạn đã được học ở phần thêm module vào trang để thêm một
module liên kết mới cho trang của bạn.
Các bước để thêm một đường liên kết mới
Module của bạn tạo ra lúc ban đầu thì không có nội dung. Chỉ hiển thị một
Container trống với Title và Action Buttons.
1. Nhấp vào Add Link (hoặc chọn Add Link từ Module Actions Menu).
Thiết kế web với DotNetNuke 5.x Khoa CNTT - Trường Cao đẳng nghề Đà Lạt
Phạm Đình Nam Trang 84
Trên trang Edit Links bạn sẽ thấy vài vùng mà bạn cần phải điền vào như kiểm
soát Link Type và hộp lựa chọn trên các module khác.
2. Đặt con trỏ chuột vào vùng Title và nhập vào đó một nhóm từ ngắn cho đoạn
văn bản liên kết của bạn. Giá trị của nó là sẽ hiện ra những đường liên kết thực.
3. Chọn Link Type cho đường liên kết của bạn và hoàn thành những thông tin
thích hợp. Bạn có thể chỉ định rõ đường liên kết đến website, trang nào đó hoặc là một
tập tin ở trên website bạn (như là hình ảnh và tài liệu PDF).
4. Chọn từ những lựa chọn sẳn có cho đường liên kết.
Nếu như bạn chọn Tracking, bạn sẽ kiểm tra được đường liên kết đó được click
vào bao nhiêu lần. Nếu như bạn chọn Logging bạn có thể đoán được ai là người click
vào đuờng liên kết đo (nếu như người truy cập có đăng nhập vào). Và bạn chọn New
Window, đường link của bạn sẽ làm cho một cửa sổ trình duyệt được mở ra cho
đường link đó.
6. Chỉ rõ phần mô tả cho đường liên kết của bạn. Phần mô tả sẽ
Thiết kế web với DotNetNuke 5.x Khoa CNTT - Trường Cao đẳng nghề Đà Lạt
Phạm Đình Nam Trang 85
7. Bao gồm cả phần View Order cho phần sắp xếp các đường liên kết của bạn.
Theo mặc định, chúng sẽ được sắp xếp như lúc mà bạn tạo ra chúng.
8. Khi bạn đã làm xong, phải chắc rằng là bạn đã nhấp vào Update ở giữa trang
để lưu lại những thay đổi của bạn. Bạn phải update module như thế nào để người truy
cập vào website bạn sẽ nhìn thấy.
Nhưng đó chỉ là mặc định ở bên ngoài cho module liên kết… thật ra nó chỉ là một
đường siêu liên kết trên tiêu đề văn bản. Đó sẽ có vài hộp lựa chọn sẵn có.
Các bước để hiển thị hộp lựa chọn
Module liên kết có một vài Display Option là cái mà bạn có thể thay đổi vẻ ngoài
của nó. Để minh họa rõ hơn thì những thiếtlập sẽ thay đổi module của bạn sẽ xuất
hiện, đây là ví dụ dùng một module đã được thêm vào một vài đường liên kết phụ.
1. Nhấp vào nút Settings (hoặc chọn Settings từ Module Action Menu).
Or...
2. Trên trang Module Settings, di chuyển xuống Links Settings và nhấp vào nút
để mở rông đoạn đó ra. Nó sẽ chị bạn những hộp lựa chọn sẵn có của module liên kết
Thiết kế web với DotNetNuke 5.x Khoa CNTT - Trường Cao đẳng nghề Đà Lạt
Phạm Đình Nam Trang 86
(những lựa chọn trong những phần khác của trang là những lựa chọn của module
thông thường).
3. Chọn Dropdown như là Control Type và sau đó nhấp vào Update ở giữa
trang. Đây là thay đổi đường liên kết của bạn từ qua việc lựa chọn từ hộp rơi xuống và
nút go (như minh họa bên dưới).
4. Chọn Horizontal như là List Display Format ( đây chỉ là một hiệu úng cho
module của bạn khi Control Type là List vì thế nó cũng thay đổi) và sau đó nhấp vào
Update ở giữa trang. Đây là sự thay đổi đường liên kết để cho nó hiển thị ngang (như
minh họa bên dưới).
5. Chọn Yes cho phần Display Info Link và sau đó nhấp vào Update ở giữa
trang. Đây là sự thay đổi cách hiển thị của phần mô tả của bạn.
Thiết kế web với DotNetNuke 5.x Khoa CNTT - Trường Cao đẳng nghề Đà Lạt
Phạm Đình Nam Trang 87
Phần mô tả bình thường hiển thị như là một “chú giải công cụ”. Một chú giải công
cụ được hiển thi khi con chuột trỏ vào đường liên kết.
[Display Link Info = No]
Sự mô tả được hiển thị như là một sự lựa chọn với nhiều đường liên kết… làcái mà
(khi nhấp vào) thì nó hiển thị sự mô tả ở trên trang.
[Display Link Info = Yes]
IV. Sử dụng module tài liệu
Module tài liệu hiển thị ra một danh sách các tài liệu, bao gồm cả đường liên kết
để người truy cập website duyệt hoặc tải chúng về.
Dùng những gì mà bạn được học trong thêm module vào trang để thêm một
module tài liệu mới vào trang của bạn.
Các bước để thêm module tài liệu
Module bạn tạo ra lúc ban đầu thì không có nội dung. Nó chỉ hiển ra một
Container trống với Title và nút Action Buttons.
1. Nhấp vào Add New Documet (hoặc chọn Add New Document từ Module
Actions Menu).
Thiết kế web với DotNetNuke 5.x Khoa CNTT - Trường Cao đẳng nghề Đà Lạt
Phạm Đình Nam Trang 88
Trên trang Edit Document bạn sẽ thấy hai vùng mà bạn cần phải điền vào như là
phần kiểm soát Link Type và hộp lựa chọn như bạn đã thấy trên nhiều module khác.
2. Đặt con trỏ chuột vào vùng Title và nhập vào đó một ngữ ngắn để làm tên tài
liệu của bạn. Ngữ này sẽ được nhìn thấy bởi người truy cập website và nên mô tả nội
dung của tập tin.
3. Chọn Link Type cho tài liệu của bạn và hoàn thành những thông tin thích hợp.
File Link Type là mặc định và bạn có thể chọn tập tin từ danh sách các thư mục ở
trong hộp rơi xuống của File Location. Như một sự lựa chọn, bạn có thể chỉ định tài
liệu nằm ở chỗ khác bằng cách chọn URL Link Type và chỉ rõ địa chỉ internet của tập
tin.
4. Chọn từ những lựa chọn sẵn có cho đuờng liên kết.
Nếu như bạn chọn Tracking, bạn sẽ kiểm tra được đường liên kết đó được click
vào bao nhiêu lần. Nếu như bạn chọn Logging bạn có thể đoán được ai là người click
vào đuờng liên kết đo (nếu như người truy cập có đăng nhập vào). Và bạn chọn New
Window, đường link của bạn sẽ làm cho một cửa sổ trình duyệt được mở ra cho
đường link đó.
Thiết kế web với DotNetNuke 5.x Khoa CNTT - Trường Cao đẳng nghề Đà Lạt
Phạm Đình Nam Trang 89
5. Chỉ định Category cho tài liệu của bạn. Phạm trù này đơn giản là cung cấp cho
bạn cách nhóm các tài liệu có chủ đề hoặc mục đích tương tự nhau.
6. Khi bạn đã làm xong, phải chắc rằng bạn đã nhấp vào Update ở giữa trang để
lưu lại những thay đổi của bạn. Đây là cách update module để làm sao cho người truy
cập website thấy được.
Các bước để hiệu chỉnh tài liệu
Hiệu chỉnh lại các thuộc tính của tài liệu hiện tại được làm như là thêm một tài liệu
mới. Chỉ có khác biệt là ở chỗ làm sao bạn đến được những thuộc tính đó. Mỗi tài liệu
là một danh sách các mục với nút Edit (cây bút chì) ở kế bên.
1. Nhấp vào nút Edit bên cạnh tài liệu thì bạn có thể thay đổi chúng.
2. Thay đổi các lệnh thiết lập và nhấp vào Update ở giữa trang để lưu lại những
thay đổi của ban.
Thiết kế web với DotNetNuke 5.x Khoa CNTT - Trường Cao đẳng nghề Đà Lạt
Phạm Đình Nam Trang 90
Bạn nên quan tâm tời một vài thông tin mà nó nằm ngay giữa trang Edit
Document.
URL: Nói cho bạn biết phần URL mở rộng để đến thẳng tài liệu của bạn.
Tracking URL: đây là sự khác biệt trong chúng vì số lượng nhấp vào để tăng lên
trước khi đến tài liệu (nếu bạn chọn chức năng “track”). Bạn có thể cho URL đến cái
khác (ví dụ đặt chúng trong email) nếu bạn thích thì bạn có thể đếm khi bạn truy lục
dữ liệu.
Clicks: số lần tài liệu của bạn được tài về (hoặc đi thằng từ chổ của bạn hoặc bất
kì nơi nào của tracking URL đã sử dụng).
Last Click: Ngày và thời gian của lần tải cuối cùng của tài liệu bạn.
V. Sử dụng module sự kiện
Module sự kiện hiển thị danh sách những sự kiện sắp tới, bao gồm ngày, thời gian
và sự mô tả. Sự kiện có thể được thiết lập hoàn trả trong lịch biểu hoặc danh sách định
dạng.
Dùng những gì bạn đã học trong thêm module vào trang để thêm module sự kiện
mới vào trang của bạn.
Các bước để thêm sự kiện mới
Module của bạn tạo ra lúc ban đầu không có nội dung. Chỉ hiển ra một Container
trống với Title và Action Buttons và một lịch biểu trống.
1. Nhấp vào Add New Event nằm ở giữa trang (hoặc chọn Add New Event từ
Module Actions Menu).
Thiết kế web với DotNetNuke 5.x Khoa CNTT - Trường Cao đẳng nghề Đà Lạt
Phạm Đình Nam Trang 91
Trên trang Edit Events bạn sẽ thấy vài vùng mà bạn có thể điền vào như là trình
văn bản WYSIWYG dùng cho module Text/HTML (và cái khác), và giống như “File
Picker” dùng trong module tài liệu (và cái khác).
2. Đặt con trỏ chuột vào vùng Title và nhập vào đó một ngữ ngắn cho đoạn văn
bản sự kiện của bạn. Nó có giá trị là sẽ hiển thị lên lich biểu (hoặc trong list view).
3. Đặt con trỏ chuột vào rich text editor và nhập vào đó mô tả cho sự kiện của
bạn. Đoạn mô tả này sẽ được hiển thị ở phía dưới tiêu đề. Bạn có thể dùng bất cứ tính
năng nào của trình soạn thảo, như là thêm đường liên kết hoặc đoạn màu và dạng.
Thiết kế web với DotNetNuke 5.x Khoa CNTT - Trường Cao đẳng nghề Đà Lạt
Phạm Đình Nam Trang 92
4. Chọn Image để dùng trong lịch biểu (hoặc tải lên một sự kiện mới). Nếu bạn
muốn dùng hình ảnh, thì bảo đảm rằng nó thích ứng với kích cỡ của nó… hình ảnh sẽ
được hiển thị bên trong hộp ngày (trên lịch biểu) hoặc bên cạnh lối vào đó (trong list
view).
Bạn có thể chọn thêm Aternate Text cho hình ảnh.
6. Chỉ rõ ngày bắt đầu sự kiện. Nếu như sự kiện của bạn nó ở tron ngày, đó là tất
cả điều bạn muốn làm. Như là một sự lựa chọn, nếu sự kiện của bạn diễn ra trong ngày
hoặc định kì (thí dụ mỗi thứ hai) bạn cũng chỉ định như vậy. Ngày bắt đầu hầu như là
sự lựa chọn.
8. Khi bạn đã làm xong, phải chắc rằng đã nhấp vào Update ở giữa trang để lưu
lại những thay đổi của bạn. Đây là việc update module của bạn làm sao cho người truy
cập website thấy được.
Nhưng đây chỉ mới là mặc định bên ngoài cho module sự kiện. Đó là sẽ hiển thị
vài chức năng sẵn có.
Các bước để hiển thị lựa chọn
Module sự kiện có một vài Display Options là cái giúp bạn thay đổi bề ngoài của
nó.
Thiết kế web với DotNetNuke 5.x Khoa CNTT - Trường Cao đẳng nghề Đà Lạt
Phạm Đình Nam Trang 93
1. Nhấp vào nút Settings (hoặc chọn Settings từ Module Actions Menu).
Or...
2. Trên trang Module Settings, di chuyển xuống Events Settings và nhấp vào nút
để mở rộng phần đó. Nó sẽ hiện ra cho bạn những lựa chon sẵn có của module sự
kiện (những lựa chọn trong phần này của trang là những lựa chọn của module thông
thường).
3. Chỉ định rõ Calendar Cell Width và Calendar Cell Height để giữ kích cỡ của
lịch biểu của bạn là một hằng số (thay vì đưa nội dung về kích thước ban đầu).