Thay đổi skin website

Một phần của tài liệu GIÁO TRÌNH THIẾT KẾ WEB VỚI DOTNETNUKE 5.X ĐẠI CƯƠNG (Trang 68 - 73)

Skin are fun! “Skin” là phương thức dùng để mô tả cách hiển thị và cách bố trí các trang trên website của bạn. Và bạn có thể thay đổi chúng với một vài nhấp chuột đơn giản!

Một Skin có thể rất đơn giản hoặc phức tạp. Nó có thể cung cấp Menu nằm dọc hay nằm ngang, cung cấp những dạng khác nhau của Container ( như skin cho

Module), cung cấp các cách bố trí khác nhau, v..v.. Đó là tùy theo sự thu thập skin của người thiết kế.

Ở đây có ví dụ về vài Skin bao gồm cả DotNetNuke. Nhiều skin có thể dùng nhiều nguồn khác nhau (cả miễn phí lẫn bán). Skin của website có thể được thiết kế tùy thích.

Skin mặc định của website bạn được quản lý ở trên trang chỉ bị ảnh hường bởi

quản trị viên. Thiết lập này cung cấp cho bạn toàn bộ website và tất cả các trang mà bạn tạo ra.

1. Chọn Skins từ menu Admin

Trên trang Skins, bạn thấy được một vùng và chọn cả hai SkinContainer cho website của bạn.

2. Chọn trong tập sưu tập Skin để xem từ hộp danh sách rơi xuống ở đầu trang.

Check vào hộp HostSite để cho biết là bạn muốn thấy skin options được cung cấp bởi máy chủ (cho mỗi người) và chỉ phụ thuộc vào site của bạn. Những chọn lựa đó sẽ xuất hiện trong hộp danh sách rơi xuống. Khi bạn chọn một, thì tang sẽ làm mới lại để hiển thị bộ sưu tập của SkinsContainer.

3. Ở giữa trang bạn có thể nhận dạng skin bạn chon được áp dụng cho public

Portal của bạn hoặc chỉ ở phẩn Admin của website.

Check hộp Portal Admin để cho biết là bạn muốn áp dụng skin mà ban chọn cho cả 2 dạng trang (đây là mặc định).

4. Chọn Skin mà bạn thích như là một mặc định cho trang web của bạn và nhấp

Apply.

Nếu Skin bao gồm hình ảnh, nó tạo ra hình nhỏ cái mà bạn có thể nhấp vào để thấy hình lớn hơn. Bạn có thê nhấp vào Preview cái mà sẽ bật lên cửa sổ hiện ra trang chủ của website với Skin vừa mới áp dụng (bạn phải chắc là đã đóng cửa sổ khi bạn đã xem trước xong).

Website của bạn bây giờ đã thay đổi Skin mặc định (như minh họa bên dưới). Bạn cũng có thể thiết đặc mặc định Container khiến cho skin của bạn đẹp hơn (chú ý container xanh vẫn là mặc định như bên dưới).

Các bước để thay đổi container mặc định

Quản lý Container trên trang web của bạn cũng giống như trên Skin. Tương tự như skin, các thiết lập của bạn được áp dụng trên toàn bộ website và tới tất cả các

Module mới mà bạn tạo. Nó có thể định rõ các container khác nhau trên các module cá nhân (nếu bạn muốn).

Chúng ta sẽ lập lại bước 1,2 &3 như ở trên và sau đó chỉ mặc định của Container. 1. Chọn Skins từ menu Admin.

2. Chọn bộ sưu tập Skin hoặc Container muốn xem từ hộp danh sách rơi xuống ở đầu trang. Thường thì bộ sưu tập skin sẽ bao gồm các mẫu mà bạn muốn chọn.

3. Ở giữa trang bạn được chỉ rõ là Container mà bạn chọn nên áp dụng vào puclic

Portal của bạn hoặc chỉ là phần Admin trên website của bạn.

4. Chọn Container là mặc định cho trang web của bạn và nhấp vào Apply. Nếu Container có hình ảnh, nó đuợc tạo từ hình nhỏ là cái mà có thể nhấp vào để cho ra hình lớn. Bạn có thể nhấp vào Preview là cái nó sẽ bật lên cửa sổ hiển ra trang chủ của website với skin đã được áp dụng (phải chắc là bạn đã đóng cửa sổ window khi bạn đã xem trước xong).

Website của bạn bây giờ sẽ thay đổi Container mặc định (như minh họa ở bên dưới). Bạn đã thay đổi xong cả Skin và container, bề ngoài trang web của bạn đã làm xong!

Các bước thay đổi skin/container cho trang đơn

Có thể chỉ rõ sự khác nhau của Skin Container mặc định cho một trang cá nhân của website bạn. Bạn phải chú ý răng nếu bạn thay đổi skin hoặc container tại trang đó, thì những thiết lập sẽ không có tác động khi bạn thay đổi mặc định.

Khi bạn thay đổi mặc định của Container cho một trang đơn, container đuợc áp dụng bởi mặc định của bất cứ Module nào được thêm vào ở trang đó.

1. Thông qua trang mà bạn muốn thay đổi Skin hoặc mặc định của Container.

2. Chọn Setting từ Page Fuctions của Control Panel. (adsbygoogle = window.adsbygoogle || []).push({});

3. Trên trang Page Management, mở rộng ra là nhóm các thiết lập nâng cao khi nhấp vào biểu tượng . Cuốn tới phần thiết lập Page Skin Page Container ở phần

4. Nút HostSite cho biết là bạn muốn nhìn thấy skin options được kiếm bởi host (cho mọi người) hay là phụ thuộc vào site của bạn. Khi bạn chọn một, trang sẽ làm mới lại để hiển thị bộ sưu tập của SkinsContainers.

Chọn Skin hoăc Container mặc định mà bạn thích rồi áp dụng vào trang.

Nút Preview làm việc như là nó ở trên trang Skin, cung cấp của sổ bật lên với trang chủ của website bạn với sự lựa chọn áp dụng.

5. Khi bạn đã làm xong những bước trên, di chuyển vào giữa trang rồi nhấp vào

Update để lưu lại những thay đổi của bạn!

Một phần của tài liệu GIÁO TRÌNH THIẾT KẾ WEB VỚI DOTNETNUKE 5.X ĐẠI CƯƠNG (Trang 68 - 73)