Joomla – Thiết kế web động dễ như chơi (Phần 33)

Thảo luận trong 'Joomla' bắt đầu bởi hoangtrieumanhn, 2/1/15.

Lượt xem: 1,016

Bạn đang xem:

Joomla – Thiết kế web động dễ như chơi (Phần 33)

Coppy cùng chia sẻ nhé bạn!
  1. hoangtrieumanhn

    hoangtrieumanhn NO SPAM - SPAM LÀ ĐI LIỀN

    Tham gia ngày:
    28/12/14
    Bài viết:
    533

    Những Cảnh Đẹp Của Việt Nam Qua Góc Nhìn Từ FlyCam PhanTom 3 Professional (Video 4K)

    Bấm Youtube để đăng ký xem video nhé!


    Tiếp theo loạt bài viết về Component và Module này, chúng ta sẽ học cách cài đặt một component mang tên Flipping Book.
    Thông qua component này, bạn sẽ có thể tạo ra một cuốn sách trực tuyến, và người dùng sẽ có cảm giác như đang đọc một quyển sách thực sự và thậm chí nghe được âm thanh khi lật từng trang sách. Component này rất thích hợp cho các bạn làm trang web về đọc truyện tranh trực tuyến.


    [​IMG]


    Bạn hãy tải phần nguồn cài đặt về từ địa chỉ http://www.mediafire.com/?9378ki1myccmwmc, và giải nén thành thư mục Extensions10.

    Cài đặt component Flipping Book

    Đầu tiên, bạn mở trình duyệt và truy cập vào địa chỉ:http://localhost/mobile/administrator, rồi đăng nhập bằng tên tài khoản (username) là admin, còn mục mật khẩu (password), bạn nhập vào mật khẩu mà bạn đã thiết lập trong quá trình cài đặt Joomla. Sau khi đăng nhập thành công, bạn vào menu Extensions, chọn Install/Uninstall. Ở mụcPackage File, bạn nhấn Browse và trỏ đường dẫn đến tập tincom_flippingbook_1.5.6.zip, sau đó bạn nhấn Upload File & Install.


    [​IMG]


    Khi bạn nhận được thông báo Install Component Success nghĩa là quá trình cài đặt Component thành công. Tiếp theo, bạn vào menu Components, chọnFlippingBook.


    [​IMG]


    Tạo mới chuyên mục dành cho sách

    Đầu tiên bạn cần phải xác định các chuyên mục dành cho sách, chẳng hạn như: Sách kỹ thuật, Tiểu thuyết,… bằng cách nhấn chọn vào thẻ Manage Categories.


    [​IMG]


    Trong trang Flipping Book: Category Manager, bạn sẽ thấy các nút lệnh như: xuất bản chuyên mục (Publish), không xuất bản chuyên mục (Unpublish), xóa chuyên mục (Delete), chỉnh sửa các thông tin của chuyên mục (Edit), tạo mới chuyên mục (New). Bạn nhấn vào nút New để tạo mới chuyên mục.


    [​IMG]


    Ở mục Title, bạn điền vào nội dung của chuyên mục, ví dụ như Sách kỹ thuật. Mục Show Title, nếu muốn hiển thị tiêu đề của chuyên mục, bạn chọnYes. Mục Pubished, bạn phải chọn Yes để kích hoạt chuyên mục này. Để cho bắt mắt, ở mục Print Icon và Email Icon, bạn chọn Yes để hiển thị các biểu tượng về máy in và thư điện tử. Khung Description, bạn có thể nhập vào nội dung để miêu tả thêm thông tin cho chuyên mục. Cuối cùng bạn nhấn nút Saveđể lưu lại.


    [​IMG]


    Tạo mới quyển sách

    Bước tiếp theo, chúng ta sẽ tạo mới một quyển sách. Bạn nhấn vào thẻManage Books


    [​IMG]


    Trong trang Flipping Book Manager, bạn sẽ thấy các nút lệnh như xuất bản sách (Publish), không xuất bản sách (Unpublish), xóa sách (Delete), chỉnh sửa các thông tin của sách (Edit), tạo mới một quyển sách (New). Bạn nhấn vào nút New để tạo một quyểnsách mới.

    Ở mục Category, bạn chọn nhóm chuyên mục cho sách, còn mục Preview Image, bạn chọn một hình ảnh đại diện cho quyển sách. Để cho đẹp mắt, bạn có thể tìm kiếm các hình ảnh về bìa sách, sau đó chép chúng vào thư mụcC:\AppServ\www\mobile\images\flippingbook. Ở mục Title, bạn nhập vào tiêu đề dành cho sách. Ở khung Description, bạn nhập thêm các thông tin mô tả cho quyển sách, có thể nhập vào đó phần giới thiệu để thu hút người đọc.


    [​IMG]


    Tiếp theo bạn nhìn sang khung Publishing bên phải. Mục Published, bạn chọn Yes để xuất bản sách này. Mục Show Book Title dùng để hiển thị tiêu đề của sách. Các mục bên dưới như Print Icon, Email Icon, Show Book Description và Show Pages Description, bạn cũng nên chọn Yes.


    [​IMG]


    Kế tiếp là khung Parameters (Basic), mục Pages Width và Pages Heightcho phép bạn xác định chiều rộng và chiều cao của trang. Đơn vị được tính ở đây là điểm ảnh (pixel). Mục Flash Width, dùng để hiển thị hiệu ứng theo chiều rộng, bạn có thể nhập vào % hoặc pixel. Nhưng tốt nhất là bạn nên nhập bằng kích thước của trang, nếu bạn nhập ít hơn hoặc nhiều hơn kích thước của trang, quyển sách của bạn sẽ không hiển thị đầy đủ. Mục Flash Height dùng để nhập vào hiệu ứng chiều cao của trang, đơn vị được tính ở đây là pixels.

    Mục Hardcover dùng để tạo bìa cứng cho quyển sách. Kế tiếp là các thông số hiển thị cho sách, nếu bạn muốn quyển sách của bạn được canh giữa thì ở mục Center Book, bạn chọn Yes. Mục Scale Content dùng để co giãn nội dung trong quyển sách. Cuối cùng là mục Always Opened cho phép bạn thiết lập quyển sách lúc nào cũng được đóng lại hay mở ra.


    [​IMG]


    Tiếp theo là khung Background, bạn có thể lựa chọn hình nền khi đọc sách ở mục Background Image. Sau khi đã chọn xong, ở bên dưới là mụcBackground Image Placement dùng để canh chỉnh vị trí cho hình nền, FlippingBook cung cấp cho bạn ba tùy chọn: canh giữa (Center), canh vừa khít khung sách (Fit), vị trí ở trên bên trái (Top Left).


    [​IMG]


    Ngoài ra, nếu bạn không thích để hình nền thì bạn có thể dùng màu nền. Ở mục Background, bạn nhấn vào nút >>> để chọn màu. Flipping Book sẽ đưa ra bảng màu cho phép bạn chọn lựa. Tương tự ở mục Page Background Color, bạn cũng có thể chọn màu sắc cho trang sách.


    [​IMG]


    Kế tiếp là khung Navigation Bar dùng để thiết lập thanh công cụ cho sách.


    [​IMG]


    Ở mục Navigation Bar File, có hai dạng nút lệnh cho bạn lựa chọn: nút thẳng (navigation.swf) hoặc nút được bo tròn (navigation_round.swf)


    [​IMG]



    [​IMG]


    Ở bên dưới là mục Navigation Bar Placement, cho phép bạn xác định vị trícủa thanh công cụ: ở trên (Top) hoặc ở dưới (Bottom). Sau đó là các nút lệnh như: hiển thị toàn màn hình (Show Full Screen Button), hiển thị các trang (Show Go to Page field), hiển thị nút lệnh trình chiếu (Show Slideshow Button), hiển thị các nút trang trước và trang sau (Show First and Last Button).

    Tiếp theo là khung Zoom, dùng để tinh chỉnh hiệu ứng phóng to. Để kích hoạt tính năng này, ở mục Zoom Enabled, bạn chọn Yes. Bên dưới là mục Zoom Image Height và Zoom ImageWidth dùng để xác định kích thước phóng to theo chiều rộng và chiều cao. Mục Zoom UI Color được dùng để xác định màu sắc thanh trượt khi phóng to.


    [​IMG]


    Khung Download Book dùng để tải sách về. Ở mục Download URL, bạn nhập vào đường dẫn của sách. Lưu ý, bạn có thể để sách ở định dạng PDFhoặc DOC để người dùng có thể đọc được dễ dàng sau khi tải về máy tính.


    [​IMG]


    Khung Slideshow giúp bạn hiệu chỉnh việc trình chiếu. Ở mục Turn Slideshow On, nếu bạn chọn Yes thì khi mở sách ra, các trang sẽ tự động lật. Người dùng có thể nhấn nút Stop trên thanh Navigation Bar để dừng lại hoặc nút Resume để tiếp tục. Bên dưới là mục Page Browsing Interval, dùng để thiết lập thời gian cho hiệu ứng trình chiếu. Bạn không nên để thời gian quá ngắn, vì như thế trang sách sẽ không hiển thị kịp. Mặc định ở đây là 5000, đơn vị được tính là mi-li giây (millisecond).


    [​IMG]


    Tiếp theo là khung Book Window. Ở mục Book Link Target, bạn xác định hành động khi nhấn vào quyển sách là hiển thị ngay trong trang web của bạn (Parent Window With Browser Navigation), mở một cửa sổ mới (New Windows Without Browser Navigation). Khi dùng tùy chọn này, bạn có thể thiết lập giá trị chiều rộng và chiều cao cho cửa sổ trình duyệt mới.


    [​IMG]


    Cuối cùng là khung Parameters (Advanced). Ở mục Allow Pages Unload, khi bạn chọn Yes, thì những trang sau của quyển sách sẽ không được tải cho đến khi bạn lật đến trang đó. Còn nếu bạn chọn No, ngay khi vừa mở sách, Flipping book sẽ tải tất cả các trang về và lưu vào trong bộ nhớ. Cách này sẽ khiến cho người đọc như đang đọc một quyển sách thật sự nhưng bù lại sẽ tiêu hao bộ nhớ máy tính.

    Mục First Page Number cho biết trang nào sẽ được mở đầu tiên, mặc định ở đây là 1. Mục Flip Area cho phép bạn xác định khoảng cách góc để lật trang. Giá trị ở đây dao động từ 50 đến 100, tùy thuộc vào kích thước của trang sách. Mục Static Shadow Depth và Dynamic Shadown Depth dùng để thiết lập độ bóng cho quyển sách, bạn có thể nhập vào giá trị từ 1 đến 2. Còn nếu bạn không muốn hiển thị độ bóng, bạn nhập vào giá trị là 0.

    Mục Static Shadows Type có hai dạng cho bạn chọn: Đối xứng(Asymmetric) và Bất đối xứng (Symmetric). Cuối cùng là mục Flip Corner Style, bạn có thể chọn dạng góc cong quyển sách ở duy nhất trang đầu (First Page only) hoặc bạn muốn khi người dùng rê chuột vào trang nào thì cũng sẽ có góc cong của trang đó thì bạn chọn Manually. Sau khi cấu hình xong, bạn nhấn nút Save để lưu lại.


    [​IMG]


    NHÓM MỤC ĐỒNG
     
    Diễn đàn Ntphong index siêu nhanh!

    Diễn đàn Seo

    Tiêu đề: Joomla – Thiết kế web động dễ như chơi (Phần 33)

    Ghi nguồn bài viết www.ntphong.com khi đăng tải lại bài viết này.

  2. Quảng cáo Thành viên VIP


    Những Cảnh Đẹp Của Việt Nam Qua Góc Nhìn Từ FlyCam PhanTom 3 Professional (Video 4K)

    Bấm Youtube để đăng ký xem video nhé!


Link hữu ích: @@ giàn phơi thông minh, giàn phơi quần áo, giàn phơi quần áo thông minh, giàn phơi quần áo, thùng rác, sim tra sau, giàn phơi thông minh, Toyota camry 2017, Mật Ong Rừng, Mật Ong Rừng Nguyên Chất, fpt ho chi minh, @@
=