hướng dẫn sử dụng joomla 3.0
Post on 21-Jan-2016
1.020 Views
Preview:
DESCRIPTION
TRANSCRIPT
“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
2
Những người thực hiện
Người viết
Đào Ngọc Ánh Bùi Thị Mơ
Biên tập viên
Nguyễn Thị Thanh Huyền Bùi Anh Tuấn Bùi Huy Thắng
Thiết kế đồ họa
Hồ Huy Tùng Lưu Minh Sơn
Dịch giả
Tô Nam Phong
Ngày xuất bản: Tháng 7 năm 2013
Ấn bản thứ ba.
“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
3
“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
4
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
“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
5
Dịch giả chú thích: Một số từ hay cụm từ được để nguyên không dịch, vì nếu dịch sang tiếng Việt có thể sẽ
khiến bạn thấy khó hiểu hơn.
“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
6
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
“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
7
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
“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
8
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).
“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
9
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
“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
10
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!
“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
11
Chỉnh sửa một bài viết trong back-end
“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
12
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”.
“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
13
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”
“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
14
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”
“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
15
Vào “Components” -> “Tags” để quản lý thẻ bài viết của bạn
“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
16
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”.
“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
17
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”.
“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
18
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.
“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
19
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
“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
20
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ể.
“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
21
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!
“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
22
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”.
“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
23
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
“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
24
website.
Tất cả các modules được quản lý thông qua “Extensions” => “Module Manager”.
Danh mục con quản lý “Module Manager” trong phần back-end
“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
25
Templates
Template điểu khiển việc thiết kế đồ họa trên website của bạn. Nó quyết định bố cục website, màu sắc, kiểu
chữ cùng nhiều thành phần khác nhằm tạo nên nét riêng cho website của bạn.
Thông thường, một template bao gồm 3 thành phần sau:
Các yếu tố đồ họa tĩnh như ảnh nền, các chi tiết trang trí, logo, v.v.
Vùng nội dung chính trình bày dữ liệu được tạo ra bởi các components.
Nhiều vị trí module để hiển thị nội dung được trình bày bởi các modules, trong những vị trí nhất định.
Ví dụ ảnh nền (background), vị trí của module (module positions) và phần nội dung chính (body)
“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
26
Trong back-end, bạn có thể quản lý templates thông qua “Extensions” => “Template Manager”.
“Template Manager”
Mặc định, Joomla! 3.x có sẵn hai front-end template là: “Protostar” và “Beez3”. Ngoài ra có hàng ngàn
templates miễn phí cũng như phải trả phí cho bạn lựa chọn. Đây là một danh sách các template: top 10 Joomla!
3.0 templates for users.
“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
27
Dưới đây là một vài ví dụ về Joomla template:
JSN Pixel
JSN Boot
“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
28
Plug-ins
Plug-ins được thiết kế để hiển thị nội dung bên trong các component và module. Plugin cũng có thể thực hiện
một số công việc “ngầm” (một hành động hay một thao tác) trong những thời điểm nhất định khi tải website.
Bạn có thể hiểu rằng plug-ins giúp tương tác với hệ thống Joomla! linh hoạt hơn.
Hai plugins“Voting” và “Read more” trong front-end
Ví dụ, ở hình trên bạn có thể nhìn thấy plug-in Đánh giá (“Voting”) và plug-in Đọc thêm (“Read more…”)
trong những bài viết. Các plug-ins được quản lý qua “Extensions” => “Plug-in Manager”.
“Plug-in Manager”
Trong gói cài đặt Joomla! 3.x, plug-ins được chia vào trong 11 chuyên mục là: “authentication”, “captcha”,
“content”, “editor”, “editors-xtd”, “extension”, “finder”, quickicon”, “search”, “system” và “user”.
“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
29
Languages
Gói ngôn ngữ (Languages) cho phép bạn chạy website với nhiều ngôn ngữ khác nhau. Ví dụ, nếu bạn muốn sử
dụng tiếng Pháp cho website Joomla! của bạn trong cả hai phần front-end / back-end, bạn chỉ cẩn truy cập vào
“Extension Manager” => “Language Manager”. Sau đó nhấn vào nút “Install languages”, chọn French rồi
ấn nút “Install”.
“Language Manager”
Tất cả các gói ngôn ngữ được cài đặt sẽ hiển thị trong phần “Extensions” => “Language Manager” tại back-
end.
>>> Bước kế tiếp
Bây giờ bạn đã có được một số kiến thức về Joomla là gì rồi phải không, hãy thực hành luôn nhé. Cài đặt
Joomla! 3.x trên localhost và chạy thử nào.
“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
30
Bước 2: Cài đặt Joomla! 3.x trên localhost
Việc cài đặt Joomla! 3.x trên localhost khá đơn giản; tuy nhiên, nếu đây là lần đầu làm, bạn cần chú ý làm theo
các hướng dẫn để cài đặt cho đúng.
Đầu tiên, ta cần làm rõ khái niệm “Localhost”. Bạn biết đấy, bất kỳ một website nào cũng cần phải được lưu
trữ, sắp xếp trên một web server để hiển thị nội dung đến các users. Thông thường, bạn cần mua một gói
hosting từ nhà cung cấp hosting nào đó như Rackspace hay GoDaddy (Ở VN chúng ta có PaVietnam, Hostvn,
v.v.). Phụ thuộc vào gói hosting mà bạn chọn, nhà cung cấp hosting sẽ cài đặt một web server cho bạn trên
server của họ và cho phép người dùng truy cập đến nó. Một localhost về cơ bản giống với một web server; cái
khác ở đây là nó được cài đặt trên máy tính của các bạn.
Tuy nhiên, để chạy Joomla!, ngoài web server, bạn còn cần hai thứ quan trong nữa là: Ngôn ngữ thông dịch
PHP và Cơ sở dữ liệu MySQL. Nghe thì có vẻ phức tạp nhưng may mắn thay chúng ta có một gói phần mềm
là XAMPP đã tích hợp sẵn tất cả những thành phần ở trên.
Nào bây giờ hãy cài XAMPP trên máy tính của bạn.
“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
31
Cài đặt XAMPP
1. Tải gói cài đặt XAMPP tại địa chỉ http://www.apachefriends.org/en/xampp.html
2. Chạy file cài đặt và làm theo từng bước hướng dẫn, tương tự như các phần mềm thông thường khác.
3. Mở “XAMPP Control Panel Application”, chạy “Apache” và “MySQL”.
Bảng điều khiển chính của XAMPP
Như vậy, localhost đã được cài đặt trên máy tính của các bạn. Bạn hãy kiểm tra bằng cách gõ địa chỉ:
“http://localhost” vào trình duyệt. Giao diện của bạn sẽ xuất hiện như hình bên dưới.
“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
32
Giao diện của XAMPP cho Windows
“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
33
4. Tạo một cơ sở dữ liệu mới trong phpMyAdmin.
Từ giao diện của XAMPP, chọn phpMyAdmin để tạo một cơ sở dữ liệu mới.
Chọn “phpMyAdmin”
“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
34
5. Tiếp theo, chọn “Database” trong thanh công cụ hiển thị như hình bên dưới
Chọn “Database”
6. Tiếp theo, điền tên cơ sở dữ liệu và nhấn “Create”
Tạo database
Bây giờ bạn đã sẵn sang để cài đặt Joomla!.
“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
35
Cài đặt Joomla!
1. Tải gói cài đặt Joomla! 3.x tại http://www.joomla.org/download.html
2. Tạo một thư mục mới có tên là “Joomla3x” trong thư mục “htdocs” của XAMPP. Thông thường nó sẽ
được đặt trong “C:\xampp\htdocs”
3. Giải nén gói cài đặt đã tải về vào trong thư mục “Joomla3x”
4. Gõ vào thanh trình duyệt địa chỉ “http://localhost/Joomla3x”
5. Làm theo các bước cài đặt trong Joomla:
a. Bước 1. Cấu hình chung
Select Language: Chọn gói ngôn ngữ cho riêng bạn từ menu sổ xuống (drop-down menu), ví
dụ, “English (United States)”
Site Name: Điền tên website của bạn
Description: Điền thông tin mô tả cho website
Site Offline: Chọn trạng thái cho website của bạn khi bạn truy cập site: Chọn “Yes” nếu
muốn website “offline” và “No” cho website “online”
Admin Email: Điền thông tin địa chỉ email bạn muốn sử dụng cho website
Admin Username: Điền mặc định là “admin”
Admin Password: Nhập mật khẩu của bạn
Confirm Admin Password: Nhập lại mật khẩu của bạn
Nhấn “Next” để sang bước 2
b. Bước 2. Cấu hình dữ liệu
Database Type: Chọn MySQLi
Host Name: Điền “localhost”
Username: Điền “root”
Password: Để trống
Database Name: Nhập vào tên của cơ sở dữ liệu mà bạn đã tạo trước đó là “Joomla30”
Table Prefix: Để mặc định
Old Database Process: Nhấn “Backup” để sao lưu các bảng từ việc cài đặt hoặc “Remove” để
xóa các bảng
Nhấn “Next” để sang bước 3
c. Step 3. Các cấu hình cuối cùng
“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
36
Finalization: Bạn có thể chọn việc cài đặt dữ liệu mẫu cho website hoặc không bằng cách
nhấn vào những lựa chọn tương ứng.
Overview: Trong bước này, bạn sẽ đánh giá lại tổng quan toàn bộ thông tin bạn đã cấu hình
trong bước 1. Sau khi kiểm tra, nhấn “Install.”
Khi việc cài đặt hoàn tất, bạn chỉ cần nhấn vào nút “Remove installation folder” để hoàn tất
quá trình cài đặt. Sau cùng, bạn có thể nhấn vào “Site” để xem trang vừa tạo hoặc nhấn vào
“Administrator” để truy cập vùng quản trị dành cho Administrator.
Bây giờ bạn đã cài đặt xong cho mình website Joomla! đầu tiên rồi đó. Không quá khó khăn phải không? Nếu
có bất cứ vấn đề gì trong quá trình cài đặt, bạn có thể thử tìm cho mình câu trả lời từ những nguồn sau:
Diễn đàn chính thức của Joomla!
Diễn đàn Joomla! là một trong những diễn đàn hỗ trợ sôi động nhất (và thân thiện nhất) trên thế giới, đây
cũng là một nơi tuyệt vời để nhận được sự giúp đỡ cũng như gặp gỡ các thành viên Joomla! khác. Có
nhiều câu hỏi và câu trả lời được thảo luận tại đây. Bởi vì chủ đề của chúng ta là Cài đặt Joomla! 3.x,
vậy bạn có thể tìm kiếm sự giúp đỡ và câu trả lời trong chuyên mục “Installation Joomla! 3.x”.
Dịch vụ hỗ trợ Joomla! (http://joomla.cmshelplive.com/)
Đây là website cung cấp cho bạn dạng dịch vụ “Joomla! theo yêu cầu”. Tất nhiên là bạn phải trả tiền cho
những dịch vụ rồi, nhưng các vấn đề của bạn sẽ được giải quyết. bởi những chuyên gia Joomla!.
Những nguồn website học Joomla! khác
Có nhiều website hữu ích mà bạn có thể sử dụng để tự học về Joomla!, dưới đây là một vài ví dụ:
o http://docs.joomla.org/Beginners
o http://www.joomlatutorials.com/
o http://www.joomlablogger.net/
o http://www.ostraining.com/
>>> Bước tiếp theo
Cài đặt Joomla! 3.x thành công trên localhost là việc đầu tiên bạn cần làm trước khi bắt đầu với website
Joomla! Website của bạn sẵn sang rồi, bây giờ chúng ta tiến hành tạo nội dung cho nó .
“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
37
Bước 3: Tạo nội dung cho website Joomla
Thành phần quan trọng nhất của mỗi website đó là nội dung. Trong bước này, bạn sẽ:
1. Chuẩn bị cấu trúc nội dung
2. Tạo các chuyên mục và bài viết
3. Tạo một danh mục
4. Quản lý nội dung của bạn với JSN PowerAdmin
Chuẩn bị cấu trúc nội dung
Tạo một nội dung tương tự việc sắp xếp các sản phẩm vào trong một cửa hang tạp hóa vậy. Với Joomla!, các
bài viết giống như những sản phẩm, các chuyên mục thì giống như những kệ đựng sản phẩm và danh mục thì
giống như lối đi để tìm đến những cái kệ đó . Giả dụ bây giờ bạn có một website bán hàng; cấu trúc của nội
dung website có thể hình dung như thế này:
1. About (Giới thiệu)
a. About my site (Giới thiệu website)
b. How to purchase/order products (Mua hàng thế nào)
c. How to make payment (Thanh toán)
2. News (Tin tức)
a. Latest news (Tin tức mới nhất)
b. Arrivals (Hàng mới về)
c. Sale (Hàng giảm giá)
d. Coupons (Phiếu giảm giá)
e. Promotion (Khuyến mãi)
3. Support (Hỗ trợ)
a. Hotline information (Hỗ trợ khách hàng qua điện thoại)
b. Online customer services (Hỗ trợ khách hàng trực tuyến)
c. Contact us (Liên lạc)
“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
38
Tạo nội dung
Sau khi chuẩn bị cấu trúc nội dung của website trên giấy, bạn có thể tiến hành tạo nội dung đó trong Joomla!.
Hãy bắt đầu với việc tạo các chuyên mục.
Các chuyên mục
1. Vào “Content” => “Category Manager” và nhấn “Add New Category”
Thêm một chuyên mục mới
2. Tiếp theo, điền tên chuyên mục là “About” và nhấn “Save & Close” trên thanh công cụ.
Nhập thông tin cho chuyên mục
“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
39
Sau đó, ban có thể nhìn thấy chuyên mục “About” bạn mới tạo nằm bên trong phần “Category Manager”.
Chuyên mục “About”
Bạn có thể tạo tất cả các chuyên mục còn lại theo cách này.
“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
40
6 chuyên mục mới đã được tạo
Sau khi hoàn tất việc tạo các chuyên mục, hãy tạo các bài viế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
41
Bài viết
Hãy thêm mới một bài viết vào trong chuyên mục “About”.
1. Vào “Content” => “Article Manager” và nhấn “Add New Article”
Thêm mới bài viết
2. Tiếp theo, bạn điền thông tin vào các trường sau:
Title: Nhập vào tiêu đề “About my site”.
Category: Chọn chuyên mục “About” trong danh sách.
Article text: Nhập nội dung của bài viết.
Bây giờ, chúng ta chỉ nhập một bài viết đơn giản với chữ. Tiếp đến trong phần “Chỉnh sửa bài viết
đẹp hơn” chúng ta sẽ biết cách tạo các bài viết phức tạp hơn (Với hình ảnh, liên kết, v.v.)
“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
42
3. Nếu bạn muốn một bài viết hiển thị ở ngoài trang đầu, bạn đặt thiết lập giá trị tham số “Featured” là
“Yes”. Việc này sẽ làm bài viết hiện lên trên trang chủ của website.
Chọn “Yes”để hiển thị bài viết hiện lên trên trang chủ
Nếu bạn muốn thêm thẻ bài viết, hãy điền các thẻ đó vào tham số “Tags”.
Thêm thẻ bài viế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
43
4. Sau đó, nhấn nút “Save & Close” trên thanh công cụ để lưu lại bài viết mới tạo.
Nhấn nút “Save & Close” để lưu bài viết
Bây giờ bạn đã có một bài viết mới trong phần “Article Manager”.
Bài viết mới tạo “About my site”
Làm tương tự với hai bài viết “How to purchase/order products” và “How to make payment” trong chuyên
mục “About my site”.
“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
44
Ba bài viết mới tạo
Bây giờ bạn đã hoàn tất quy trình tạo bài viết, chỉ còn bước cuối cùng là tạo các danh mục với các liên kết đến
các bài viết này.
“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
45
Menus
Trong Joomla!, một danh mục(Menu) là một bộ các liên kết tới các thành phần đã có, như các bài viết bạn vừa tạo
chẳng hạn. Tất cả các danh mục trong back-end được đặt trong phần “Menus”. Theo mặc định, một danh
mục“Main Menu” được cài đặt sẵn trong Joomla!.
“Main Menu” được trình bày tại front-end
Hãy tạo mới một danh mục con trong danh mục “Main Menu”.
1. Nhấn vào “Main Menu” trong phần “Menus” sổ xuống như hình dưới.
“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
46
Nhấn “Main Menu”
2. Tiếp theo, nhấn vào “New” để tạo mới một danh mục con mới.
Nhấn vào “New” để tạo một danh mục con mới
3. Sau đó, nhấn “Select” để chọn loại danh mục con.
Chọn loại danh mục
“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
47
4. Kết quả là môt màn hình pop-up được hiển thị. Bạn có thể tạo liên kết đến nhiều thành phần như
“Contacts”, “Articles”, “Smart Search”, “Newfeeds”, v.v. Trong trường hợp này bạn cần tạo một liên
kết tới một bài viết, vì vậy hãy nhấn “Single Article”.
Chọn loại danh mục là “Single Article”
“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
48
5. Tiếp theo, bạn cần điền thông tin vào trường “Menu Title”, ví dụ“About my site”.
Nhập tiêu đề danh mục con
6. Sau đó, bạn chọn một bài viết mà bạn muốn hiển thị với danh mục đó. Trong phần bên phải ở hình
dưới, bạn chọn “Select” để chọn một bài viết.
Chọn nút “Select”
“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
49
7. Một màn hình pop-up sẽ hiển thị. Chọn bài viết “About my site”.
Nhấn vào bài viết mà bạn muốn lựa chọn
8. Nhấn “Save & New” để tạo tiếp hai danh mục nữa cho hai bài viết là “How to purchase/order products”
và “How to make a payment”.
Nhấn “Save & New”
“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
50
Sau khi tạo xong những menus này, bạn đã có 3 danh mục con mới.
Có 3 danh mục con mới đã được tạo
“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
51
Thẻ bài viết
Bạn có thể tạo một danh mục hay Module mới để hiển thị thẻ bài viết của bạn.
Tạo một Danh mục thẻ bài viết (Tag Menu): Vào “Menus” => “Menu Manager” => “Add New
Menu” sau đó chọn loại “Tags”.
Tạo một menu mới để hiển thị các thẻ bài viết của bạn
Tạo một Module thẻ bài viết (Module Tag): Vào“Module Manager” => “New” => chọn loại “Popular
Tags”.
Tạo một module mới để hiển thị các thẻ bài viế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
52
Bây giờ bạn có thể ra ngoài front-end để xem kết quả.
Các danh mục con mới trong Main Menu
“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
53
Khi bạn nhấn vào mỗi một liên kết thì bạn sẽ thấy một bài viết tương ứng mà bạn đã gán trước đó.
Bài viết“About my site”
Bây giờ bạn có thể lặp lại các bước làm như trên để tạo liên kết đển tất cả các bài viết cần thiế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
54
Quản lý nội dung của bạn với JSN PowerAdmin
Khi làm việc với Joomla!, nếu bạn có quá nhiều danh mục, bài viết hay modules, bạn có thể thấy khó khăn khi
tìm kiếm những thứ này. Có một extension miễn phí giúp bạn giải quyết vấn đề này một cách nhanh chóng và
tiện lợi - JSN PowerAdmin.
JSN PowerAdmin sẽ giúp bạn:
1. Tìm kiếm một cách nhanh chóng các mục trong back-end với Spotlight Search. Bạn có thể tiết kiệm thời
gian trong khi tìm kiếm các mục cần chỉnh sửa.
2. Điều khiển nội dung website chỉ trên một trang với Site Manager. Ở đây, người quản trị
(Administrators) có thể chỉnh sửa một bài viết hoặc quản lý các modules và các danh mục với tính năng
kéo thả rất tiện lợi.
Quản lý website với JSN PowerAdmin
Extension này được người dùng Joomla! trên JED đánh giá cao với hơn 30+ bình chọn và hơn 30+ đánh giá.
Tải JSN PowerAdmin miễn phí - Xem video giới thiệu JSN PowerAdmin.
“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
55
Chỉnh sửa bài viết đẹp hơn
Vậy là bạn đã biết cách tạo các bài viết. Giờ thì chúng ta học nâng cao hơn và tạo các bài viết đẹp, hữu ích
hơn. Có nhiều cách để bạn làm điều này, chẳng hạn như: định dạng văn bản, thêm hình ảnh, liên kết, v.v.
Định dạng văn bản
Nếu bạn đã từng làm việc với Microsoft Word hoặc bất cứ trình soạn thảo nào khác thì kiểu định dạng văn bản
trong Joomla! sẽ không còn xa lạ với bạn nữa. Tuy nhiên, nó đơn giản hơn so với Microsoft Word vì nó chỉ
cung cấp một vài tùy chỉnh định dạng văn bản đơn giản mà thôi.
Bạn truy cập tới Article Manager và mở bài viết“About my site”. Bây giờ hãy chú ý đến vùng soạn thảo. Đây
là nơi mà bạn chỉnh sửa bài viết của chính mình:
Chỉnh sửa bài viết
Hãy nhìn kỹ các định dạng bên dưới – hầu hết các biểu tượng đều rất quen thuộc, với những biểu tượng để tạo
dòng chữ của bạn đậm hơn, nghiêng hay gạch dưới và các biểu tượng để chỉnh sửa văn bản của bạn. Hãy chọn
đoạn văn bản mà bạn muốn định dạng sau đó nhấn vào biểu tượng thích hợp.
Các nút định dạng văn bản Joomla!
“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
56
Bạn có thể tạo những tựa đề (headings) ở các định dạng khác nhau bằng cách nhấn vào mũi tên chỉ xuống trong
ô “paragraph”, rồi nhấn vào tựa đề tương ứng sổ xuống, từ “Heading 1” tới “Heading 6”.
Chọn định dạng tiêu đề cho đoạn văn
Bạn có thể thấy dòng chữ này lớn hơn:
Đoạn văn với định dạng Heading 1
“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
57
Thêm hình ảnh
Trước khi thêm các hình ảnh vào các bài viết, bạn nên tổ chức và sắp xếp chúng vào trong một thư mục đặc biệt.
Việc này giúp cho việc tìm kiếm và quản lý chúng dễ dàng hơn nhiều.
Tạo các thư mục hình ảnh
1. Vào “Content” => “Media Manager”, sau đó nhấn “Create Folder” trên thanh công cụ.
2. Nhập tên thư mục và nhấn “Create Folder”.
Tạo thư mục mới để lưu trữ hình ảnh
Bây giờ bạn đã có một thư mục mới trong Media Manager.
Thư mục“aboutmysite” trong Media Manager
“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
58
Tải lên hình ảnh
Bây giờ bạn hãy tải những hình ảnh vào trong thư mục “aboutmysite” mà bạn vừa tạo.
1. Nhấn vào thư mục “aboutmysite”, sau đó nhấn vào nút “Upload” màu xanh.
Nhấn “Upload”
2. Tiếp theo, nhấn “Choose files” để duyệt các tập tin hình ảnh.
Chọn các tập tin
3. Chọn tập tin hình ảnh bạn muốn tải lên. Bây giờ bạn chỉ có thể chọn một tập tin cho mỗi lần tải lên.
Chúng tôi sẽ cho bạn thấy cách để chọn nhiều tập tin để tải lên cùng một lúc sau.
“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
59
Chọn hình ảnh
4. Nhấn nút “Start Upload” để upload hình ảnh.
Bắt đầu tải hình ảnh lên
Bây giờ, hình ảnh mới của bạn đã được tải lên trong thư mục “aboutmysite”.
“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
60
Hình ảnh hiển thị trong thư mục “aboutmysite”
Với cách này, mỗi lần làm bạn chỉ có thể tải lên một ảnh. Cách này rất tốn thời gian và công sức nếu bạn cần tải
nhiều ảnh lên. Rất may, có một cách khác cho phép tải lên nhiều tập tin một lúc - chức năng flash uploader.
Bạn chú ý rằng cách này yêu cầu bạn cài đặt Flash Player trên máy tính của bạn trước. Hãy thử với cách này
nhé.
1. Trong Media Manager, nhấn “Options” trên thanh công cụ.
Nhấn nút “Options”
“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
61
2. Trong trang “Media Manager Options”, thiết lập tham số “Enable flash uploader” là “Yes” và nhấn
“Save & Close”.
Bật tính năng flash uploader
“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
62
3. Trở lại màn hình chính như hình bên dưới. Bây giờ bạn hãy nhấn “Browse files” để tìm đến nơi chứa tập
tin bạn muốn tải lên.
Duyệt tới tập tin
4. Để chọn nhiều tập tin, dùng chuột kéo chọn tất cả hoặc giữ phím “CTRL” và nhấn lần lượt lên các tập
tin bạn muốn chọn, sau đó nhấn “Open”.
Chọn ảnh
“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
63
5. Nhấn chọn nút “Start Upload” và chờ cho tới khi quá trình tải lên hoàn tất.
Tải các ảnh lên
Bây giờ bạn đã có các hình ảnh trong thư mục.
Các ảnh mới được tải lên
“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
64
Thêm ảnh vào bài viết
Sau khi tải các hình ảnh được tải lên server, bạn có thể thêm chúng vào trong bài viết của bạn. Hãy thử với
bài viết“About my site”.
1. Sau khi mở bài viết, bạn trỏ chuột tới một điểm của đoạn văn mà bạn muốn chèn hình ảnh vào và nhấn
nút “Image” bên dưới khung soạn thảo.
Thêm ảnh vào trong văn bản
“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
65
2. Chọn ảnh để thêm vào văn bản.
Mở thư mục hình ảnh
“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
66
3. Nhập phần miêu tả ảnh (Image Description) và tiêu đề ảnh (Image Title) và nhấn nút “Insert” phía trên
của hình để hoàn tất việc chèn ảnh.
Chọn hình ảnh bằng cách nhấn vào nó sau đó điền các thông tin cần thiế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
67
4. Kiểm tra lại xem ảnh đã được chèn vào bài viết chưa.
Một hình ảnh được chèn vào bài viết
Bây giờ, nếu bạn thấy ảnh to quá, nhỏ quá hoặc chưa được đặt đúng ý bạn, bạn có thể thay đổi kích thước ảnh
hoặc căn lề. Nhấn vào hình ảnh sau đó nhấn vào nút “Insert/edit image” trong phần tùy chỉnh định dạng phía
trên khung soạn thảo bài viết để chỉnh sửa nó.
Nút chỉnh sửa/chèn hình ảnh
Một màn hình pop-up sẽ hiển thị. Tại đây bạn có thể chỉnh sửa hình ảnh như bạn muốn. Ví dụ, thử thay đổi kích
thước và canh lên sang phải (“Right”), sau đó nhấn nút “Update” bên dưới.
“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
68
Chỉnh sửa ảnh
Nhấn nút “Save & Close” trên thanh công cụ trong “Article Manager” và ra ngoài front-end để xem bài viết
sau khi được chèn mới hình ảnh.
“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
69
Bài viết với hình ảnh trong website
“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
70
Thêm các liên kết
Thêm liên kết nội bộ
Trong nhiều bài viết, bạn cần các liên kết nội bộ (Kết nối với các bài viết khác trên website của bạn). Những liên
kết này không chỉ giúp ích cho những người đọc bài viết mà còn tốt cho cả việc tối ưu hóa công cụ tìm kiếm
(Search Engine Optimization hay SEO). Hãy xem cách tạo các liên kết nội bộ trong một bài viết dưới đây.
1. Mở bài viết bạn muốn thêm liên kết nội bộ.
2. Chọn đoạn văn bản bạn muốn liên kết.
3. Nhấn vào nút “Article” bên dưới trình soạn thảo bài viết
Chèn một liên kết vào trong bài viết
4. Bây giờ bạn sẽ nhìn thấy một cửa sổ pop-up chứa danh sách tất cả các bài viết của bạn. Tìm bài viết bạn
muốn liên kết tới và sau đó nhấn chọn lên tiêu đề của bài viết đó.
Chọn bài viết tương ứng
“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
71
Kết quả là, tiêu đề của bài viết đã chọn được sử dụng như một đoạn liên kết.
Liên kết mới trong đoạn văn bản
Bạn có thể thay đổi liên kết đoạn văn bản trên giống như đoạn văn bản cũ.
Đoạn liên kết sau khi được chỉnh sửa
“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
72
5. Nhấn “Save” và truy cập đến phần front-end để xem bài viết với liên kết mới tạo.
Bài viết với liên kết trong front-end
Nếu bạn muốn chỉnh sửa một liên kết, bạn chỉ cần chọn nó và nhấn vào biểu tượng “Insert/edit link” giống
như hình bên dưới.
“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
73
Chỉnh sửa liên kết
Hoặc bạn có thể bỏ liên kết từ đoạn văn bản bằng cách nhấn vào biều tượng “Unlink”.
Bỏ liên kết trong bài viế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
74
Thêm các liên kết bên ngoài
Trong phần trước bạn đã học cách tạo các liên kết nội bộ, những liên kết này sẽ kết nối tới các bài viết khác trên
website của bạn. Trong phần này, bạn sẽ biết cách làm thể nào để tạo các liên kết bên ngoài đến bất kỳ website nào
bạn muốn trên Internet.
1. Chọn đoạn văn mà bạn muốn gán liên kết đến, sau đó nhấn vào biểu tượng “Insert/edit link”.
Thêm liên kết bên ngoài
Một cửa sổ pop-up sẽ hiển thị bên dưới:
Thêm một liên kết bên ngoài
“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
75
2. Nhập vào giá trị cho 4 tham số trong hình bao gồm:
Link URL
Địa chỉ liên kết bạn muốn gán.
Target
Có hai tùy chọn cho bạn ở đây: Mở liên kết ngay trong cùng một cửa sổ (“Open link in the same
window”) và Mở liên kết trong một cửa sổ mới ( “Open link in a new window”). Nếu bạn chọn “Not
set”, liên kết sẽ được mở trong cùng một cửa sổ)
Title
Nhập một mô tả ngắn cho liên kết.
Class
Là người mới làm quen với Joomla!, bạn cứ đặt giá trị “Not set” (Ngoài ra có hai tùy chọn khác là
“Caption” và “System Page break”)
3. Nhấn “Insert” để chèn liên kết này. Sau đó bạn có thể xem đoạn văn bản đã được liên kết tới website
bên ngoài.
Văn bản được liên kế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
76
Thêm “Page Break” và “Read More”
Trong trường hợp những bài viết có nội dung dài, có thể bạn sẽ muốn chia bài viết thành những những phần
nhỏ riêng biệt. Với Joomla! Bạn có hai tùy chọn để làm việc này.
1. Page Break
Page Break (hay “Phân Trang”) giúp chia bài viết thành các phần riêng biệt như Trang 1, Trang 2, Trang
3, v.v. Page breaks rất có ý cho những bài viết có nội dung dài.
2. Read More
Read More (hay “Đọc Thêm”) giúp chia một bài viết đầy đủ thành hai đoạn: Một đoạn giới thiệu và phần
còn lại của bài viết. Nếu bạn muốn đọc nốt phần còn lại của bài viết, bạn phải nhấn vào liên kết “Read
More”.
Bây giờ chúng ta sẽ học cách thêm Page Break và Read More.
Thêm một “Page Break”
1. Đặt con trỏ vào nơi mà bạn muốn chia bài viết.
2. Nhấn nút “Page Break” bên dưới trình soạn thảo bài viết.
Thêm một page break
“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
77
3. Thêm tiêu đề bạn muốn đưa vào trang mới trong trường “Page Title” và nhấn “Insert
Page Break”.
Thêm một Page Break
4. Đã xong, bây giờ bạn sẽ thấy một dòng các dấi chấm hiển thị trong bài viết của bạn như trong hình bên
dưới.
Dòng chấm hiển thị một page break
5. Nhấn “Save”.
“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
78
6. Xem kết quả trên front-end của bạn. Bạn sẽ thấy một danh sách bên cạnh bài viết – bạn chỉ cần nhấn lên
tiêu đề hoặc “Next” để xem trang chứa các phần văn bản khác.
Thêm mới page break trong website
Chú thích:
Bạn có thể thêm nhiều page breaks vào bài viết.
Bạn có thể xóa môt page break bằng cách mở bài viết (trong phần back-end), đặt trỏ chuột vào phần
cuối đường chấm của page break và nhấn phím “Backspace”.
“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
79
Thêm một liên kết “Read More”
Thêm một liên kết “Read More” khá giống với thêm một page break (phân trang).
1. Đưa con trỏ văn bản tới vị trí bên trong bài viết nơi mà bạn muốn chia phần mở đầu và phần nội dung
chính.
2. Nhấn nút “Read More” bên dưới trình soạn thảo bài viết.
Chèn một liên kết Read more
Bạn sẽ thấy một dòng chấm đỏ như bên dưới.
Đường chấm đỏ “Read more”
3. Nhấn “Save” để hoàn tất.
Bây giờ bài viết của bạn đã có một liên kết “Read more” ở front-end. Bạn chỉ cần nhấn vào nút “Read
more…” để đọc đầy đủ bài viế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
80
Bài viết với liên kết “Read more”
“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
81
Bước 4: Tùy chỉnh giao diện website của bạn
với Joomla! template
Chúng ta đã hoàn tất việc chuẩn bị nội dung. Bây giờ là lúc quan tâm đến giao diện của một website.
Joomla! template là gì?
Như đã đề cập trước đó, một template quản lý việc hiển thị đồ họa website của bạn. Nó quyết định bố cục, màu
sắc, kiểu chữ, đồ họa cùng nhiều thành phần khác để tạo nên sự khác biệt cho mỗi website. Có hai loại
templates: “Site template” cho phần hiển thị tại front-end của website và “Administrator template” cho phần
hiển thị tại back-end (Phần quản trị) của website.
Site template
Site template quyết định giao diện ở front-end của một website – phần mà khách viếng thăm nhìn thấy được.
Một Site template
Thông thường, bạn sẽ làm việc với các Site templates nhiều hơn các Administrator template, để tạo nên giao
diện hợp lý cho website của bạn.
“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
82
Administrator template
Administrator template quyết định giao diện back-end (Phần Quản trị) của một website.
Một Administrator template
Nếu bạn đang xây dựng một website cho một mình bạn bạn thì việc thay đổi giao diện ở phần quản trị không
quan trọng lắm. Nhưng khi bạn xây dựng website cho khách hàng, bạn có thể cần tùy chỉnh phần giao diện này
cho phù hợp với khách hàng.
“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
83
Chọn Joomla! template
Nguồn Template
Cách nhanh và dễ nhất để thiết kế giao diện cho website của bạn là sử dụng các Joomla! template có sẵn. Có rất
nhiều templates cho bạn trên Internet.
Nguồn templates miễn phí
Cộng đồng Joomla! cung cấp hàng ngàn templates miễn phí cho bạn lựa chọn. Các bạn có thể lựa chọn từ
những nguồn sau:
http://www.joomla24.com/
http://www.joomlaos.de/
http://www.bestofjoomla.com
Nguồn templates có trả phí
Nếu ngân sách của bạn cho phép, bạn có thể mua cho mình một template, chúng tôi khuyên bạn nên mua những
templates này tại các nhà cung cấp Joomla! templates như:
http://www.joomlart.com
http://www.rockettheme.com
http://www.joomlashine.com/
http://www.yootheme.com
http://www.gavick.com
Các nguồn template khác trên Internet
Bạn có thể tìm kiếm trên Google với các từ khóa: “Joomla Templates” hoặc “template for Joomla” và bạn sẽ
thấy có đến 60 triệu kết quả được trả về!
“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
84
Các tiêu chuẩn để chọn lựa Template
Có rất nhiều Joomla! template để bạn lựa chọn. Đây là một vài tiêu chuẩn có thể giúp cho bạn tìm cho mình
một template vừa ý.
Tính tương thích
Template hỗ trợ phiển bản Joomla! nào? Bạn cần chọn cho mình một template hỗ trợ Joomla! 3.x
Phải trả phí hay miễn phí
Bạn muốn một template chất lượng tốt và được hỗ trợ hay bạn eo hẹp về tài chính và chỉ cần một
template miễn phí? Thông thường, các templates trả phí linh hoạt hơn, chất lượng cao hơn, có nhiều tài
liệu hướng dẫn hơn và được hỗ trợ tốt hơn là template miễn phí.
Tài liệu hướng dẫn sử dụng
Tài liệu hướng dẫn sử dụng có tốt không? Tài liệu này có giúp bạn hiểu rõ hơn về các tính năng của
template không? Nó có giúp bạn tùy chỉnh template không?
Hỗ trợ
Template có được hỗ trợ không? Bạn có thể được hỗ trợ như thế nào? – Qua diễn đàn, hệ thống hỗ trợ qua
ticke, v.v.? Thời gian bạn nhận được câu trả lời là bao lâu? 12 giờ, 24 giờ hay phải nhiều ngày sau?
Thiết kế
Khi nhìn và cảm nhận website, bạn có thấy nó đúng như mình mong muốn không? Nếu nó giống là
thiết kế đó, bạn sẽ không mất nhiều thời gian để tùy chỉnh. Nếu không, bạn cần kiểm tra xem nó có
dễ tùy chỉnh theo ý bạn không?
Các tính năng
Các templates chuyên nghiệp cung cấp khá nhiều tính năng trong khi trong phần lớn các template miễn
phí, các tính năng bị hạn chế khá nhiều.
Nếu bạn là cá nhân hay người sử dụng thông thường thì một template miễn phí sự lựa chọn phù hợp. Tuy nhiên
nếu bạn đang tạo website cho công việc hay kinh doanh thì bạn nên mua một template trả phí phí từ những nhà
cung cấp chuyên nghiệp. Đừng nghĩ rằng cách này lãng phí tiền, vì ngoài “code” và phần thiết kế chất lượng
cao hơn ra, bạn có còn được nhiều tài liệu hướng dẫn và sự hỗ trợ hữu ích khác nữa. Thời gian mà bạn tiết kiệm
được sẽ xứng đáng với số tiền bạn bỏ ra.
“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
85
Cài đặt Joomla! template
Sau khi chọn cho mình được một mẫu Joomla! template thích hợp rồi, bây giờ chúng ta sẽ cài đặt nó.
1. Vào “Extensions” => “Extension Manager”
Extensions => Extension Manager
2. Nhấn “Browse…”, tìm tập tin template mà bạn đã tải về, sau đó nhấn “Upload & Install”. Tiếp theo bạn
sẽ nhận được thông báo rằng template đã được cài đặt thành công.
Duyệt tới tập tin template từ máy tính của bạn
3. Bây giờ bạn đã có một template mới được cài đặt, hãy dùng nó cho website của bạn. Bạn vào “Extensions”
=> “Template Manager”
“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
86
Chọn “Template Manager”
4. Chọn template mà bạn muốn dùng, sau đó từ top menu bên trái chọn biểu tượng “Make Default” để nó
được chọn mặc định cho website Joomla! của bạn.
Chọn “Make Default”
“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
87
5. Bây giờ bạn có thể xem lại tổng quan thiết kế ở phần front-end bằng cách nhấn vào tên website ở phía trên
bên trái trong phần Quản trị.
Nhấn vào tên website để xem phần thiết kế front-end
“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
88
Tạo giao diện đa phong cách để gán tới các danh mục
Bạn có thể dùng các template khác nhau trên các trang khác nhau trong website của bạn.
Trong website này, hầu hết các trang dùng Beez2, ngoại trừ một trang sử dụng Beez3
Ví dụ, bạn có một website đang dùng template Protostar, bạn muốn một trang trong website này dùng template
Beez3. Bạn có thể thực hiện điều này dễ dàng bằng cách làm theo các bước bên dưới:
“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
89
Tạo mới một danh mục ở Top menu có tên là Beez3: Vào Menus -> Main Menu -> Add New Menu. Bạn có
thể chọn bất kỳ mục menu nào bạn muốn, ví dụ chúng ta chọn danh mục loại “ Single article”, đặt tiêu đề danh
mục là “Beez3”, Chọn bài viết “Getting Started” sau đó lưu menu này lại.
Tạo danh mục “Beez3”
Sau đó bạn vào Extensions -> Template Manager -> Beez3. Tại đây, trong phần “Menus assignment”, bạn
chọn danh mục Beez3.
Chọn danh mục “Beez3”
Bây giờ bạn lưu lại menu và tới phần front-end để xem kết quả.
Chú ý:
Bạn chỉ có thể gán một template vào một danh mục. Nếu bạn gán từ hai template trờ lên thì chỉ có template mới
nhất được áp dụng.
“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
90
Bước 5: Sắp xếp modules ở các vị trí
Chú ý: Bạn có thể thực hiện việc này dễ dàng với JSN PowerAdmin và tính năng quản lý các modules trực
quan của nó.
Joomla! module và Joomla! position là gì?
Như đã đề cập trước đó, một module thực hiện một nhiệm vụ đơn giản nào đó và hiển thị nội dung trong một
khối thông tin nhỏ trên trang. Mỗi một module nằm trong một vị trí đặc biệt, ví dụ module “Latest Article” và
“Login Form” nằm ở bên trái. Mỗi một vị trí được thiết kế để sử dụng trong một phần bố cục của trang, như vị
trí “left” được đặt ở phía bên trái của trang chính. Các template có thể có nhiều vị trí khác nhau được bố trí ở
những nơi khác nhau trên một trang.
Đây là một cách khác để bạn hình dung vể khái niệm này. Cứ xem website của bạn như một bức tường, trên
bức tường đó, có những tấm bảng (module positions) được treo ở những vị trí khác nhau. Trên mỗi tấm bảng,
có những tờ giấy nhớ (modules) được ghim lại. Bạn thấy đấy, vậy là bạn có một bức tường dán đầy giấy nhớ
(modules) được sắp xếp trên một cái bảng (positions) treo trên tường.
Có hai loại modules là: “Site module” dùng cho phần front-end và “Administrator module” dùng cho phần
quản trị back-end.
Site modules tại front-end
“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
91
Làm thế nào bạn có thể nhìn thấy được vị trí của các module trong một template?
Sẽ rất khó để xem được tất cả những vị trí module trong một template khi chỉ nhìn vào một website. Rất may,
Joomla! cung cấp cho bạn một công cụ để có thể thấy được tất cả các vị trí đó. Hướng dẫn sau giúp bạn sử
dụng nó:
1. Vào “Extensions” => “Template Manager”.
2. Trong phần Template Manager, nhấn biểu tượng “Options” trên thanh công cụ.
3. Tiếp theo, thiết lập tham số của “Preview Module Positions” thành “Enabled” và nhấn “Save & Close”.
Bật tính năng xem trước vị trí của module
4. Bây giờ, nhấn vào thẻ “Template”.
Nhấn vào thẻ Template
5. Những template đã cài đặt dược hiển thị trên màn hình. Bạn kéo chuột xuống template Beez3 và nhấn
Preview để xem các vị trí module của template này.
“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
92
Nhấn Preview
6. Tất cả các vị trí module của template sẽ được hiển thị giống như hình bên dưới.
“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
93
Các vị trí Module của trang
Bây giờ bạn có thể thấy được tất cả các vị trí module của template. Việc này sẽ giúp bạn chọn đúng vị trí bạn
cần khi thêm mới một module.
“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
94
Thêm mới một module
Bây giờ bạn đã khá quen thuộc với khái niệm về Joomla! Module và Joomla! Position rồi, hãy tiếp tục với phần
tạo mới một module cho website của bạn.
Làm quen với những modules mặc định
Mặc định Joomla! cung cấp cho chúng ta khá nhiều modules để dùng, hãy xem qua nhé:
Module người dùng (User modules)
Các module được thiết kế cho việc trình bày và dịch vụ người dùng.
Who’s online
Module này hiển thị số khách và thành viên đang truy cập website của bạn.
Latest Users
Module này hiển thị những thành viên đã đăng ký mới nhất.
Login
Module này hiển thị một form đăng nhập với tên, mật khẩu và một vài liên kết khác như đăng ký hay lấy
lại mật khẩu.
Module nội dung (Content modules)
Các module được thiết kế để trình bày bài viết.
Latest News
Module này hiển thị một danh sách các bài viết đã được đăng.
Most Read Content
Module này hiển thị danh sách các bài viết được đăng và có số lượt xem cao.
Article - News flash
Module tin nhanh sẽ hiển thị một số lượng bài viết nhất định trong một chuyên mục cụ thể nào đó.
Article - Related Articles
Module này hiển thị các bài viết khác liên quan đến nội dung bài viết đang được xem.
Archive Articles
Module này hiển thị một danh sách các bài viết được lưu trữ trong tháng.
Article categories
Module này sẽ hiển thị các chuyên mục con của một chuyên mục cha.
Articles category
Module này cho phép bạn hiển thị các bài viết trong một chuyên mục.
“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
95
Module hiển thị (Display modules)
Các module được thiết kế cho việc hiển thị nội dung phong phú hơn.
Custom HTML
Cho phép bạn tạo những đoạn HTML có thể tùy chỉnh theo ý của bạn. Module này dùng với trình soạn
thảo WYSIWYG.
Feed display
Module này cho phép hiển thị một nguồn cấp dữ liệu web. Xem thêm tại đây.
Footer
Module này hiển thị thông tin bản quyền Joomla!.
Random image
Module này hiển thị một hình ảnh ngẫu nhiên nào đó từ thư mục ảnh mà bạn đã chọn.
Weblinks
Module này hiển thị danh sách các liên kết trong một chuyên mục.
Banner
Module banner cho phép bạn sử dụng để hiển thị các biển ngữ trong phần “Banners Component”.
Module tiện ích (Utility modules)
Các modules được thiết kế để thực hiện một nhiệm vụ nhỏ nào đó.
Smart Search Module
Module này dùng cho việc tìm kiếm bằng cách dùng Smart Search component.
Wrapper
Module này hiển thị một cửa sổ iFrame đến vị trí đặc biệt nào đó.
Language switcher
Module này hiển thị một danh sách các ngôn ngữ có sẵn cho việc chuyển đổi nội dung sang ngôn ngữ
khác.
Search
Module này sẽ hiển thị một hộp thoại tìm kiếm.
Thống kê
Module thông kê, module này thống kê thông tin về server của bạn, thành viên website, bài viết, các liên
kết, etc.
Syndicate Feeds
Module Syndicate sẽ hiển thị liên kết cho phép thành viên nhận thông tin từ website của bạn.
“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
96
Module tiện ích (Utility modules)
Các module này được thiết kế nhằm hiển thị điều hướng webite.
Menu
Module này hiển thị một danh mục trên website.
Breadcrumbs
Breadcrumb là tập hợp các đường link phân cấp giúp người dùng có thể biết được mình đang ở trang nào
và từ đó có thể di chuyển thuận lợi từ trang này trang khác trong 1 website.
Thêm mới một module
Bây giờ, hãy xem cách thêm mới một module.
1. Vào “Extensions” => “Module Manager”, sau đó chọn “New” trên thanh công cụ.
Nhấn “New” để thêm mới một module
“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
97
2. Trong cửa sổ pop-up, chọn module bạn muốn thêm. Ví dụ bạn muốn thêm một module đăng nhập
(“Login”) để cho phép thành viên đăng nhập vào website.
Chọn module “Login”
“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
98
3. Bây giờ bạn chỉ cần nhập thông tin cho module mới của mình. Đừng quên chọn vị trí mà bạn muốn
module này hiển thị trên web site.
Nhập thông tin cho module
4. Cuối cùng, nhấn vào “Save & Close” để hoàn tất quá trình. Bây giờ các bạn truy cập front-end của
website và xem kết quả!
Module đăng nhập trên website
Bạn có thể thêm nhiều module với cách làm tương 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
99
Cấu hình cài đặt các modules
Sắp xếp thứ tự các modules
Bây giờ bạn đã biết rằng tất cả các modules được đặt trong một vị trí như thế nào rồi, vậy giờ chúng ta sẽ sắp
xếp các module này bằng chức năng kéo thả (drag and drop). Cách làm như sau:
1. Vào “Module Manager”.
2. Nhấn vào biểu tượng để kéo và thả module vào vị trí mới.
Nhấn để kéo thả module vào vị trí mới.
“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
100
Bước 6: Mở rộng chức năng của website với
Joomla! extensions
Như đã đề cập trước đó, 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ụ nếu bạn
muốn có một slideshow hình ảnh, bộ sưu tập Videos hay Form liên hệ với nhiều chức năng nâng cao hơn, thì
bạn cần phải cài đặt các extensions cho những mục đích tương ứng. Để thêm thông tin về Joomla! Extensions,
bạn vui lòng coi lại phần Các thành phần mở rộng (Extensions) đã được đề cập trước đó.
Mặc định thì Joomla! đã được đóng gói kèm khá nhiều extensions đủ đế thực hiện những chức năng cơ bản.
Banners
Extension này giúp cho việc quản lý và hiển thị các biểu ngữ.
Contacts
Extension này giúp bạn quản lý liên lạc và hiển thị thông tin liên hệ.
Newsfeeds
Extension này giúp cho việc quản lý và hiển thị RSS.
Redirect
Extension này giúp quản lý chuyển hướng các URL.
Weblinks
Extension này giúp quản lý và trình bày các liên kết.
Hãy xem kỹ hơn một chút về một trong các extensions mở rộng của Joomla! để hiểu hơn về cách thức làm việc
của nó với Joomla!.
“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
101
Làm việc với thành phần mở rộng (Extensions) mặc định “Contacts”
Trong phần này, chúng ta sẽ học làm thể nào để sử dụng extension “Contacts” của Joomla! Extension này cho
phép bạn tạo các biểu mẫu (form) liên hệ để mọi người (khách, thành viên) có thể gửi email tới bạn.
Tạo chuyên mục liên hệ
Chúng ta cần tạo các danh sách liên hệ trước khi thành viên có thể gửi tới cho chúng ta email thông qua biểu
mẫu liên hệ nào đó. Nhưng để tổ chức phần liên hệ tốt hơn, chúng ta cần tạo các chuyên mục liên hệ trước.
1. Vào “Components” => “Contacts” => “Categories”
Chọn các chuyên mục liên hệ
2. Tiếp theo, chọn “New” trên thanh công cụ để tạo mới một mục liên hệ.
Chọn “New” để tạo một mục liên hệ mới
3. Sau đó, điền tiêu đề cho mục liên hệ của bạn, ví dụ “Website Administrators”, và lưu lại bằng cách nhấn
vào “Save & Close”.
“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
102
Mục liên hệ mới
“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
103
Tạo mới một liên hệ
Khi mục liên hệ đã được tạo xong, bạn có thể tạo các liên hệ riêng lẻ mà bạn muốn.
1. Các bạn vào “Components” => “Contacts” => “Contacts”
Nhấn vào danh mục con "Contacts"
2. Tiếp theo, nhấn vào “New” trên thanh công cụ để tạo mới liên hệ.
Nhấn “New” để tạo một liên hệ mới
3. Sau đó, điền thông tin vào các trường trong phần “Edit Contact”:
Name
Điền tên liên hệ - Có thể là tên của bạn.
Category
Chọn chuyên mục liên hệ mà bạn đã tạo trước đó.
“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
104
Nhập thông tin liên hệ
4. Tiếp theo, trong thẻ “Contact Details”, điền địa chỉ email liên hệ trong phần “Email”. Đây là tham số
rất quan trong vì sau đó tất cả các thông tin liên hệ để được gửi đến địa chỉ email này.
Nhập email liên hệ
5. Cuối cùng, nhấn “Save & Close” để lưu lại liên hệ này.
“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
105
Tạo một danh mục con để hiển thị biểu mẫu liên hệ
Bây giờ bạn đã tạo một biểu mẫu liên hệ để gửi liên hệ tới nó, lúc này hãy tạo một form cho thành viên để họ
có thể gửi liên hệ được cho bạn.
1. Vào “Menus” => “Main Menu” => “Add new menu items”
Thêm mới một danh mục con
2. Tiếp đó, nhấn “Select” để chọn loại danh mục con.
Nhấn chọn loại danh mục con
“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
106
3. Tiếp, chọn “Single Contact”.
Chọn “Single Contact”
“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
107
4. Tiếp theo, bạn cần chọn mẫu liên hệ mà bạn muốn bằng cách nhấn vào “Select”.
Nhấn “Select”
5. Sau đó nhấn vào liên hệ bạn đã tạo trước đó.
Nhấn để chọn liên hệ đã tạo trước đó
“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
108
6. Điền tiêu đề cho “Menu Title” như bạn muốn, ví dụ “Contact”.
Điền tiêu đề trong “Menu Title”
7. Cuối cùng, nhấn “Save & Close” để lưu lại menu item này.
“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
109
Bây giờ, hãy truy cập front-end của website để xem kết quả. Phần “Main Menu” đã có thêm một mục mới là
“Contact”. Nhấn vào và bạn sẽ thấy biểu mẫu liên hệ xuất hiện.
Biểu mẫu liên hệ trên website
Chúng ta đã thêm mới một form liên hệ cơ bản cho website. Để tùy chỉnh thêm, bạn có thể sử dụng một số
lựa chọn có sẵn.
“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
110
Tùy chình thêm
Vào “Contacts” hay “Categories” và nhấn vào biểu tượng “Options” trên thanh công cụ.
Nhấn vào "Options"
“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
111
Ở đây bạn có thể cấu hình tất cả các tham số bạn cần.
Các tham số của biểu mẫu liên hệ
“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
112
Thêm mới Extension
Các Joomla! extensions mặc định phù hợp cho những người mới bắt đầu, nhưng sau một thời gian làm quen
với Joomla!, bạn có thể cảm thấy chúng chưa đủ. Trong quá trình phát triển web site, bạn sẽ muốn thêm nhiều
chức năng nữa mà những thành phần mở rộng mặc định đã có sẵn không thể mang lại. Trong phần này, chúng
ta sẽ xem xem những Extensions gì bạn có thể thêm vào website và làm thế nào để thực hiện điều đó.
Xác định Extension sẽ được cài đặt
Thông thường mỗi một website đều có mục đích riêng của nó và đương nhiên cũng không có sẵn danh sách
những Extensions mà nó cần phải cài đặt. Tuy nhiên, có những loại Extensions mà các website nên có, ví dụ,
bộ sưu tập ảnh (image gallery), bộ sưu tập videos (video gallery), xây dựng biểu mẫu (form building), tích hợp
với mạng xã hội, hiển thị trên các thiết bị di động, v.v. Có rất nhiều bài viết nhằm giải quyết vấn đề này và
dưới đây là một số trong những bài viết hữu ích:Joomlashine extensions – JSN PowerAdmin, JSN Uniform
và JSN ImageShow: Chúng được phát triển để đáp ứng những yêu cầu thông dụng cho các website. Những
Extensions này nhận được khá nhiều lời khen ngợi từ những người sử dụng Joomla vì chúng dễ dùng và hiệu
quả.
Top 10 Joomla! extensions - Brian Teeman: Danh sách các tiêu chí chọn Joomla! extensions của Brian.
Featured extensions on JED
My top ten Joomla! extensions - Kristoffer Sandven: Những extensions ưa thích của một Joomla!
blogger nổi tiếng – Kristoffer Sandven cho cả phần front-end và back-end.
My Must have Joomla! Extensions - Anthony Olsen: Một danh sách Extensions giúp xây dựng phần lõi
Joomla! mạnh hơn. Bạn nên kiểm tra danh sách để đảm bảo rằng những Extensions này hỗ trợ cho
Joomla! 3.x.
Joomla! 3.x extensions on JED: Toàn bộ extension ở đây đều được kiểm tra kĩ càng bởi đội ngũ JED
trước khi giới thiệu cho người dùng. Bạn cũng nên kiểm tra qua số lượt đánh giá và bình luận của người
dùng để chọn ra extensions tốt nhất mà bạn mong muốn.
“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
113
JSN PowerAdmin – Một extension giúp đơn giản hóa giao diện quản trị back-end
JSN Uniform – Một extension giúp tạo và quản lý nhiều loại biểu mẫu.
“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
114
Tìm kiếm những Extension hữu ích
Nơi mà bạn có thể tìm cho mình những extensions hữu ích là Joomla! Extensions Directory (JED). Nó là một
nguồn tài nguyên lớn với hàng ngàn Joomla!extensions được chia sẵn vào các chuyên mục chức năng của nó.
Joomla! Extensions Directory
Tất cả các extensions có phần đánh giá và bình luận riêng, bạn cũng có thể xem và đưa ra ý kiến của bạn về
extensions này. Mục này được điều hành bởi một đội ngũ chuyên nghiệp và bạn có thể tin tưởng những thông
tin được đăng tại đây.
“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
115
Cài extensions mới
Sau khi chọn và tải extensions cần thiết cho website của bạn, bạn cần biết làm thế nào để cài đặt chúng và làm
cho chúng làm việc trên website của bạn.
1. Vào “Extensions”=>“ExtensionManager”
2. Tiếp theo, nhấn “Browse” để chọn gói Joomla! extension bạn đã tải về.
NhấnBrowse
3. Sau đó, nhấn “Upload&Install” để tải lên và cài đặt tập tin này vào website của bạn.
Nhấn“Upload &Install”
“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
116
Joomla! sẽ tự động đưa extension này vào đúng chỗ của nó.Ví dụ, nếu extensions là một component, bạn sẽ thấy
nó trong danh mục“Components”; nếu extension này là một module, bạn sẽ tìm thấy nó trong “Module
Manager”.
JSN UniForm trong Components
Gỡ bỏ extensions
Nếu bạn thấy một extension không giúp gì cho bạn, bạn nên gỡ bỏ nó:
1. Vào “Extensions”=>“ExtensionManager” và nhấn vào mục “Manage”.
2. Nhập tên đầy đủ hoặc một phần tên của extension vào trường “Filter” và nhấn “Search” icon.
3. Chọn extension mà bạn muốn gỡ bỏ và nhấn “Uninstall” trên thanh công cụ.
Gỡ bỏ extension
“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
117
Bước 7: Quản lý website với JSN PowerAdmin
Bạn đã có được một website Joomla! sau khi thực hiện 6 bước ở trên. Bây giờ, có thể bạn cần cập nhật nội dung
hàng ngày hoặc hàng tháng: chỉnh sửa nội dung đã đăng, tạo mới một danh mục hay module…
Những việc này, bạn không cần phải thực hiện toàn bộ các bước và thao tác như chúng tôi đã trình bày trước
đó. Đây là lúc để tiết lộ một bí mật: JSN PowerAdmin. JSN PowerAdmin là một extension Quản trị back-end
được tạo ra để giúp quản lý website Joomla! của bạn dễ dàng hơn bao giờ hết - với các chức năng Tìm kiếm
Spotlight (Spotlight Search), Quản lý Site (Site Manager), Quản lý mẫu Template (Template styles
Manager) và nhiều hơn nữa.
Những tính năng nổi bật của JSN PowerAdmin
“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
118
Quản lý site (Site Manager): Quản lý ba phần chính trong website của bạn bao gồm: Danh mục
(Menu), Component và Modules trong một vùng.
Site Manager
Tìm kiếm Spotlight (Spotlight Search): Điểm nhấn tìm kiếm (hình dưới bạn có thể thấy từ “joomla”
được bôi vàng toàn bộ, đó gọi là Spotlight).
Spotlight Search với danh sách kết quả có được
“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
119
Quản lý mẫu template (Template Style Manager): Bạn có thể sửa, đặt làm mặc định, sao chép, xóa
hay gỡ bỏ template dễ dàng.
Quản lý các mẫu template
JSN PowerAdmin hoàn toàn MIỄN PHÍ Bạn chỉ cần tải về và cài đặt ở back-end của website theo hướng dẫn
trong phần “Cài extensions mới”
Tải JSN PowerAdmin miễn phí
“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
120
Quản lý website Joomla! với Site Manager
Sẽ mất khá nhiều thời gian khi bạn phải vào từng menu, module hay bài viết để chỉnh sửa chúng. Bây giờ, bạn
có thể quản lý nội dung website của bạn dễ dàng hơn, nhanh hơn với công cụ Quản lý Site: Bao gồm Menu,
Component và Modules trong một khu vực.
To access Site Manager, click “Components” -> “JSN PowerAdmin” -> “Site Manager”.
Quản lý site bao gồm Menu, Component và Modules panel
Tiện lợi hơn, bạn có thể điều chỉnh kích thước của 3 phần này nếu bạn muốn. Bạn chỉ cần kéo thanh ngăn cách
giữa 2 phần sang trái hoặc sang phải để phóng to hay thu gọn lại phần đó. Ở đây, toàn bộ những thay đổi này sẽ
được tự động lưu lại.
Quản lý Danh Mục
“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
121
Các danh mục con ở phần front-end
Bạn có thể quản lý danh mục và danh mục con dễ dáng với thẻ MENU trong Site Manager.
Quản lý tất cả các danh mục và danh mục con
“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
122
Xem các danh mục ẩn/hiện:
Bạn có thể nhìn thấy tất cả danh mục được hiển thị.Những mục không được hiển thị sẽ bị ẩn đi. Để hiển
thị hay ẩn các mục này, bạn nhấn vào biểu tượng ô vuông ở phía trên bên phải.
Nhấn vào biểu tượng ô vuông để hiển thị những danh mục ẩn
Nhấn vào biểu tượng ô vuông để không hiển thị những danh mục ẩn
“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
123
Tạo mới một danh mục / danh mục con:
Thêm một danh mục và một danh mục con mới
Sửa danh mục hiện tại / các danh mục con:
Sửa danh mục hiện tại hoặc danh mục con
“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
124
Kéo và thả để di chuyển các mục con trong một danh mục:
Kéo mục danh mục con và thả nó đến một vị trí khác
Tùy chỉnh các danh mục con:
Bạn cũng có thể Ẩn (Unpublish), Cài đặt trên trang chủ (Set as home), Chiếm quyền sử dụng
(Check in) danh mục con, v.v.
Quản lý tất cả các danh mục hay danh mục con
“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
125
Quản lý nội dung
Phần COMPONENT hiển thị tất cả nội dung của danh mục bạn đã chọn. Nó cho phép bạn sửa các thành phần,
hiển thị hay ẩn các mục mà bạn muốn.
Nhấn“Select”để sửa một bài viết
Xem các mục nội dung:
Nhấn vào biểu tượng bên dưới để hiển thị/không hiển thị các thành phần ẩn trên trang.
Nhấn hiển thị hay không hiển thị các mục ẩn
“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
126
Sửa các bài viết / chuyên mục:
Giờ đây, bạn có thể sửa một bài viết nhanh hơn sau khi bạn chọn nó. Nhấn vào tiêu đề nội dung để
hiển thị các tùy chọn bên dưới:
Edit article: Thay đổi nội dung bài viết.
Hide element/ Show element: Nhấn để hiện hay không hiện các thành phần ẩn với hai tùy
chọn “For all pages globally” hoặc “For this page only”.
Enable link/ Disable link: Nhấn để hiển thị các liên kết được kích hoạt hay không kích hoạt
với hai tùy chọn “For all pages globally” hay “For this page only”.
o For all pages globally: Thay đổi được áp dụng cho tất cả các thành phần trên tất cả
các trang của website.
o For this page only: Thay đổi được áp dụng cho riêng trang này.
Sửa bài viết, hiển thị hay ẩn các chi tiết và liên kết trong một bài viế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
127
Cách sửa một chuyên mục tương tự như cách sửa một bài viết ở trên.
Sửa chuyên mục hoặc ẩn các chi tiết trong một chuyên mục
“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
128
Quản lý các Modules
Trong phần MODULES, bạn có thể quản lý toàn bộ modules của template mặc định hiện tại.
Modules trong phần front-end
“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
129
Xem các modules:
Bạn có thể nhìn thấy các các modules được hiển thị ở đây. Nhưng bạn có thể hoặc không thể nhìn thấy
các module không được hiển thị và các vị trí có các module (hoặc không có module). Bạn có thể quản lý
những mục này bằng cách nhấn vào biểu tượng ô vuông ở góc trên bên phải và đánh dấu vào ô
“Modules”, “Positions” hay cả hai.
Nhấn để hiển thị hoặc ẩn các modules và vị trí
“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
130
Tạo một module mới:
Nhấn vào bất kỳ vị trí nào và thêm một modulemới
Xem vị trí của các modules
Bạn có thể nhấn vào một vị trí module và chọn “View position” để xem tất cả các vị trí của template.
Nhấn vào vị trí bất kỳ để xem vị trí của template mặc định
“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
131
Sửa các modules hiện tại:
Với một module bất kỳ, bạn có thể Sửa (Edit), Thay đổi vị trí (Change position), Ẩn (Unpublish) ...
Với các module đã bị chiếm quyền sử dụng (Checked in), bạn cần chiếm quyền sử dụng lại trước khi
chỉnh sửa chúng.
Sửa các modules
Thay đổi vị trí module với toàn bộ vị trí được hiển thị của template
“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
132
Kéo và thả để di chuyển các vị trí module.
Kéo và thả một module tới vị trí mới
“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
133
Truy cập nhanh các mục bất kỳ với Spotlight Search
Bạn cần phải nhấn khá nhiều lần để tìm kiếm cho phần front-end trong back-end của Joomla!. Spotlight
Search giúp bạn tìm kiếm các mục trong website của bạn và truy cập chúng nhanh hơn:
Trong phần front-end, sao chép tiêu đề của nội dung mà bạn muốn chỉnh sửa.
Tới phần back-end, dán tiêu đề vào ô Spotlight Search ở góc trên bên phải của bảng quản trị
admin.
Bạn sẽ nhận được tất cả các kết quả từ các chuyên mục khác nhau ngay lập tức. Bạn chỉ cần chọn
đúng mục mong muốn để chỉnh sửa.
Kết quả sẽ được hiển thị ngay lập tức
“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
134
Nhấn vào mục bạn muốn để có thể truy cập ngay lập tức tới trang đó. Tại đây, bạn có thể thay đổi nội dung
giống như cách thông thường bạn vẫn làm.
Truy cập tức thì tới trang tùy chỉnh
“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
135
Quản lý các kiểu template với Template Style Manager
JSN PowerAdmin cung cấp cho bạn một cách truy cập nhanh chóng tới tất cả các mẫu templates đã được cài
đặt. Và bạn có thể thực hiển một số thao tác cơ bản trên một template như sửa (Edit), chọn làm mặc định
(Make Default), sao chép làm hai (Duplicate), xóa (Delete) và gỡ bỏ (Uninstall) nhanh chóng với một vài cú
nhấp chuột.
Hãy xem làm thế nào để thay đổi template mặc định.
Hiện tại, Template ở front-end mặc định là Beez3
Vào “Extensions” => “Template manager” và nhấn “Template Styles”.
Chọn “Template Styles”
“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
136
Tiếp theo, trong cửa sổ này, bạn sẽ thấy tất cả các template đã được cài, bao gồm cả site templates và admin
templates. Template mặc định được đánh dấu nổi bật với màu vàng.
Quản lý các mẫu Template
“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
137
Nhấn trên template bạn muốn thiết lập là mặc định và chọn “Make Default”. Ví dụ, ở đây chúng ta
chọn Protostar.
Nhấn chọn "Make Default"
Cuối cùng, nhấn“Close” để thoát khỏi cửa sổ.
“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
138
Bây giờ, ra ngoài phần front-end của website và xem kết quả.Template bây giờ là Protostar.
Protostar đã được chọn là template mặc định
“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
139
Những tính năng khác
Truy cập nhanh tới các mục đã chỉnh sửa trước đó
Tất cả các mục bạn đã cấu hình trước đó sẽ được lưu trữ trong History. Bạn có thể truy cập chúng chỉ với vài
cú nhấp chuột.
Nhấn vào biểu tượng Đồng hồ phía bên phải bênh cạnh ô Spotlight search.
Nhấn vào biểu tượng Đồng hồ
Nhấn vào mục bạn muốn truy cập tới.
Nhấn vào mục bạn đã chỉnh sửa trước đó
Bạn sẽ được chuyển tới mục đó.
“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
140
Truy cập nhanh vào Profile của thành viên
Thông thường, là một người quản trị, bạn muốn kiểm tra tin nhắn, profile của bạn hay đơn giản là thời gian còn
lại trong phiên làm việc của bạn. Để vào user profile, bạn:
Tìm biểu tượng hình người trên đầu thanh công cụ gần biểu tượng đồng hồ. Phần màu xanh đại diện cho
tỷ lệ phần trăm của thời gian còn lại trong phiên của bạn.
Biểu tượng hình người
Di chuột vào biểu tượng và nhấn vào Profile trong phần danh mục con. Một cửa sổ mới sẽ hiển thị ra
cho phép bạn chỉnh sửa hồ sơ của bạn.
Nhấn “Profile” để đi tới trang cho thành viên
“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
141
Trang thiết lập hồ sơ (Profile)
Quản trị Danh mục nâng cao
Một lúc nào đó bạn có thể muốn gỡ bỏ một vài extension. Không cần phải vào “Extension Manager” theo
cách thông thường, bạn có thể gỡ bỏ chúng với chức năng Gỡ bỏ nhanh (Quick Uninstall). Nó làm việc với
một vài exentions mặc định của Joomla! (Banners, Contacts...) và tất cả các extension của bên thứ ba trên
website Joomla! của bạn.
“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
142
Gỡ bỏ nhanh một extension
“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
143
Cấu hình JSN Power Admin
Bạn có thể quản lý phần back-end Joomla! theo cách mà bạn thích với trang “Configuration” của JSN Power
Admin. Tại đây, bạn có thể cấu hình logo và liên kết menu, vùng tìm kiếm hay số lượng chỉnh sửa được hiển
thị; tắt tính năng gỡ bỏ nhanh hoặc hỗ trợ quản lý các thành phần mở rộng, v.v.
Vào “Component” => “JSN PowerAdmin” và nhấn “Configuration”
Vào trang Configuration của JSN PowerAdmin
“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
144
Bạn có thể cấu hình theo ý mình trong trang “Configuration”.
Trang "Configuration"
“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
145
“Joomla! 2.5 Made Easy” – Phiên bản trước của Joomla! 3.x Made Easy (Thiết kế
website thật dễ dàng với Joomla! 3.x)
Cuốn e-book này (“Joomla! 3.x Made Easy” – “Thiết kế website thật dễ dàng với Joomla! 3.x”) là bản cập
nhật từ phiên bản trước - Joomla! 2.5 Made Easy, đã có hơn 50.000+ lượt tải về.
Nếu bạn muốn xây dựng một website trên một phiên bản Joomla! ổn định, bạn nên chọn Joomla! 2.5 (nó được
hỗ trợ cho tới mùa xuân năm 2014) và cuốn cẩm nang bỏ túi Joomla! 2.5 Made Easyđược khuyên dùng vì nó
sẽ giúp bạn từng bước làm chủ Joomla! .
Joomla! 2.5 Made Easy,viết bởiJoomlaShine Team
93 trang
Ngôn ngữ: tiếng Anh, tiếng Đức, tiếng Đan Mạch
Cuốn sách có sẵn các ngôn ngữ tiếng Anh, tiếng Đức và tiếng Đan Mạch. Bạn có thể tải nó miễn phí.
“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
146
Kết luận
Một cuốn sách tốt rất có giá trị và chúng tôi hi vọng bạn cũng nghĩ thế khi đọc cuốn sách này. Toàn bộ kiến
thức về Joomla! 3.x của chúng tôi đã được biên tập cẩn thận để mạng lại cho bạn 7 chương với những thông tin
hữu ích nhằm giúp bạn từng bước tạo cho mình một website với Joomla! 3.x. Sau khi đọc xong cuốn sách này,
bạn sẽ biết được hết những khía cạnh cơ bản của Joomla! để có thể xây dựng hoàn tất một website: Từ làm
thế nào để cài đặt nó cho đến việc làm thế nào để làm việc với nó.
Tâm nguyện của đội ngũ JoomlaShine là mong muốn chia sẽ những điều tốt nhất đến với độc giả thông qua
cuốn sách này. Đừng quên chia sẽ những gì mà bạn đã học được từ cuốn sách cho người khác.Việc mang lại
cho bạn đọc những kiến thức có giá trị không chỉ là mục đích mà còn là phần thưởng cho chúng tôi.
Mặc dù đã cố gắng hết sức nhưng những sai sót là điều không thể tránh khỏi. Chúng tôi xin ghi nhận những ý
kiến và đóng góp từ phía độc giả để làm cho cuốn sách trở lên hoàn thiện hơn!
“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
147
Tham khảo
Ra mắt cuối tháng10/2012, Joomla! 3 - In 10 Easy Steps được viết bởi Hagen Graff là một cuốn sách tốt cho
những người mới bắt đầu. Vói những thông tin chi tiết về Joomla! 3.x, tôi bảo đảm bạn sẽ có được nhiều kiến
thức để giúp bạn xây dựng một website như ý mình. Cuốn sách này được xuất bản với nhiều ngôn ngữ khác
nhau như tiếng Anh, tiếng Đức và tiếng Pháp, vậy bạn có thể chọn một phiên bản tương ứng cho mình. Cuốn
sách này được tải và chia sẻ miễn phí.
Bạn có thể vào trang Blog chính thức của JoomlaShine ( Joomlashineblog) hoặc xem qua kênh Youtube để học
thêm về Joomla! cũng như cập nhật những thông tin mới nhất về Joomla! Không chỉ lý thú mà còn hữu ích,
những chủ đề về Joomla! mà có lẽ bạn sẽ không muốn bỏ lõ. Bạn có thể để lại lời bình luận bên dưới mỗi bài
viết – chúng tôi đánh giá cao điều này
Cuối cùng, lời khuyên chúng tôi đưa ra về một vài website học tập tốt mà chúng tôi nghĩ có thể bạn nên tham
khảo như:
http://joomlaviet.info/
http://docs.joomla.org/
http://www.joomlatutorials.com/
http://www.joomlablogger.net/
http://www.ostraining.com/blog/joomla/
http://www.theartofjoomla.com/
http://www.youtube.com/user/Joomla
http://www.joomla-wiki.de/dokumentation/Joomla!_Wiki
http://www.joomlaportal.de/forum.php
http://www.joomlaspanish.org/foros/
http://www.joomla.it/mediawiki/index.php/Pagina_principale
top related