BÁO cáo KHỞI NGHIỆP tìm hiểu công nghệ mã nguồn mở wordpress phân tích thiết kế và xây dựng website sử dụng mã nguồn mở wordpress

BỘ GIÁO DỤC VÀ ĐÀO TẠO TRƯỜNG Đại học Kinh Doanh Công Nghệ Hà Nội Khoa Công nghệ thông tin BÁO CÁO KHỞI NGHIỆP MÔN: Mã Nguồn Mở Giảng viên: Nguyễn Duy Long Sinh viên thực hiện: Nguyễn Xuân Tuấn Anh – 19170223(NT) Vũ Chiển Chiêu – 19170479 Hoàng Anh Tùng – 19125826 Nguyễn Quang Khải – 19110186 Nguyễn Mạnh Quyết – 19136795 Phạm Xuân Đức – 19170710 Nhóm : TH24.36 Mục lục Lời mở đầu I Tìm hiểu cơng nghệ mã nguồn mở wordpress Wordpress gì? 3 Những thành tựu WordPress Ưu nhược điểm WordPress Các tính giao diện wordpress II Phân tích xây dựng website ứng dụng mã nguồn mở Wordpress Phân tích hệ thống Xây dựng website 11 III Tài liêu tham khảo IV KẾT LUẬN 20 21 LỜI MỞ ĐẦU Xã hội phát triển nhiều mặt kinh tế, văn hóa, xã hội kèm theo bùng nổ mạnh mẽ cơng nghệ thơng tin Vì thế, nhu cầu chia sẻ thông tin để kết nối doanh nghiệp người tiêu dùng ngày cần thiết Để đáp ứng nhu cầu đó, website cho cơng ty, doanh nghiệp, cá nhân đời Và việc xây dựng website nhu cầu khơng cịn xa lạ với cá nhân, tập thể mơi trường Internet Có nhiều cách để xây dựng website, thuê đối tác bên để tiến hành xây dựng tự thân doanh nghiệp, cá nhân sử dụng hệ thống mã nguồn mở có sẵn để xây dựng Wordpress số đó, với giao diện trực quan, dễ sử dụng, dễ dàng đáp ứng nhu cầu nâng cao cá nhân hay tập thể nhiều người thiết kế, sử dụng phản hồi tích cực Nắm nhu cầu đó, em chọn đề tài “Tìm hiểu cơng nghệ mã nguồn mở wordpress Phân tích thiết kế xây dựng website sử dụng mã nguồn mở WordPress” Mặc dù cố gắng nỗ lực để hoàn thiện đề tài, bên cạnh khơng thể tránh khỏi thiếu sót Mong nhận ý kiến góp ý, phản hồi Thầy Cơ để chúng em hồn thiện đề tài tốt tạo tảng cho phát triển nghiệp sau Xin chân thành cảm ơn ! I: Tìm hiểu cơng nghệ mã nguồn mở wordpress 1.Wordpress gì? WordPress phần mềm nguồn mở (Open Source Software) viết ngơn ngữ lập trình website PHP (Hypertext Preprocessor) sử dụng hệ quản trị sở liệu MySQL WordPress mắt lần vào ngày 27/5/2003 tác giả Matt Mullenweg Mike Little Hiện WordPress sở hữu phát triển cơng ty Automattic có trụ sở San Francisco, California thuộc hợp chủng quốc Hoa Kỳ WordPress mã nguồn mở ngôn ngữ PHP để hỗ trợ tạo blog cá nhân, nhiều người sử dụng ủng hộ tính dễ sử dụng, nhiều tính hữu ích Qua thời gian, số lượng người sử dụng tăng lên, cộng tác viên lập trình viên tham gia đơng đảo để phát triển mã nguồn WordPress có thêm tính tuyệt vời Và thời điểm viết 2015, WordPress xem hệ quản trị nội dung (CMS – Content Management System) vượt trội để hỗ trợ người dùng tạo nhiều thể loại website khác blog, website tin tức / tạp chí, giới thiệu doanh nghiệp, bán hàng – thương mại điện tử, chí với loại website có độ phức tạp cao đặt phịng khách sạn, thuê xe, đăng dự án bất động sản,…v… v…Hầu hình thức website với quy mơ nhỏ vừa triển khai tảng WordPress Nhưng khơng có nghĩa WordPress thích hợp với dự án nhỏ, mà có tới khoảng 25% website danh sách 100 website lớn giới sử dụng mã nguồn WordPress Ví dụ trang tạp chí TechCrunch, Mashable, CNN, BBC America, Variety, Sony Music, MTV News, Bata, Quartz,…và nhiều website lớn khác 2.Những thành tựu WordPress Trên giới, có khoảng 25 viết đăng lên website sử dụng WordPress giây Số lượng website làm WordPress chiếm 23% tổng số lượng website giới Trong số 100% website sử dụng mã nguồn CMS, WordPress chiếm 60% Phiên WordPress 4.0 đạt 16 triệu lượt tải sau khoảng hai tháng WordPress dịch sang 52 ngôn ngữ khác Tuy nhiên lại chưa có phiên tiếng Việt thức, bạn Việt hóa dễ dàng cách tìm blog với từ khóa “Việt hóa WordPress“ Có 80 chương trình họp mặt WordPress tổ chức vào năm 2014 Mã nguồn WordPress có khoảng 785 lập trình viên hợp tác phát triển Chỉ tính giao diện (hay cịn gọi theme) miễn phí thư viện WordPress.org có 2.700 themes khác 3.Ưu nhược điểm WordPress 3.1 Ưu điểm Nhiều plugin hỗ trợ, ý tưởng có plugin hỗ trợ Nhiều theme có sẵn, nhiều CMS Bao gồm theme miễn phí theme trả phí chuyên nghiệp Dễ tùy biến, bạn người có kiến thức sẵn PHP, CSS, HTML điều dễ dàng Nhiều cộng đồng hỗ trợ hướng dẫn, đơn cử ThachPham.Com Có thể làm nhiều thể loại website, từ blog cá nhân đến trang thương mại điện tử Dễ cài đặt Nhẹ hao tốn tài nguyên máy chủ Các Theme Framework có giúp bạn tự thiết kế giao diện WordPress dễ dàng Dễ sử dụng quản lý 3.2 Nhược điểm Nhiều khái niệm khó hiểu bạn bắt đầu Muốn tùy biến WordPress, bạn phải có kiến thức lập trình web Các theme đẹp đa phần phải trả phí Và plugin Nếu bạn Developer, bạn mệt mỏi với hàm có sẵn WordPress q nhiều 4 Các tính giao diện wordpress 4.1 Các tính WordPress Themes: WordPress có hệ thống đầy đủ theme giúp bạn thiết kế tất thứ từ blog đơn giản đến tạp chí online phức tạp Bạn chuyển đổi nhiều chủ đề với giao diện hoàn toàn khác cú nhấp chuột Công cụ giao tiếp blog: WordPress hỗ trợ đầy đủ tiêu chuẩn Trackback Pingback Các nhà phát triển cam kết hỗ trợ tiêu chuẩn khác phát triển tương lai Comments: Với tính khách truy cập vào website bạn họ để lại ý kiến bình luận mục riêng biệt, thơng qua Trackback hay Pingback để bình luận trang họ Bạn cho phép khơng cho phép bình luận viết cụ thể Bảo vệ Spam: WordPress trang bị công cụ mạnh mẽ tích hợp danh sách đen, mở kiểm tra proxy để quản lý loại bỏ bình luận spam blog bạn Nó có mảng phong phú plug-in để giúp nâng cao tính Đăng ký người dùng: WordPress có hệ thống đăng ký người dùng tích hợp sẵn (nếu bạn chọn) cho phép người đăng ký, trì hồ sơ để lại bình luận xác nhận blog Bạn đóng chức bình luận cho người dùng khơng đăng ký Ngồi ra, cịn có plug-in giúp ẩn viết cho tài khoản người dùng cấp thấp Mật bảo vệ viết: Tính cung cấp mật cho viết riêng biệt để ẩn chúng trang Bạn có viết cá nhân xem người viết Nhiều tác giả: Hệ thống người dùng nâng cao WordPress cho phép đến 10 cấp độ người dùng, với cấp độ khác người dùng có đặc quyền (và cấu hình) khác việc xuất bản, chỉnh sửa, tùy chọn người dùng khác Bookmarklets: Tính bookmarklets đa trình duyệt giúp bạn dễ dàng xuất đến blog thêm liên kết vào danh sách blog Ping away: WordPress hỗ trợ ping Ping-O-Matic, có nghĩa giúp cơng cụ tìm kiếm tiếp xúc tối đa với blog bạn Tóm lại, WordPress cơng cụ viết blog đa năng, dễ sử dụng khả tùy biến cao Quá trình cài đặt đơn giản, sưu tập template đa dạng, kiến trúc plug-in đa dạng, phù hợp cho người bắt đầu đáp ứng nhu cầu blogger chuyên nghiệp 4.2 Giao diện mặc định - Sau cài đặt xong Wordpress mặc đinh cho ta giao diện mang tên Twenty Fifteen Ảnh giao diện trang chủ * Ý nghĩa phần trang chủ: Tên trang mô tả (Description): Đây phần thể tên trang web Description phần thể câu hiệu, slogan bạn Sidebar: Là thành phần phụ nằm cạnh thành phần website Nó nằm bên phải, bên trái hai bên, tùy theme Trong giao diện mặc định này, thấy số thành phần khung tìm kiếm, viết mới, phản hồi mới,… Các phần gọi chung Widget Bài viết: Mỗi bạn đăng viết lên trang web, tự động chèn vào trang web Ngoài viết (post) ra, cịn loại page Hơi khác với post chút, thêm page chúng khơng đưa ngồi trang chủ post Chỉ đọc nội dung truy cập vào địa page Thơng tin post: Với phần này, Sẽ biết viết đăng tải nào, thuộc chun mục (Category) có bình luận thuộc viết,… cịn số thính khác mà có hiển thị hay khơng tùy theme sử dụng Footer: Là thành phần cuối trang web, bạn hiển thị thơng tin liên hệ hay bạn thích Thanh Adminbar: Mặc định, bạn đăng nhập vào tài khoản, trang web xuất menu màu đen Tại có liên kết dẫn tới trang khác Giao diện trang chi tiết viết * Ý nghĩa phần trang chi tiết viết: Tiêu đề: Không có khó hiểu cả, phần tiêu đề viết Nội dung: Đây phần thể đầy đủ nội dung post Còn bên vài thông tin liên quan đến viết ngày đăng, tác giả viết, v.v.v.v… Bình luận: Tại hiển thị bình luận dành cho viết Mỗi bình luận có tên người bình luận, ngày bình luận nút Trả lời (Reply) cho bình luận 4.3 Trang quản trị (Dashboard) - Đước rồi, giao diện trang quản trị Dashboard WordPress Giao diện trang quản trị * Chức menu: Bảng tin: Trong menu có số chức Lời chào tới WordPress, Phác thảo nhanh viết, Xem bình luận mới, tin tức từ WordPress,… Bài viết: Với menu này, quản lý viết đăng website, hay đăng thêm viết Ngoài quản lý chuyên mục (category), thẻ (tag) Phương tiện: Với menu quản lý file đăng tải lên website Trang: Tại tạo thêm trang xóa trang cũ Phản hồi: menu quản lý bình luận web cho phép hiển thị, đánh dấu Spam hay xóa comment Giao diện: Tại thay giao diện cho web, tùy biến giao diện dùng, chỉnh sửa Gói mở rộng: quản lý plugin website Cài thêm plugin mới, xóa plugin cũ Thành viên: Đây khu vực bạn quản lý thành viên website Cơng cụ: Với menu xuất liệu trang web file SQL Hay nhập liệu từ blog khác vào blog Cài đặt: Đây nơi cài đặt thiết lập cho trang web tiêu đề, câu slogan, cài đặt viết, bình luận, đường dẫn tĩnh,v.v.vv II Phân tích xây dựng website ứng dụng mã nguồn mở Wordpress Xây dựng website tin tức 1.Phân tích hệ thống 1.1Chức phía frontend STT Chức Mô tả Xem chi tiết viết Người xem xem chi tiết thơng tin viết bao gồm: thể thao, kiện nóng, dịch bệnh,… Bình luận Người xem bình luận viết Tìm kiếm viết Người dùng nhập thơng tin vào tìm kiếm để tìm kiếm viết Quảng cáo Trên website có slider banner quảng cáos Liên hệ Khách hàng nhập thông tin liên hệ vào form để liên hệ với Web Chi tiết chức phía frontend Xem hàng: Khách hàng truy cập vào địa website url, chọn vào page site để xem thông tin Đầu vào:Thông tin yêu cầu khách hàng viết Xử lý: Khi khách hàng chọn viết page Đầu ra: thơng tin viết bao gồm: tiêu đề chi tiết viết Bình luận: Sử dụng ứng dụng form comment facebook, Người xem chia sẻ cảm nghĩ họ viết, thơng tin bình luận khách hàng lưu vào database facebook Tìm kiếm sản phẩm: Sử dụng ứng dụng tìm kiếm google để kết tìm kiếm trả sát với yêu cầu người dùng nhất Liên hệ: Cho phép khách hàng liên hệ với web thông qua thông qua form liên hệ Quảng cáo: Trên trang chủ trang danh mục có đặt slider cho phép đặt banner quảng cáo 1.2 Chức phía admin STT Chức Mơ tả Quản lý viết Quản lý thông tin hình ảnh viết Quản lý danh mục Quản lý thông tin danh mục viết bao viết gồm chức thêm, xóa sửa danh mục sản phẩm Quản lý slide banner Trên website có slider banner quảng cáo Quảng cáo - Chi tiết chức quản trị admin 10 Quản lý sản phẩm: sử dụng chức post viết wordpress để đăng thông tin viết, đồng thời dùng thêm plugin advance custom field để thêm số trường vào phần đăng viết tác giả Quản lý danh mục sản phẩm: sử dụng phần quản lý danh mục viết mặc định wordpress để quản lý danh mục viết Quản lý slide banner Quảng cáo: sử dụng plugin in Revolution Slider để quản lý thêm, sửa, xóa banner quảng cáo 2.Xây dựng website 2.1 Cài đặt Wordpress localhost với Xampp 2.1.1 Download Xampp - Download trang web http://sourceforge.net/projects/xampp/ - Hoặc download trực tiếp tại: http://sourceforge.net/projects/xampp/files/XAMPP%2 0Windows/1.7.4/xampp-win32-1.7.4VC6.7z/download 2.1.2 Cài đặt Xampp Sau download thành công tiến hành cài đặt trương trình vào ổ C xampp-win32-5.6.15.exe Sau thư mục chạy file “ xampp-control “ 11 -Chạy module “ Apache ” “ Mysql ” 12 -Tạo Database MySQL cho Wordpress với PhpMyAdmin: mục “ Create database ” điền tên data base click “ Create “ 2.1.3 Download cài đặt Wordpress 13 -Truy cập vào trang web: https://wordpress.org/ -Hoặc download trực tiếp tại: https://wordpress.org/download/ -Sau download: Giải nén file wordpress.rar vừa download vào thư mục C:\ xampp\htdocs\ thư mục với nội dung sau 14 Tiến hành cài đặt wordpress Chạy dẫn: http://localhost/wordpress “ thực ” 15 -Điền thông tin csdl: tên database, tên đăng nhập, mật địa máy chủ csdl -> “ Gửi ” Bước cuối điền thông tin: Tiêu đề web, tài khoản đăng nhập quản trị website click “ Cài đặt wordpress ” 16 -Kiểm tra website cài đặt: cách vào đường dẫn http://localhost/wordpress/wp-admin -> đăng nhập với tài khoản vừa tạo 17 2.1.4 Xây dựng giao diện frontend 2.1.4.1 Giao diện trang chủ  Header: bao gồm thơng tin liên hệ, logo form tìm kiếm  Menu: chứa chuyên mục Trang chủ, Đại dịch covid19-Thảm họa trái đất  Slider: slide hình ảnh banner quảng cáo jquery 18  Content : Box hiển thị sản phẩm theo danh mục cha danh mục  Footer: gồm liên kết tới danh mục tới viết chứa thơng tin, sách 2.1.4.2 Giao diện hiển thị viết: 19 III Tài liệu tham khảo Tài liệu tin trang internet, khơng có tên báo, số xuất - Precisioη (2014) Setup a Domain on Your Windows VPS [Internet] [trích dẫn ngày 03/03/2014] Lấy từ: URL: https://www.youtube.com/watch?v=2Zz9SB5Gxmk - Wordpress (2014) Class Reference/wpdb [Internet] [trích dẫn ngày 03/03/2014] Lấy từ: URL: https://codex.wordpress.org/Class_Reference/wpdb - Mr Nav (2014) [WordPress Plugin] Database Info [Internet] [trích dẫn ngày 03/03/2014] Lấy từ: URL: http://www.izwebz.com/wordpress/plug-in/wordpress-plugindatabase-info/ - Google (2014) Google [Internet] [trích dẫn ngày 03/03/2014] Lấy từ: URL: https://google.com/ 20 IV Kết luận Thơng qua việc tìm hiểu nghiên cứu đề tài giúp chúng tơi có nhìn tồn diện mơn mã nguồn nói chung mà phần mềm WordPress nói riêng Chúng em hiểu phần thấy công việc cần phải làm để thiết kế giao diện cho website sử dụng hệ quản trị nội dung WordPress Tuy gặp phải nhiều khó khăn em cố gắng để hồn thành đề tài tiêu chí sau: - Hiểu cấu trúc theme WordPress - Tạo website với giao diện đơn giản theo ý muốn - Đưa website lên Internet quản trị Hy vọng nghiên cứu đánh giá chúng em góp phần tìm hiểu thêm phần mềm WordPress Do thời gian có hạn nên báo cáo không tránh khỏi sai sót, mong thầy góp ý, đánh giá giúp chúng em hoàn thiện đầy đủ hơn Chúng em xin chân thành cảm ơn! 21 ... thể nhiều người thiết kế, sử dụng phản hồi tích cực Nắm nhu cầu đó, em chọn đề tài ? ?Tìm hiểu cơng nghệ mã nguồn mở wordpress Phân tích thiết kế xây dựng website sử dụng mã nguồn mở WordPress? ?? Mặc... Lời mở đầu I Tìm hiểu cơng nghệ mã nguồn mở wordpress Wordpress gì? 3 Những thành tựu WordPress Ưu nhược điểm WordPress Các tính giao diện wordpress II Phân tích xây dựng website ứng dụng mã nguồn. .. để xây dựng website, th đối tác bên ngồi để tiến hành xây dựng tự thân doanh nghiệp, cá nhân sử dụng hệ thống mã nguồn mở có sẵn để xây dựng Wordpress số đó, với giao diện trực quan, dễ sử dụng,