Đăng ký Đăng nhập
Trang chủ Công nghệ thông tin Quản trị web Tự thiết kế website dễ dàng với joomla ( www.sites.google.com/site/thuvientailie...

Tài liệu Tự thiết kế website dễ dàng với joomla ( www.sites.google.com/site/thuvientailieuvip )

.PDF
144
565
129

Mô tả:

“Thiết kế website thật dễ dàng với Joomla! 3.x” © JoomlaShine.com Twitter http://www.twitter.com/joomlashine | Facebook http://www.facebook.com/joomlashine Nội dung Những người thực hiện ................................................................................................................................... 2 Nội dung ............................................................................................................................................................... 4 Tính năng của Joomla! 3.x .............................................................................................................................. 6 Bước 1: Làm quen với Joomla! CMS ........................................................................................................... 8 Vậy Joomla! CMS là gì? ............................................................................................................................................... 8 Những thành phần chính của Joomla? ................................................................................................................. 12 Bước 2: Cài đặt Joomla! 3.x trên localhost .............................................................................................. 30 Cài đặt XAMPP .............................................................................................................................................................. 31 Cài đặt Joomla! ............................................................................................................................................................. 35 Bước 3: Tạo nội dung cho website Joomla ............................................................................................. 37 Chuẩn bị cấu trúc nội dung ....................................................................................................................................... 37 Tạo nội dung .................................................................................................................................................................. 38 Quản lý nội dung của bạn với JSN PowerAdmin ................................................................................................ 54 Chỉnh sửa bài viết đẹp hơn ....................................................................................................................................... 55 Bước 4: Tùy chỉnh giao diện website của bạn với Joomla! template ............................................... 81 Joomla! template là gì?............................................................................................................................................... 81 Chọn Joomla! template ............................................................................................................................................... 83 Cài đặt Joomla! template ............................................................................................................................................ 85 Bước 5: Sắp xếp modules ở các vị trí ........................................................................................................ 90 Joomla! module và Joomla! position là gì? ......................................................................................................... 90 Thêm mới một module.................................................................................................................................................. 94 Bước 6: Mở rộng chức năng của website với Joomla! extensions ................................................ 100 Làm việc với thành phần mở rộng (Extensions) mặc định “Contacts” ...................................................... 101 Thêm mới Extension ................................................................................................................................................... 112 Bước 7: Quản lý website với JSN PowerAdmin .................................................................................... 117 Quản lý website Joomla! với Site Manager ......................................................................................................... 120 Truy cập nhanh các mục bất kỳ với Spotlight Search ..................................................................................... 133 Quản lý các kiểu template với Template Style Manager .................................................................................. 135 Những tính năng khác .............................................................................................................................................. 139 Cấu hình JSN Power Admin .................................................................................................................................... 143 Kết luận............................................................................................................................................................. 146 Tham khảo ....................................................................................................................................................... 147 4 “Thiết kế website thật dễ dàng với Joomla! 3.x” © JoomlaShine.com Twitter http://www.twitter.com/joomlashine | Facebook http://www.facebook.com/joomlashine Tính năng của Joomla! 3.x Joomla! 3.x là phiên bản mới nhất của Joomla! Phiên bản mới này bao gồm nhiều điều thú vị với rất nhiều cải tiến mới mẻ. Bạn có thể lướt qua 6 tính năng tuyệt vời của Joomla! 3.x mang lại trong “Infographic” bên dưới. Để tìm hiểu thêm thông tin về các tính năng của Joomla! 3.x, bạn có thể truy cập http://www.joomla.org/3/en. 6 tính năng tuyệt vời của Joomla! 3.x 6 “Thiết kế website thật dễ dàng với Joomla! 3.x” © JoomlaShine.com Twitter http://www.twitter.com/joomlashine | Facebook http://www.facebook.com/joomlashine Dịch giả chú thích: Responsive Layout: Trong thiết kế Web (chính xác là front-end development) thì Responsive Layout chỉ là một phần của Responsive Web Design. Vậy Responsive Layout là gì? Về cơ bản thì Responsive Layout là một cấu trúc cơ bản của một website nhưng đảm bảo hiển thị được tốt trên tất cả các loại màn hình khác nhau (có thể là màn hình Desktop, màn hình Tablet (Ipad, Kindle) hay các thiết bị di động như iphone, android, etc) Twitter Bootstrap (Bootstrap Framework) được tạo và phát triển bởi Twitter gồm các mã CSS + HTML cơ bản cho typography, forms, buttons, tables, grids, navigation, và nhiều thành phần khác của website. Xem trang chủ: http://twitter.github.io/bootstrap/ hay trang Showcases: http://builtwithbootstrap.com 7 “Thiết kế website thật dễ dàng với Joomla! 3.x” © JoomlaShine.com Twitter http://www.twitter.com/joomlashine | Facebook http://www.facebook.com/joomlashine Bước 1: Làm quen với Joomla! CMS Trước đây nếu bạn muốn xây dựng một website, chỉ có một sự lựa chọn là thuê một công ty thiết kế web chuyên nghiệp làm cho bạn và sau đó bạn hoàn toàn phụ thuộc vào họ để duy trì và cập nhật website này. Nhưng bây giờ, với sự phát triển mạnh mẽ của phần mềm mã nguồn mở, bạn có thể tự xây dựng một website dễ dàng bằng cách sử dụng một hệ quản trị nội dung CMS (Content Management System). Có nhiều hệ quản trị CMS để bạn lựa chọn, nhưng thích hợp nhất để xây dựng một website trung bình hoặc nhỏ là Joomla! Trong phần này bạn sẽ nắm được những thông tin sơ lược về Joomla! và các thành phần của nó. Vậy Joomla! CMS là gì? Joomla! logo Joomla! CMS là một hệ quản trị nội dung mã nguồn mở cho phép bạn tạo và quản lý các website. Trển các website này, bạn có thể chỉnh sửa: 1. Nội dụng website như chữ, hình ảnh, videos, v.v. 2. Giao diện website bằng cách dùng các template (Joomla Templates) 3. Chức năng website bằng cách dùng các extension (Joomla Extensions) Hệ thống website Joomla! gồm hai phần : Front-end (Phần Mặt trước - những gì người dùng chung thấy) và Back-end (Phần mặt sau - những gì mà người quản trị thấy). 8 “Thiết kế website thật dễ dàng với Joomla! 3.x” © JoomlaShine.com Twitter http://www.twitter.com/joomlashine | Facebook http://www.facebook.com/joomlashine Phần front-end Front-end là những gì mà mọi người xem được khi họ truy cập website của bạn. Thông thường một mẫu thiết kế bao gồm những mục cơ bản như logo, thanh danh mục (menu bar), cột bên trái, cột bên phải (side column) và khối văn bản. Phần front-end của website 9 “Thiết kế website thật dễ dàng với Joomla! 3.x” © JoomlaShine.com Twitter http://www.twitter.com/joomlashine | Facebook http://www.facebook.com/joomlashine Xem một bài viết tại front-end Phần back-end Phần back-end là vùng quản trị - Nơi mà bạn có thể điều chỉnh website của bạn. Những thành viên có quyền Administrator có thể truy cập vào đây thông qua một trang đăng nhập đặc biệt. Phần back-end của Joomla! 10 “Thiết kế website thật dễ dàng với Joomla! 3.x” © JoomlaShine.com Twitter http://www.twitter.com/joomlashine | Facebook http://www.facebook.com/joomlashine Chỉnh sửa một bài viết trong back-end 11 “Thiết kế website thật dễ dàng với Joomla! 3.x” © JoomlaShine.com Twitter http://www.twitter.com/joomlashine | Facebook http://www.facebook.com/joomlashine Những thành phần chính của Joomla? Bây giờ, hãy khám phá những thành phần chính của Joomla! Nội dung Trong Joomla!, nội dung bao gồm những bài viết, chuyên mục hay media. Bài viết (Articles) Bài viết là khối nội dung chính của một website Joomla!. Trong phần front-end bạn có thể dễ dàng nhận ra một bài viết là một đoạn văn bản có hoặc không có hình ảnh, được trình trong vùng nội dung chính. Bài viết “Getting started” Tại back-end, các bài viết được quản lý tromg danh mục con “Article Manager”. Bạn có thể truy cập vào đây thông qua danh mục “Content” => “Article Manager”. 12 “Thiết kế website thật dễ dàng với Joomla! 3.x” © JoomlaShine.com Twitter http://www.twitter.com/joomlashine | Facebook http://www.facebook.com/joomlashine Phần “Article Manager” Tại đây bạn có thể tạo bài viết mới, chỉnh sửa chúng, chọn hiển thị hay ẩn bài viết, v.v. Chuyên mục (Categories) Chuyên mục giúp bạn tổ chức các bài viết tiện lợi và khoa học hơn. Bạn có thể hình dung các chuyên mục giống như là những thư mục (folders) trong máy tính bao gồm những tập tin (files). Ví dụ, một chuyên mục “Sản phẩm” có thể chứa tất cả các bài viết về sản phẩm của bạn. Hay, một chuyên mục “Về chúng tôi” có thể chứa tất cả các bài viết có nội dung như “Giới thiệu công ty”, “Tầm nhìn & Sứ Mệnh”, “Hội đồng quản trị”, v.v. Trong back-end, chuyên mục được quản lý trong danh mục con “Category Manager”. Bạn có thể truy cập vào đây thông qua danh mục “Content” => “Category Manager”. Phần “Category Manager” 13 “Thiết kế website thật dễ dàng với Joomla! 3.x” © JoomlaShine.com Twitter http://www.twitter.com/joomlashine | Facebook http://www.facebook.com/joomlashine Tại đây, bạn có thể tạo chuyên mục mới, chỉnh sửa chúng, chọn hiển thị hay ẩn chuyên mục, v.v. Thẻ bài viết (Tags) Các thẻ bài viết (Tags) là các từ hoặc cụm từ được gán vào một đoạn thông tin (bài viết, blog post...). Nó mô tả nội dung của mục đó. Ví dụ, bạn có thể thêm các thẻ như “Joomla! templates” và “Joomla! extensions” vào bài viết “Getting Started with Joomla!”. Các mục có những thẻ bài viết giống nhau sẽ được nhóm lại cùng nhau, vì vậy mọi người có thể tìm kiếm chúng dễ dàng hơn. Bạn có thể tạo một danh mục (hay một module) để hiển thị tất cả các thẻ bạn đã tạo. Trong phần quản trị back-end, các thẻ bài viết được đặt trong bảng chỉnh sửa bài viết (Article Manager). Bạn vào phần “Content” => “Article Manager”, sau đó đi tới các bài viết riêng biệt để gán thẻ bài viết. Chức năng Thẻ bài viết (“Tag”) giúp bạn gán từ khóa vào các mục riêng biệt Để quản lý tất cả thẻ bài viết của bạn, bạn có thể truy cập vào “Component” => “Tags” 14 “Thiết kế website thật dễ dàng với Joomla! 3.x” © JoomlaShine.com Twitter http://www.twitter.com/joomlashine | Facebook http://www.facebook.com/joomlashine Vào “Components” -> “Tags” để quản lý thẻ bài viết của bạn 15 “Thiết kế website thật dễ dàng với Joomla! 3.x” © JoomlaShine.com Twitter http://www.twitter.com/joomlashine | Facebook http://www.facebook.com/joomlashine Media Hiểu theo cách đơn giản, media là những thứ không phải văn bản mà bạn có thể đưa vào trong phần nội dung. Nó không chỉ là hình ảnh, mà còn có thể là các videos hay những thành phần “đa phương tiện” khác. Media được quản lý bằng danh mục con “Media Manager”. Bạn có thể truy cập tới đây thông qua danh mục “Content” => “Media Manager”. Phần quản lý “Media Manager” Tại đây, bạn có thể tạo các thư mục media mới, đưa các tập tin lên, v.v. Chúng ta sẽ thảo luận chi tiết cách sử dụng Media Manager nhiều hơn trong chương “Bước 3: Tạo nội dung cho website Joomla”. 16 “Thiết kế website thật dễ dàng với Joomla! 3.x” © JoomlaShine.com Twitter http://www.twitter.com/joomlashine | Facebook http://www.facebook.com/joomlashine Danh mục (Menus) Danh mục giúp khách truy cập website có thể di chuyển tới các trang khác nhau trong website của bạn. Bạn có thể tạo nhiểu danh mục và cấu hình chúng hiển thị ở các vị trí khác nhau trong website, ví dụ trên đầu trang hoặc bên phải, bên trái website. Một danh mục trên webiste Trong ví dụ trên, người quản trị tạo một danh mục là “Home” với nhiều danh mục con bên trong nó như “Getting Started”, “Using Joomla!”, etc. Để quản lý danh mục, bạn truy cập vào phần quản trị danh mục qua “Menus” => “Menu Manager”. 17 “Thiết kế website thật dễ dàng với Joomla! 3.x” © JoomlaShine.com Twitter http://www.twitter.com/joomlashine | Facebook http://www.facebook.com/joomlashine Mục “Menu Manager” trong phần quản trị Joomla! Trong “Menu Manager” bạn có thể tạo danh mục và các danh mục con để liên kết các thành phần trên website. Khi đã tạo xong một danh mục, bạn tạo một module danh mục để hiển thị nó trên front-end. 18 “Thiết kế website thật dễ dàng với Joomla! 3.x” © JoomlaShine.com Twitter http://www.twitter.com/joomlashine | Facebook http://www.facebook.com/joomlashine Thành viên (Users) Joomla! cho phép nhiều thành viên đăng ký trong website của bạn. Tất cả những thành viên này được sắp xếp vào từng nhóm với các quyền truy cập khác nhau. Mặc định có những nhóm thành viên như “Author”, “Editor”, “Publisher”, etc. Ví dụ:  Thành viên trong nhóm“Administrator” có thể truy cập cả back-end và front-end.  Thành viên trong nhóm “Registered” chỉ có thể truy cập vào phần front-end. Họcó thể quản lý các thành viên, các nhóm thành viên và các quyền truy cập tương ứng trong danh mục “Users” => “User Manager”. Danh mục “Users” trong back-end 19 “Thiết kế website thật dễ dàng với Joomla! 3.x” © JoomlaShine.com Twitter http://www.twitter.com/joomlashine | Facebook http://www.facebook.com/joomlashine Các thành phần mở rộng (Extensions) Các thành phần mở rộng của Joomla! (extentions) là những phần mềm đặc biệt được viết để để tích hợp vào Joomla! nhằm tăng cường cũng như mở rộng chức năng cho website. Ví dụ, bạn cần cài đặt extension.nếu bạn muốn có một slideshow hình ảnh, bộ sưu tập video, hay một biểu mẫu liên hệ với các chức năng nâng phong phú hơn. Mặc định gói cài Joomla! đã cung cấp cho bạn khá nhiều loại Extensions cho những nhu cầu cơ bản. Nếu bạn muốn sử dụng nhiều extension hơn, bạn có thể truy cập vào trang Joomla! Extension Directory. Đây là trang chính thức của Joomla! Extention được quản lý bởi một đội ngũ nòng côt của Joomla!. Joomla! Extensions Directory Có 5 loại extensions cơ bản, đó là: components, modules, plug-ins, templates và languages. Mỗi một loại extensions này đều xử lý một chức năng cụ thể. 20 “Thiết kế website thật dễ dàng với Joomla! 3.x” © JoomlaShine.com Twitter http://www.twitter.com/joomlashine | Facebook http://www.facebook.com/joomlashine Components Component là loại extension phức tạp nhất. Đây được xem như một ứng dụng thực hiện một số nhiệm vụ nhất định và hiển thị những nội dung đặc biệt trên website của bạn. Như đã đề cập ở trên, một bộ sưu tập video là một ví dụ của một component. Nó cũng có thể là một hệ thống mua bán trực tuyến, hệ thống đặt phòng trực tuyến, diễn đàn, v.v. Component “Newsfeeds” tại front-end Nội dung được tạo ra bởi một component và được hiển thị trong vùng nội dung chính. Trong ví dụ ở trên, bạn có thể nhìn thấy một danh sách nguồn cấp dữ liệu (feed) được tạo ra bởi component “Newsfeeds”. Tất cả các components nằm trong phần “Components” của Joomla! 21 “Thiết kế website thật dễ dàng với Joomla! 3.x” © JoomlaShine.com Twitter http://www.twitter.com/joomlashine | Facebook http://www.facebook.com/joomlashine Danh mục “Components” trong phần back-end Mặc định, gói Joomla! cung cấp các components: “Banners”, “Contacts”, “Messaging”, “News Feeds”, “Redirect”, “Search”, “Smart Search”, “Tags” và “Web links”. 22 “Thiết kế website thật dễ dàng với Joomla! 3.x” © JoomlaShine.com Twitter http://www.twitter.com/joomlashine | Facebook http://www.facebook.com/joomlashine Modules Modules cũng đóng vai trò như những components nhưng ở quy mô nhỏ hơn. Modules thực hiện những chức năng đơn giản và hiển thị nội dụng như một khổi thông tin (block) nhỏ ở trên website. Những modules hiển thị trong front-end Một số modules thường thấy là module tìm kiếm (search box), module đăng nhập (login form), module danh mục (menu module), module hiển thị thông tin cuối website (footer copyright), v.v. Trong nhiều trường hợp, các modules làm việc nhằm liên kết với các components để hiển thị nội dung. Ví dụ, ta sử dụng môt component mua bán trực tuyến để quản lý sản phẩm và một module để hiển thị những sản phẩm mới trên 23
- Xem thêm -

Tài liệu liên quan