• Like
Thiet ke website bang ma nguon mo Joomla CMS 2.5
Upcoming SlideShare
Loading in...5
×

Thanks for flagging this SlideShare!

Oops! An error has occurred.

Thiet ke website bang ma nguon mo Joomla CMS 2.5

  • 7,478 views
Published

Joomla CMS 2.5 - tạo được website 2.0 có hệ thống quản trị nội dung (CMS) Joomla. Website không chỉ chạy từ local mà phải là website thực tế chạy trên Internet với nhiều dạng web dành cho doanh …

Joomla CMS 2.5 - tạo được website 2.0 có hệ thống quản trị nội dung (CMS) Joomla. Website không chỉ chạy từ local mà phải là website thực tế chạy trên Internet với nhiều dạng web dành cho doanh nghiệp, shop bán hàng, web tin tức…. Dựng web mà có thể giao dịch mua bán hàng hóa và thanh toán trực tuyến theo chuẩn thế giới

  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
No Downloads

Views

Total Views
7,478
On SlideShare
0
From Embeds
0
Number of Embeds
1

Actions

Shares
Downloads
549
Comments
2
Likes
4

Embeds 0

No embeds

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
    No notes for slide

Transcript

  • 1.  Mục đích:• Tự tạo website kết hợp tất cả các môn mà đã từng học trước đó gồm PHP, Flash, Photoshop, Video, SQL, PHP, HTML, CSS…• Tự phát triển website thương mại điện tử như giao dịch mua bán, thanh toán trực tuyến Kết quả:• Tạo được website 2.0 có hệ thống quản trị nội dung (CMS)• Website không chỉ chạy từ local mà phải là website thực tế chạy trên Internet với nhiều dạng web dành cho doanh nghiệp, shop bán hàng, web tin tức….• Dựng web mà có thể giao dịch mua bán hàng hóa và thanh toán trực tuyến theo chuẩn thế giới.
  • 2. Tổng thời gian gồm 30 giờ chia làm 10 buổi1. Ngày 01: Tổng quan Joomla, Cài đặt, cấu hình Joomla, Templates2. Ngày 02: Tạo modules, component, plugin, templates… dựng sẵn (web cty)3. Ngày 03: Web Photoshop => CSS, HTML và tự tạo templates (web cty)4. Ngày 04: Tạo nội dung (Article), chỉ định menu, tiếng Việt (web tin tức)5. Ngày 05: Modules, Component, Plugin (web cty)6. Ngày 06: Com Virtual Mart (web TMĐT)7. Ngày 07: Com Virtual Mart, upload online, payment (web TMĐT)8. Ngày 08: Forum Joomla/VBB, đa ngôn ngữ + projects thực tế (web du lịch)9. Ngày 09: Tạo form CKForm, URL Friendly, SEO + projects thực tế (web BĐS)10. Ngày 10: Nâng cấp & Bảo mật + projects thực tế (web học viên)Dự kiến sau 2 tuần thì có buổi trình bày website thực hiện Templates Joomla CMS Project Giai đoạn 01 Giai đoạn 02 Giai đoạn 03
  • 3. 1. Hiện nay, các website được làm từ Joomla rất nhiều. Tại Việt Nam thì hơn 2/3 các công ty thiết kế web sử dụng Joomla để làm website cho chính công ty thiết kế web. Còn 1/3 số người còn lại vẫn bảo thủ và chê bai... Joomla (Họ thích phần mềm "made in tự tui" và chê bai người khác). Một số công ty thiết kế web khác thì ứng dụng những bộ CMS và Frameworks khác nhau và tuỳ ý thích cuả mỗi người mà chọn bộ CMS cho công ty mình.2. Mỗi sản phẩm đều có điểm ưu và điểm khuyết. Tuỳ theo yêu cầu và mức độ thông thạo ngôn ngữ lập trình thiết kế, bạn sẽ quyết định chọn ngôn ngữ hoặc frameworks nào.
  • 4. 1. CMS là hệ thống cho phép bạn tạo, quản lý, lưu trữ và chỉnh sửa số lượng lớn các nội dung mà không cần khả năng lập trình hay viết code HTML. Bởi vì bạn có thể chỉnh sửa nội ung đó từ bất cứ một máy tính có kết nối Internet nào trên thế giới, bạn không cần phải dựa dẫm vào các nhà phát triển web hay bên công ty quản lý website của các bạn.2. CMS gồm Giao diện (Templates), Nội dung (Content) và Meta data. Hơi khó hiểu, nhưng đại loại ba yếu tố này đóng vai trò quang trọng trong CMS: Giao diện (Templates) là đồ họa cho website, Nội dung (Content) là quản lý tất cả nội dung của website, Meta data giúp cho việc tối ưu hóa công cụ tìm kiếm (SEO)3. CMS ngoài tính năng chuẩn thì CMS Joomla cho phép bạn Addon Modules, Templates rất linh họat. Nói đơn giãn web rất ít nội dung/tính năng/giao diện ban đầu và dễ dàng cho bạn mở rộng cho phù hợp theo yêu cầu của web theo thời gian.4. CMS dễ dàng update version mới nhất theo phiên bản phát hành
  • 5. 1. Joomla là một hệ quản trị nội dung mã nguồn mở (Tếng Anh: Open Source Content Management Systems . Joomla được viết bằng ngôn ngữ PHP và kết nối tới cơ sở dữ liệu MySQL , cho phép người sử dụng có thể dễ dàng xuất bản các nội dung của họ lên Internet hoặc Intranet.2. Joomla! là hệ thống quản trị nội dung mã nguồn mở số 1 thế giới hiện nay. Linh hoạt, đơn giản, thanh nhã, tính tuỳ biến rất cao và cực kỳ mạnh mẽ, đó là những gì có thể nói về Joomla! Được sử dụng ở trên toàn thế giới từ những trang web đơn giản cho đến những ứng dụng phức tạp. Việc cài đặt Joomla! rất dễ dàng, đơn giản trong việc quản lý và đáng tin cậy3. Joomla! giúp xây dựng và triển khai các website blog, website tin tức, website bán hàng, website thương mại điện tử... cho tới mạng cộng đồng, mạng xã hội trong một thời gian ngắn và tiết kiệm nhiều công sức4. Joomla có các đặc tính cơ bản là: bộ đệm trang (page caching) để tăng tốc độ hiển thị, lập chỉ mục, đọc tin RSS (RSS feeds), trang dùng để in, bản tin nhanh, blog, diễn đàn, bình chọn, lịch biểu, tìm kiếm trong Site và hỗ trợ đa ngôn ngữ.
  • 6. 1. Joomla được phát âm theo tiếng Swahili như là jumla nghĩa là "đồng tâm hiệp lực". Joomla được sử dụng ở khắp mọi nơi trên thế giới, từ những website cá nhân cho tới những hệ thống website doanh nghiệp có tính phức tạp cao, cung cấp nhiều dịch vụ và ứng dụng. Joomla có thể dễ dàng cài đặt, dễ dàng quản lý và có độ tin cậy cao.2. Joomla đoạt giải thưởng phần mềm mã nguồn mở số 1 thế giới hiện có khoảng 3,000 web chính phủ và hơn 1,5 triệu website đang sử dụng CMS Joomla như Cục tình báo Mỹ, Bộ quốc phòng Anh, Citibank, eBay, General Electric,… Ở VN thì 2 TP lớn Hà Nội, HCMC Joomla chiếm khoảng 45%3. Joomla có mã nguồn mở do đó việc sử dụng Joomla là hoàn toàn miễn phí cho tất cả mọi người trên thế giới.4. Phiên bản mới nhất là Joomla 2.5 với đặc tính lớn nhất là Dễ dàng update version mới; Nút tìm kiếm tiện lợi hơn; Hỗ trợ nhiều định dạng CSDL; Menu liên kết modules tiện lợi hơn; SEO đa ngôn ngữ; …5. Chú ý: Version 1.5.x không nâng cấp lên được 2.5 ngay!!!.
  • 7.  Ngoài các vấn đề là mã nguồn mở miễn phí, khả năng bảo mật cao, dễ dàng sử dụng, còn điều gì tuyệt vời hơn đằng sau khiến cho Joomla phát triển mạnh và được nhiều người yêu thích như vậy với Joomla việc lập trình, hiệu chỉnh thêm các thành phần, module, các chức năng cho nó là một việc rất dễ dàng đối với các lập trình viên, và hầu hết tất cả các ứng dụng đều được chia sẻ miễn phí, đó chính là điều tuyệt vời nhất Sau đây là một vài ví dụ về các ứng dụng được viết thêm hoặc được tích hợp: • Tạo các form linh hoạt, dễ dàng và tự động • Tạo các thư mục về thương mại • Hệ thống quản lý tài liệu • Thư viện hình ảnh và âm thanh • Cửa hàng ảo trực tuyến • Diễn đàn thảo luận • Tạo Blogging • Tin tức qua Email (Email newsletters) • Hệ thống quản lý banner • Và hàng ngàn các ứng dụng khác ...
  • 8. 1. Tích hợp E-commerce2. Diễn đàn thảo luận (Discussion forums)3. Thư viện ảnh (Photo galleries)4. Quản lý Video (Video management)5. Liên kết mạng xã hội như Facebook, Youtube…6. Hỗ trợ đa ngôn ngữ (Multi-language support)7. Lấy tin tự động, RSS feeds8. Thống kê/Theo dõi (Statistics/tracking)9. Download10. Thay đổi giao diện (templates) dễ dàng11. Tùy biến dữ liệu (extra-field)12. Tích hợp giữa web và mobile web13. …
  • 9.  Joomla! Template là một gói bao gồm các file PHP, HTML, CSS, JS (Javascript), XML... và các tấm hình, ảnh, biểu tượng, video, flash kèm theo tạo nên giao diện (bố cục và hình hài) của Website Joomla. Template mặc định của Joomla! có 3 template được đóng gói sẵn kèm theo: JA Purity (Joomlart), Rhuk Milkyway (RocketTheme) và Beez (Angie Radtke/Robert Deutz). Các template này được đặt trong thư mục [Joomla]/templates và nằm trong các thư mục con tương ứng.
  • 10.  Các template của Joomla! đều có khả năng tùy biến cao thông qua cách sắp xếp và đặt vị trí các module rất linh động. Việc thiết kế Template khá dễ dàng, thậm chí chỉ cần vài giờ là có thể chuyển từ một template thuần HTML/CSS hay một template của một PORTAL / CMS khác sang template Joomla. Bạn có thể dùng cùng lúc vài template khác nhau trên cùng website. Chẳng hạn đối với trang HOME bạn gắn nó với template JA Purity, còn trang DOWNLOAD lại gắn nó với template Rhuk Milkyway... Số lượng template Joomla free (template miễn phí) và template Joomla commercial (template có phí) được cung cấp trên mạng hiện nay là một con số mà nhiều PORTAL / CMS / BLOG khác phải kính nể. Có tới hàng nghìn thậm chí hàng chục nghìn template.
  • 11.  Cài đặt một Joomla Template từ trang quản trị và nó giống như các thành phần mở rộng khác (component, module, plugin, language...), để cài đặt một Joomla Template, chúng ta mở trang quản trị và sử dụng menu Extensions >> Install / Unistall. Có 3 kiểu cài đặt khác nhau: › Upload từ máy tính của bạn › Cài đặt từ một thư mục trên Hosting › Cài đặt từ một liên kết bên ngoài Webssite của bạn
  • 12. 1. Yootheme - http://yootheme.com/demo2. JoomlArt - http://www.joomlart.com/demo/3. Gavick - http://demo.gavick.com/4. Rocktheme - http://demo.rockettheme.com/5. Bonustheme - http://www.bonusthemes.com/6. Joomlamarket - http://demo.joomlamarket.de/7. Icetheme - http://demo.icetheme.com/8. Shape5 - http://www.shape5.com/9. ZooTemplates - http://www.zootemplate.com/10. JoomlaXTC - http://demo.joomlaxtc.com/11. Templates Plazza - http://demo.templateplazza.net/12. ZooTemplates - http://www.zootemplate.com/demo/
  • 13.  Joomla Component là một trong các thành phần mở rộng của Joomla!, thực chất nó là một ứng dụng trong hệ thống Joomla!. Component được sử dụng để thực hiện một chức năng lớn nào đó, chẳng hạn như: Cung cấp tin tức, Quảng cáo, Rao vặt, Đặt phòng khách sạn, Bất động sản, Download... Một component được hiển thị ở phần trung tâm, hay phần chính (mainbody) của Website
  • 14.  Giống như các thành phần mở rộng khác (module, plugin, template, language...), để cài đặt một Joomla Component, chúng ta mở trang quản trị và sử dụng menu Extensions >> Install / Unistall Có tất cả 11 component mặc định được đặt trong thư mục [Joomla]/components tương ứng với ký hiệu là "com_xyz". › com_banners: Quản lý bảng quảng cáo (banner) › com_contact: Quản lý các đầu mối liên hệ (contact) › com_content: Quản lý và hiển thị bài viết (đây là component quan trọng nhất) › com_mailto: Quản lý chức năng gửi/nhận email › com_media: Quản lý các tệp đa phương tiện (video, flash, mp3, hình) › com_newsfeeds: Quản lý việc lấy tin từ website khác › com_poll: Cung cấp chức năng bình chọn › com_search: Cung cấp chức năng tìm kiếm › com_user: Quản lý thành viên › com_weblinks: Quản lý và hiển thị danh mục các website liên kết › com_wrapper: Cho phép nhúng website khác trong cửa sổ của website Joomla
  • 15.  CKform => form liên hệ, book tour, order com_oziogallery2.3 => tạo thư viện ảnh Flash com_phocagallery_v2.7.3 => thư viện ảnh PHOCA com_phocamaps_v1.1.0 => Map vị trí com_virtuemart_magiczoom => ảnh zoom + nhiều ảnh trong virtuemart com_ccboard_1_2-RC => forum Joomla com_flippingbook_for_1.5 => e-Catelogue K2_CMS => tạo tin, form order Joomla! Fish => tạo website nhiều ngôn ngữ JOOMGALLERY_1_5_0_5 => thư viện ảnh cho phép upload ảnh dự thi Com_widgetkit => đa chức năng của Yootheme …
  • 16.  Joomla Module là một trong các thành phần mở rộng của Joomla, nó là một ứng dụng nhỏ được sử dụng chủ yếu để lấy dữ liệu và hiển thị thông tin. Module thường được dùng kết hợp kèm với các component nhằm mở rộng, cũng như thể hiện rõ ràng hơn các chức năng của component Không giống như component, một module có thể được đặt ở bất kỳ vị trí nào trên template hoặc vị trí do người dùng tự định nghĩa. Ngoài ra một module có thể được nhân bản, nghĩa là cùng lúc có thể xuất hiện tại một vị trí hoặc các vị trí khác nhau
  • 17.  Vị trí của module (module position) là nơi mà module có thể được đặt vào đó. Mỗi vị trí đều được xác định thông qua một định danh duy nhất (một cái tên), chẳng hạn như: left, right, top, bottom, user1, user2... Tên và số lượng các vị trí này được quy định bởi template. Các template khác nhau thì số lượng vị trí module cũng như tên của chúng có thể khác nhau. Ngoài ra, trong quá trình sử dụng người dùng cũng có thể tự định nghĩa các vị trí mới sao cho phù hợp với yêu cầu của mình. Joomla! 1.5 có tất cả 20 module mặc định được cung cấp kèm theo. Các module này được đặt trong thư mục [Joomla]/modules và nằm trong các thư mục con tương ứng với ký hiệu là "mod_xyz". Để tìm một module joomla bạn có thể truy cập vào website Joomla Extensions. Lưu ý: Một số module chỉ thực hiện đúng chức năng khi nó được cài đặt kèm theo một component tương ứng. Do vậy bạn phải đọc kỹ hướng dẫn sử dụng của module đó. Để xem vị trí module từ website bạn thêm đoạn code ?tp=1 hoặc &tp=1
  • 18.  mod_archive: Module hiển thị các bài viết đã được đánh dấu "lưu trữ“ mod_banners: Module hiển thị các quảng cáo mod_breadcrumbs: Module hiển thị thanh điều hướng mod_custom: Module hiển thị một đoạn mã HTML bất kỳ mod_feed: Module hiển thị tin lấy từ các website khác mod_footer: Module hiển thị dòng bản quyền ở cuối Website mod_latestnews: Module hiển thị các bài viết mới nhất mod_login: Module hiển thị form đăng nhập mod_mainmenu: Module hiển thị menu điều khiển mod_mostread: Moudle hiển thị các bài viết được đọc nhiều nhất mod_newsflash: Module hiển thị tin vắn / tin nhanh mod_poll: Module hiển thị bình chọn mod_random_image: Module hiển thị ảnh ngẫu nhiên mod_related_items: Module hiển thị các bài viết liên quan mod_search: Module hiển thị form tìm kiếm mod_sections: Module hiển thị danh sách các mục của Website mod_stats: Module hiển thị các thông số thống kê của Website mod_syndicate: Module cấp tin cho các website khác mod_whoisonline: Module hiện danh tính và số người trực tuyến mod_wrapper: Mudule hiển thị một trang web bất kỳ được nhúng vào website Joomla
  • 19.  mod_yoo_carousel_1.5.17 => TAB INFO, slide hình ảnh lấy từ artical mod_yoo_scroller => logo, sản phẩm chạy qua lại mod_yoo_gallery_1.5.4 => mod thư viện ảnh mỗi tin bài mod_moopopup_J15 => quảng cáo popup mod_maxdesign_float_ad => quảng cáo trượt 2 bên mod_pagepeel_banner_J15 => quảng cáo stick ngay góc màn hình mod_vvisit_counter.1.7.3 => đếm lượt truy cập mod_GMap-0.12 => bản đồ Google Map, đăng ký code Google API
  • 20.  mod_oziogallery-1.0.1 & com-oziogallery-1.0.8Y => flash banner mod_slideshow2_j15 => slide ảnh có nội dung mod_newsletter_subscriber => news letter mod_ht_support => chat Yahoo, Skype support mod_facebook_like_box => nhúng member Facebook mod_gtranslate => đa ngôn ngữ dịch theo Goole Translate …
  • 21.  Joomla Plugin là một trong các thành phần mở rộng của Joomla! nhằm giúp thực hiện một cách tự động công việc cụ thể. Trong phiên bản Joomla! 1.5 có tất cả 32 plugin mặc định được cung cấp kèm theo. Các module này được phân thành 8 loại khác nhau và đặt trong các thư mục con tương ứng của thư mục [Joomla]/plugins. Một số plugin như popup hình ảnh, chèn flash, tuyết rơi, biên dịch URL, widget bar, google analytics…
  • 22.  Danh sách các loại plugin của Joomla! › authentication: Các plugin chứng thực quyền hạn › content: Các plugin nội dung (bài viết) › editors: Các plugin về trình soạn thảo › editors-xtd: Các plugin hỗ trợ, mở rộng tính năng cho trình soạn thảo › search: Các plugin về tìm kiếm › system: Các plugin của hệ thống › user: Các plugin về người dùng › xmlrpc: Các plugin cho phép quản trị Joomla!, viết bài từ các hệ thống khác. Download các plugin Joomla ở đâu? Để download các plugin mở rộng khác của Joomla, bạn có thể truy cập vào website Joomla Extensions và chọn từ danh mục có sẵn hoặc theo từ khóa mà bạn chỉ định
  • 23.  plg_jathumbnail => tự tạo ảnh thumbnail wibiya_for_joomla => widget-bar footer plgjLike => Like facebook plg_snowxmas => hiệu ứng tuyết rơi Pdfembed15 => nội dung chứa file PDF plg_al_facebook_comments => comment web đồng bộ Facebook plugin_openpotion_google_analytics_1.1 => nhúng thống kê Google Analytics jce_mediamanager_150 => chèn flash, clips (cài trong com JCE)
  • 24. 1. Chọn Templates › Freecode.vn => copy title tem => Google Image => preview layout web › Download tại web hoặc search keyword=tên template + mediafire => download temp2. Intall Quickstar => Double templates đang dùng => sửa lại file › Templatesdetail.xml => sửa thông số website › Favicons.icon => tạo file PNG 16x16px => vào web iconverticons.com => save format www
  • 25. 1. Tạo sitemap › Content – Section Manager => tạo thư mục cha › Content – Catelogue Manager => tạo thư mục con › Article Manager => tạo nội dung bài viết2. Templates Manager => previews temp đang dùng ở vị trí nào (Hoặc cụm từ ?tp=1)3. Modules => cài mod theo từng vị trí hoặc disable mode ko dùng4. Cài Component => config => đẩy nội dung5. Hiển thị menu => Menu – Main Menu => chỉ định bài viết hoặc com
  • 26. 1. Tạo website từ Photoshop2. Rã website sang CSS + HTML3. Copy folder vừa tạo vào folder templates4. Rename HTML => index.php5. Mở file index.php mẫu từ ja_purity • Copy đoạn đầu đến </head> • Thay đổi file CSS6. Mở file Word xem vị trí • Copy thay đoạn code nội dung dưới tab <div id="top_menu"> <jdoc:include type="modules" name=" top_menu " /> </div> • Thay hết toàn bộ vị trí các <div>7. Đến vị trí nội dung chính #content thành <jdoc:include type="component" />8. Kết thúc và lưu dưới dạng index.php
  • 27. 1. Copy file templateDetails.xml từ bộ ja_purity làm mẫu2. Tìm đoạn position => sửa lại vị trí đã dựng layout3. Tạo ảnh thumbnail size 200x150px4. Xem thử vào fix lỗi
  • 28. 1. Link hay sử dụng › Hãng Joomla: www.joomla.org › Download extenstions: http://extensions.joomla.org › Joomla Vietnam http://freecode.vn › Cộng đồng Joomla Việt http://joomlaviet.vn/ › Diễn đàn Joomla người Việt http://forum.joomla.org/index.php/board,171.0.html › Jooma Việt http://joomlavi.vn/vietnam/ › Diễn đã Joomla Viet http://diendan.joomlaviet.vn/2. Hosting PHP Joomla miễn phí › http://freevnn.com/ (300MB & 1 tháng) › http://www.byethost.com/