Đồ Án Tốt Nghiệp GVHD:Hồ Diên Lợi BỘ CÔNG THƯƠNG TRƯỜNG CAO ĐẲNG CÔNG THƯƠNG TP.HCM KHOA CÔNG NGHỆ THÔNG TIN ĐỒ ÁN TỐT NGHIỆP ĐỀ TÀI:XÂY DỰNG WEBSITE KHOA ĐẠI CƯƠNG Giảng viên hướng dẫn: HỒ DIÊN LỢI Trang Đồ Án Tốt Nghiệp GVHD:Hồ Diên Lợi NHẬN XÉT CỦA GIẢNG VIÊN HƯỚNG DẪN PHỤ LỤC Contents Trang Đồ Án Tốt Nghiệp GVHD:Hồ Diên Lợi Chương - TỔNG QUAN 1.1 Lý chọn đề tài: Với phát triển nhảy vọt công nghệ thông tin nay, Internet ngày giữ vai trò quan trọng lĩnh vực khoa học kĩ thuật đời sống Dĩ nhiên bạn nghe nói nhiều Internet, nói cách đơn giản, Internet tập hợp máy tính nối kết với nhau, mạng máy tính tồn cầu mà kết nối máy PC họ Với mạng Internet, tin học thật tạo nên cách mạng trao đổi thông tin lĩnh vực văn hóa,giáo dục, xã hội, trị, kinh tế Trong cơng số website đóng vai trò khơng thể thiếu mạng internet.Website đa dạng nội dung đa dạng thể loại Ví dụ: • Trong lĩnh vực giáo dục gồm có :website trường cao đẳng cơng thương,website trường đại học sư phạm kỹ thuật… • Trong lĩnh vực văn hóa gồm có:website giới thiệu danh lam thánh cảnh việt nam,website giới thiệu đặc sản,di tích lịch sử việt nam… • Trong lĩnh vực xã hội-chính trị:website báo cơng an,báo tuổi trẻ… • Trong lĩnh vực giải trí:facebook,webgame… Qua ta thấy website đóng vai trò khơng thể thiếu lĩnh vực công nghệ thông tin để hình thành trang web ta cần phải qua khâu thiết kế.Nên việc thiết kế web đóng vai trò lớn cơng nghệ kỹ thuật số.Sau học trường cao đẳng công thương em nắm bắt nhiều kiến thức website qua em thấy website đóng vai trò khơng thể thiếu lĩnh vực giáo dục lĩnh vực khác…qua chúng em muốn xây dựng website lĩnh vực giáo dục,nên đồ án tốt nghiệp chúng em chọn đề tài thiết kế website trang Khoa Cơng Nghệ Hóa Học 1.2 Đối tượng nghiên cứu: Sau bàn bạc thống nhóm chúng em chọn đối tượng để thiết kế trang web joomla.Vì lý sau: • Việc thiết kế joomla giúp rút ngắn thời gian,tiền bạc • Giúp cho việc bảo mật an tồn • Dễ dàng cho bạn mới,tiếp cận nhanh hơn… 1.3 Mục tiêu đề tài: Trang Đồ Án Tốt Nghiệp GVHD:Hồ Diên Lợi Nghiên cứu joomla để thiết kế trang khoa cơng nghệ hóa học,nhằm giúp cho học sinh,sinh viên thuận tiện việc tìm kiếm thơng tin,xem điểm,đăng kí mơn học nắm bắt thông tin kịp thời … 1.4 Phạm vi giới hạn nghiên cứu thiết kế:   Phạm vi:Khoa công nghệ hóa học Giới hạn:do phạm vi thời gian có hạn,nên trang web khoa mang tính chất thử nghiệm,chưa thể vào thực tế 1.5 Ý nghĩa đề tài: Ngày cơng cơng nghiệp hóa,hiện đại hóa đất nước cơng nghệ hóa học đóng vai trò khơng thể thiếu.ở nước ta cơng nghệ hóa học yếu so với nước khác,nên ta cần tuyên truyền cho người biết vai trò thật cơng nghệ lợi ích mang lại.Ví dụ như:nghiên cứu cơng nghệ hóa học để tìm nguồn lượng cung cấp thay cho khí đốt,điện… Chương – TÌM HIỂU VỀ JOOMLA 2.1 Giới thiệu sơ lược joomla: Joomla! hệ quản trị nội dung mã nguồn mở Joomla! viết ngôn ngữ PHP kết nối tới sở liệuMySQL, cho phép người sử dụng dễ dàng xuất nội dung họ lên Internet Intranet Joomla! có đặc tính là: đệm trang (page caching) để tăng tốc độ hiển thị, lập mục, đọc tin RSS (RSS feeds), trang dùng để in, tin nhanh, blog, diễn đàn, bình chọn, lịch biểu, tìm kiếm site hỗ trợ đa ngôn ngữ Joomla! phát âm theo tiếng Swahili jumla nghĩa "đồng tâm hiệp lực" Joomla! sử dụng khắp nơi giới, từ website cá nhân hệ thống website doanh nghiệp có tính phức tạp cao, cung cấp nhiều dịch vụ ứng dụng Joomla! dễ dàng cài đặt, dễ dàng quản lý có độ tin cậy cao Joomla! có mã nguồn mở việc sử dụng Joomla! hồn tồn miễn phí cho tất người giới 2.2 Cấu trúc joomla: Trang Đồ Án Tốt Nghiệp GVHD:Hồ Diên Lợi Joomla gồm có tầng hệ thống Tầng mức tảng, chứa thư viện plugin (còn biết với tên gọi mambot) Tầng thứ hai mức ứng dụng chứa lớp JApplication Hiện tầng gồm lớp con: JInstallation, JAdministrator JSite Tầng thứ ba mức mở rộng Tại tầng có thành phần (component), mơ đun (module) giao diện (template) thực thi thể 2.2.1 Quản Lý component: Các component thành phần nội dung đặc biệt hay ứng dụng Joomla bao gồm số nhân component hỗ trợ khả tự tăng cường tính với component hãng thư ba Những component gắn sẵn, cai bao gồm Joomla, phần tính nhân Bạn tìm thấy compnent hãng thứ ba Joomla Forge nhiều nhà phát triển thứ ba vầ site cộng đồng Cấu hình trợ giúp thêm thường cung cấp với kèm với component Những component mô tự nhiên, điềunày làm có khả tăng cường chức Joomla hồn cảnh Một component đặc trưng giống Menu item Những visitor và/hay user thấy content component cách click vào liên kết Menu item Nó thường hiển thị vùng nội dung site Những component bao gồm với Joomla : ƒ Banners – ô quảng cáo ƒ Contacts – Liên hệ ƒ Newsfeeds – điểm tin ƒ Polls – thăm dò ƒ Web Links – liên kết web 2.2.2 Quản lý Module: Trang Đồ Án Tốt Nghiệp GVHD:Hồ Diên Lợi Modules thường dùng để hiển thị thông tin khác và/hoặc tính tương tác tồn site Joomla bạn Một Module chứa thứ từ văn đơn giản,đến HTML, đến ứng dụng hoàn toàn độc lập hãng thứ ba Những Module hiển thị nội dung tương tác, poll (thăm dò ý kiến), tagboard, tin nhất, tin khẩn nhiều Các Site Module khác với Administrator Module chúng hiển thị nội dung Front-end site Admini Module liên quan đến tác vụ và/hoặc tính khác Administrative (hoặc Back-end) Các Module tạo bạn (costom/user module) hay tải cài đặt Quản lý cac module luôn làm Administrator (Admin Seciton) Vào Modules Module Manager Menu Ở bạn cài đặt/tháo bỏ module chỉnh sửa nhứng cấy hình phổ biến là: tên, trang xuất hiện, vùng đặt nó, cấp độ truy cập Từ danh sách chọn module bạn muốn cấu hình Module Manager thiết đặt hiển thị số lượng xác module Tận cuối danh sách ban thấy chức tổ chức trang, nơi cho phép bạn điều hướng đến cài đặt module danh sách Bạn cài đặt số module hiển thị trang băng chọn số hộp chọn đổ xuống góc phải hình Ở bạn tìm thấy danh sách tất thiết lập mặc đinh site module cài đặt Joomla Mỗi quy chiếu đến loại module cụ thể định từ trước Dưới tiêu đề danh sách cụ thể hiển thị trạng thái Module cài đặt hệ thống Những Module xác đinh mơt kểu (ví dụ mod_mainmenu) Nhiều thể module có thẻ tạo cách chép môt loại module cụ thể, cho tiêu đề khác thơng số khác theo nhu cầu bạn 2.2.3 Quản lý Template: Cung cấp nơi làm việc để cài đặt điều khiển template Các Administrator Manager với quyền cấp phép đặc biệt cho Template Manager chỉnh sửa template Cái nhìn cung cấp cho bạn danh sách template cài đặt Một dấu kiểm xanh lên bên tên template xuất Vài thông tin template lên Các template gán cho phần khác site, giống module Nếu bạn có nhiều template cài đặt hệ thống Joomla, bạn điểu Trang Đồ Án Tốt Nghiệp GVHD:Hồ Diên Lợi khiển chúng cách thuận lợi Bạn gán template cho (hay nhiều) trang đặc biệt từ than công cụ Khi bạn chọn template để gán, bạn thấy danh sách trang dể chọn Bạn chọn nhiều trang từ menu gán chúng cho template Khi gán song, template người dùng click vào trang Nó đè lên template mặc định Nếu bạn muốn xóa template gán từ (hay nhiều) trang, chọn lai template gán (bằng nút radio), click biểu tượng “Assign” cơng cụ Bây bạn chọn item bạn không muốn gán cho template hay khác, click “None” để xóa hồn tồn việc gán cho template Template Manager cho phép bạn chuyển đổi qua lại template mặc định (dùng nút Default) xuất tất trang mà gán đặc biệt CHÚ Ý : Cả template gán template mặc định bị gạt qua bên Template Selector module, có dùng Để biết cách cài đặt tháo bỏ Site Template Administrator Template, click vào liên kết Help Screen Install/Uninstall a Language or Template Để biết cách chỉnh sửa xuất Site Template Administrator Template, lick vào liên kết Help Screen Trang Đồ Án Tốt Nghiệp GVHD:Hồ Diên Lợi Template Manager CHÚ Ý :Những Administrator Template bật tắt cách nhấn biểu tượng “Publish” Chúng gán cho trang Administrator 2.2.4 Cách đưa module,template vào joomla  Bước 1:Đưa trỏ chuột vào extensions sổ xuống,rồi ấn vào extensions manager để install module template Trang Đồ Án Tốt Nghiệp GVHD:Hồ Diên Lợi  Bước 2:Chọn tệp cần upload  Bước 3:Sau chọn xong tập tin cần upload xong ấn vào upload &install Trang Đồ Án Tốt Nghiệp GVHD:Hồ Diên Lợi 2.3 Sử dụng WampSever chạy joomla: Để chạy joomla cài đặt chạy wampsever Trang 10 Đồ Án Tốt Nghiệp GVHD:Hồ Diên Lợi 2.4 Cài đặt joomla:  Localhost thuật ngữ việc việc sử dụng chương trình Web Server máy tính cá nhân để làm máy chủ web (Xem hướng dẫn cách cài đặt chương trình Server với WAMP XAMPP)  Khởi động chương trình Server  Do Joomla! có sử dụng sở liệu (Database) nên bạn phải tạo trước Databse ghi nhớ thông tin (Xem hướng dẫn Cách tạo Database phpMyAdmin localhost)  Bạn giải nén toàn thư mục tập tin gói cài đặt Joomla! vào thư mục web gốc (Web root) thư mục thường có tên www public_html Trang 14 Đồ Án Tốt Nghiệp GVHD:Hồ Diên Lợi Các thư mục tập tin Joomla! Cài đặt Joomla! 1.7.x localhost  Mở trình duyệt web nhập http://localhost vào địa trình duyệt sau nhấn Go phím Enter Địa web localhost Chương trình cài đặt Joomla xuất cửa sổ trình duyệt Sau bước cài đăt Joomla! 1.7 Localhost  Choose language (Chọn ngôn ngữ cài đặt) Bạn chọn ngôn ngữ cài đặt Đây ngôn ngữ hiển thị trình cài đặt sau cài đặt xong ngơn ngữ mà bạn chọn tích hợp sẵn cài đặt Joomla! hiển thị ln ngơn ngữ này, khơng hiển thị ngơn ngữ mặc định tiếng Anh bạn cần phải tự tay cài đặt thêm gói ngơn ngữ Sau chọn xong nhấn Next Chọn ngôn ngữ cài đặt Joomla!  Pre-Installation check (Kiểm tra trước cài đặt) Để đảm bảo trình cài đặt sử dụng Joomla! tốt nhất, chương trình kiểm tra trước thơng số máy chủ web xem có phù hợp với Joomla! hay khơng Đây thông số cần biết để sau chọn Host cho trang web thiết kế Joomla! Tất thơng số phải có màu xanh hình, có thơng số màu đỏ chứng tỏ thơng số khơng phù hợp với Joomla! bạn cần phải thay đổi lại thông số nhấn vào nút Check Again để kiểm tra lại Nếu tất thơng số bạn nhấn Next để tiếp tục Trang 15 Đồ Án Tốt Nghiệp GVHD:Hồ Diên Lợi Kiểm tra trước cài đặt Joomla! Database Type: Chọn loại sở liệu, thông thường MySQL 1) Host Name: Nhập tên Host, thông thường localhost 2) Username: Nhập tên tài khoản truy cập Database, cài đặt Localhost nên tên truy cập thường mặc định thường root 3) Password: Nhập mật truy cập Database, cài đặt Localhost nên mật truy cập để trống (khơng có mật khẩu) 4) Database Name: Nhập tên Database, tên bạn đặt lúc tạo Database 5) Table Prefix: Tiền tố bảng liệu, Joomla! 1.7 tạo cách ngẫu nhiên, bạn đặt lại theo ý muốn 6) Backup/Remove: Lựa chọn Sao lưu (Backup) hay Xóa (Remove) bảng liệu có sẵn sử dụng lại Database cũ Nhấn Next để tiếp tục Nếu thông tin khai báo chương trình cài đặt chuyển sang bước kế tiếp, khơng chương trình yêu cầu bạn nhập thông tin tiếp tục  FTP Configuration (Thiết lập cấu hình FTP) Đây phần thiết lập FTP, giao thức truyền tập tin mạnginternet Bước cài đặt thông thường không cần phải thực trừ số Host có yêu cầu Bạn bỏ qua thông số nhấn Next để tiếp tục (Sau thiết lập lại cần thiết phần quản lý Joomla!) Trang 16 Đồ Án Tốt Nghiệp GVHD:Hồ Diên Lợi Thiết lập cấu hình FTP  Configuration (Phần cấu hình) Tại bước bạn thiết lập thông tin cho trang web Thiết lập cấu hình cho Joomla! 1) Site Name: Nhập tên cho trang web, tên trang web tên miền (Domain Name) nhiên muốn bạn đặt theo tên miền Ngồi bạn nhấn vào Advanced Settings - optional để nhập thêm thông tin: - Meta Description: Nhập phần mô tả ngắn để giới thiệu cho nội dung trang web - Meta Keywords: Nhập từ khóa có liên quan đến nội dung trang web, từ khóa giúp người sử dụng tìm kiếm trang web bạn sử dụng công cụ tìm kiếm (yahoo, google, ) Bạn nhập nhiều từ khóa, từ cách dấu phẩy (,) 2) Admin Email: Nhập địa email người quản trị trang web, địa Email dùng để trao đổi thông tin tự động trang web thành viên 3) Admin Username: Đặt tên cho tài khoản dùng để truy cập vào phần quản trị trang web, đặt tên tùy ý, tài khoản có quyền hạn cao (Super Admin) 4) Admin Password: Đặt mật cho tài khoản quản trị trang web 5) Confirm Admin Password: Nhập lại lần để xác nhận mật Trang 17 Đồ Án Tốt Nghiệp GVHD:Hồ Diên Lợi 6) Install Sample Data (Cài đặt liệu mẫu), lần cài đặt sử dụng Joomla! bạn nhấn vào nút để tìm hiểu cách thiết lập cấu hình sử dụng thơng qua liệu mẫu Sau nhấn vào nút thơng báo liệu mẫu cài đặt ẩn  Finish (Hoàn tất cài đặt) Hoàn tất cài đặt Joomla! Chương – THIẾT KẾ CÁC THÀNH PHẦN CHÍNH CỦA WEBSITE: 3.1 Cài đặt template: 3.1.1 Thiết kế template: Bước 1:Chuẩn bị Download template mẫu webx  Bước 2:Thiết kế giao diện Cấu trúc giao diện  Trang 18 Đồ Án Tốt Nghiệp GVHD:Hồ Diên Lợi Template_demo -images -css -js -html(sao chép từ template mẫu 2.5) -favicon.ico -template_thumbnail.png -templateDetails.xml -index.php Trang 19 Đồ Án Tốt Nghiệp  GVHD:Hồ Diên Lợi Bước 3:Chuyển giao diện sang template joomla Trang 20 Đồ Án Tốt Nghiệp GVHD:Hồ Diên Lợi Kết khung Index.php để xác định vị trí module TemplateDetails.xml đặt vị trí module Trang 21 Đồ Án Tốt Nghiệp GVHD:Hồ Diên Lợi Bước 3:Cài đặt joomla bình thường: 3.1.2 Vẽ cấu trúc khung :  3.1.3 Cài đặt template vừa tạo : Trang 22 Đồ Án Tốt Nghiệp GVHD:Hồ Diên Lợi Chọn template vừa tạo: 3.1.4 Tạo menu đặt vị trí cho trang web : Trang 23 Đồ Án Tốt Nghiệp GVHD:Hồ Diên Lợi Tạo menu cho menu vừa tạo: 3.1.5 Cài đặt module cần thiết cho trang web: Trang 24 Đồ Án Tốt Nghiệp GVHD:Hồ Diên Lợi 3.2 Viết bài:  Bước 1:Tạo trung gian,để kết nối tới menu viết  Bước 2:Viết trỏ đến trung gian Trang 25 Đồ Án Tốt Nghiệp  GVHD:Hồ Diên Lợi Bước 3:Kết nối menu tới trung gian Kết quả: Trang 26 Đồ Án Tốt Nghiệp GVHD:Hồ Diên Lợi Trang 27 Đồ Án Tốt Nghiệp GVHD:Hồ Diên Lợi KẾT THÚC Ngôn ngữ Joomla kết hợp với hệ quản trị sở liệu MySQL cho phép thiết xây dựng Web có tính cao Thời đại mà công nghệ thông tin trở thành nhu cầu thiếu Việc trường học có trang web giúp thơng tin tới sinh viên nhanh Với thời gian lực có hạn, thời gian chúng em nghiên cứu ứng dụng ngôn ngữ Joomla hệ quản trị MySQL để xây dựng trang Web Khoa đại cương Đề tài hồn thành, xong khơng thể tránh khỏi thiếu sót kết đạt chưa cao Kính mong thơng cảm thầy bạn Để hoàn thành đề tài này, lần em xin chân thành cảm ơn giảng viên Hồ Diên Lợi người quan tâm, giúp đỡ chúng em suốt thời gian qua Và cho chúng em bày tỏ lòng biết ơn tới thầy giáo, giáo khoa Công Nghệ Thông Tin giúp chúng em hoàn thành đề tài chuyên ngành CHÚNG EM XIN CHÂN THÀNH CẢM ƠN Trang 28 ... thức website qua em thấy website đóng vai trò thiếu lĩnh vực giáo dục lĩnh vực khác…qua chúng em muốn xây dựng website lĩnh vực giáo dục,nên đồ án tốt nghiệp chúng em chọn đề tài thiết kế website. .. số website đóng vai trò khơng thể thiếu mạng internet .Website đa dạng nội dung đa dạng thể loại Ví dụ: • Trong lĩnh vực giáo dục gồm có :website trường cao đẳng cơng thương ,website trường đại. .. hạn, thời gian chúng em nghiên cứu ứng dụng ngôn ngữ Joomla hệ quản trị MySQL để xây dựng trang Web Khoa đại cương Đề tài hoàn thành, xong khơng thể tránh khỏi thiếu sót kết đạt chưa cao Kính