Tìm hiểu kỹ thuật làm giao diện cho hệ quản trị nội dung Wordpress và ứng dụng (Đồ án tốt nghiệp)Tìm hiểu kỹ thuật làm giao diện cho hệ quản trị nội dung Wordpress và ứng dụng (Đồ án tốt nghiệp)Tìm hiểu kỹ thuật làm giao diện cho hệ quản trị nội dung Wordpress và ứng dụng (Đồ án tốt nghiệp)Tìm hiểu kỹ thuật làm giao diện cho hệ quản trị nội dung Wordpress và ứng dụng (Đồ án tốt nghiệp)Tìm hiểu kỹ thuật làm giao diện cho hệ quản trị nội dung Wordpress và ứng dụng (Đồ án tốt nghiệp)Tìm hiểu kỹ thuật làm giao diện cho hệ quản trị nội dung Wordpress và ứng dụng (Đồ án tốt nghiệp)Tìm hiểu kỹ thuật làm giao diện cho hệ quản trị nội dung Wordpress và ứng dụng (Đồ án tốt nghiệp)Tìm hiểu kỹ thuật làm giao diện cho hệ quản trị nội dung Wordpress và ứng dụng (Đồ án tốt nghiệp)Tìm hiểu kỹ thuật làm giao diện cho hệ quản trị nội dung Wordpress và ứng dụng (Đồ án tốt nghiệp)Tìm hiểu kỹ thuật làm giao diện cho hệ quản trị nội dung Wordpress và ứng dụng (Đồ án tốt nghiệp)
B GIÁO D O I H C DÂN L P H I PHÒNG -o0o - ÁN T T NGHI P I PHÒNG 2016 B GIÁO D O I H C DÂN L P H I PHỊNG -o0o - TÌM HI U K THU T LÀM GIAO DI N CHO H QU N TR N I DUNG WORDPRESS VÀ NG D NG ÁN T T NGHI I H C H CHÍNH QUY Ngành: Cơng ngh Thơng tin H I PHỊNG - 2016 B GIÁO D O I H C DÂN L P H I PHÒNG -o0o - CHO ÁN T T NGHI I H C H CHÍNH QUY Ngành: Cơng ngh Thơng tin Sinh viên th c hi n: Tr nh Doãn Khi n ng d n: ThS u Mã s sinh viên: 1212101001 - - -o0o - NHI M V THI T K T T NGHI P Sinh viên: Tr nh Doãn Khi n Mã s : 1212101001 L p: CT1601 Ngành: Cơng ngh Thơng tin tài: Tìm hi u k thu t làm giao di n cho h qu n tr n i dung Wordpress ng d ng NHI M V TÀI N i dung yêu c u c n gi i quy t nhi m v tài t t nghi p a N i dung: - Tìm hi u v h qu n tr n i dung mã ngu n m WordPress - t máy website xây d ng t WordPress - K thu t t o giao di i dùng cho WordPress - Qu n tr n i dung trang tin WordPress - b Các yêu c u c n gi i quy t - Hi c m c tiêu cách th c th c hi n - Xây d c m t website v i giao di Các s li u c n thi m th c t p thi t k , tính tốn Internet CÁN B NG D TÀI T T NGHI P ng d n th nh t: H tên: u H c hàm, h c v : Th i h c Dân l p H i Phòng N ng d n: - Tìm hi u v h qu n tr n i dung mã ngu n m WordPress - t máy website xây d ng t WordPress - K thu t t o giao di i dùng cho WordPress - Qu n tr n i dung trang tin WordPress - Internet ng d n th hai: H tên: H c hàm, h c v N ng d n: tài t t nghi c giao ngày 18 tháng 04 Yêu c u ph n nhi m v Sinh viên n nhi m v Cán b ng d HI NG n H u Ngh PH N NH N XÉT TÓM T T C A CÁN B Tinh th c nhi m v NG D N tài t t nghi p: ng c tài t t nghi p (so v i n i dung yêu c tài t t nghi p) m c a cán b ng d n: m ghi b ng s ch ) Cán b ng d n ( Ký, ghi rõ h tên ) PH N NH A CÁN B CH M PH N BI T T NGHI P m c a cán b ph n bi n ( m ghi b ng s ch ) Cán b ch m ph n bi n ( Ký, ghi rõ h tên ) TÀI án t t nghi p ng p H i Phòng L IC c h t em xin bày t lòng bi Công ngh thông tin thông tin - t ng d n t , ch b o em su t t c th y cô giáo B mơn Cơng ngh i Phịng, chân thành c gia gi ng d y truy y giáo, cô giáo tham t nh ng ki n th c quý báu su t th i gian em h c t p c ph n bi n lu nghiên c B môn t nghi p Em xin chân thành c t u i h c Dân L p H nhi u th i gian quý báu, tr c ti trình làm lu i v i Th.S a em giúp em hi u rõ em có th hồn thành lu n án Em xin c n H u Ngh Hi Dân l p H i Phòng, Ban giám hi ih c ng, B mơn tin h c, Phịng ban nhà u ki n t t nh t su t th i gian h c t p làm t t nghi p Tuy có nhi u c g ng trình h c t p, th i gian th c t tránh kh i nh ng thi u sót, em r t c s góp ý quý báu c a t t c th k t qu c t c b n c hoàn thi Em xin chân thành c H Sinh viên Tr nh Doãn Khi n án t t nghi p ng p H i Phòng M CL C L IC DANH M C HÌNH GI I THI U 1: H QU N TR N I DUNG WORDPRESS 1.1 Gi i thi u mã ngu n m 1.1.1 Khái ni m mã ngu n m 1.1.2 Phân lo i ph n m m ngu n m 1.1.3 L i ích mã ngu n m 1.1.4 M t s lo i mã ngu n m ng g p 1.2 Tìm hi u v WordPress 11 1.2.1 Gi i thi u v h qu n tr n i dung WordPress 11 n phát tri n c a WordPress 12 1.2.3 Nh ng thành t u c a WordPress 14 1.2.4 Nh ng nét n i b t c a WordPress 15 C XÂY D NG T WORDPRESS 17 2.1 Nh ng yêu c t cho WordPress 17 t Wordpress Localhost 17 THU T T O GIAO DI I DÙNG TRONG WORDPRESS 25 3.1 Khái ni n v giao di i dùng WordPress (Theme Wordpress)25 3.2 C u trúc c a Theme WordPress 26 3.2.1 C c Theme WordPress 26 3.2.2 Theme Stylesheet 27 3.2.3 T p tin tùy ch n ch 27 3.2.4 Template files 28 3.2.6 Vòng l p (Loop) 32 3.3 Thi t k theme WordPress 33 ng thi t k Theme 33 3.3.2 T o c u trúc theme 34 3.3.3 Vi t code cho t p tin function.php 35 án t t nghi p ng p H i Phịng Hình 4.2.19: Thêm Trang vào Menu c 3: Thêm m t liên k t v i tùy ch n Link có th Hình 4.2.20: Thêm Liên k t vào Menu c 4: Thêm Catelogy (Chuyên m c) vào Menu v a t o, xem hình sau: i án t t nghi p ng p H i Phịng Hình 4.2.21: Thêm Chun m c vào Menu - Cách t o m t Menu Location Sau ng vào Menu H c WordPress r i, có th ch i n áp d ng cho Menu ph n Menu Settings Hình 4.2.22: T o Menu Location Bây gi tr l i trang ch s th y WordPress n th Menu H c án t t nghi p ng p H i Phịng Hình 4.2.23: Menu xu t hi n trang ch 4.2.6 - ng d n Plugin WordPress Plugin gì? Plugin cd ng Vi t nhu c u c a Chúng ta có th tr nên hồn h o h m b sung thêm m t Website c a t Website WordPress chuyên nghi p không ch c n p mà c n có cách s d ng Plugin h p lý n a Hi n t i s ng n WordPress.org r t nhi u hồn tồn mi n phí - t Plugin + Cách tìm Plugin: Chúng ta truy c p vào B ng tin > Gói m r ng > Cài Plugin m i án t t nghi p ng p H i Phịng Hình 4.2.23: Cài plugin m i Chúng ta có th tìm plugin b ng cách: Cách 1: Thơng qua tên b n tên khung Tìm Plugins bên tay ph i r i Enter Cách 2: Chúng ta xem danh sách Plugin thông qua b l b t (Featured), N i c quan tâm (Popular), Khuyên dùng (Recommended), u thích (Favorites) Hình 4.2.24: Danh sách plugin án t t nghi p + ng p H i Phòng t Plugin c plugin, nh n vào t ti t Plugin: Hình 4.2.25: Giao di n c 4.2.7 Qu n tr M t Plugin i dùng (users) WordPress i dùng có WordPress có th quy n khác nhau, có th t c l p s n có nh ng i dùng m i v i quy n t thi t l p thông qua plugin C th mu n thêm m t h a s a khác ho c m i dùng ch i dùng c quy n s a mà khơng có quy n t o m lên website cho vào nhóm Ch nh s a ch ng h n - T khơng có quy n i dùng (user) m i qu n lý Chúng ta truy c p vào B ng tin -> Thành viên -> Thêm m i , án t t nghi p ng Hình 4.2.26: Giao di n t Nh viên m i - i dùng, b u t o m i dùng m i n vào nút Thêm thành i dùng m i Cách xem s Sau t p H i Phịng i dùng i dùng, có th i dùng b ng cách truy c p vào B ng tin -> Thành viên > T t c i dùng Hình 4.2.27 ch nh s i dùng i dùng, nh n vào Ch nh S a i dùng ti n hành ch nh s a nh n vào nút C p nh t i i án t t nghi p ng Vai trò c a m p H i Phòng i dùng: + + N + + + 4.2.8 ng d n m t - t -> T ng quan Hình 4.2.28 t t ng quan Trong khu v c có thi t l p sau: + trang (Site Title): Tên c a website, tên s hi n th m nh website + Kh u hi u (Tagline): Mô t + slogan c a website a ch WordPress (URL) [WordPress Address (URL)]: website WordPress hi n t i c a d n c a Post Page website a ch s a ch c a ng án t t nghi p + ng a ch trang Web (URL) [Site Address (URL)]: p H i Phòng a ch c a website trang ch c a chúng ta, n u cài website WordPress làm trang ch nên gi ng v i WordPress Address + a ch E-mail (E-mail a ch email c i qu n tr website, thông báo quan tr ng v website s g i v + Thành viên (Membership): N khách có th t u vào m c Anyone can register, i dùng website c a t i a ch http://domain/wp-login.php?action=register + Vai trò c a thành viên m i mà nh i dùng i dùng m nh sau h + Múi gi (Timezone): Múi gi mà mu n s d ng website, Vi t Nam GMT + + nh d ng ngày nh d mu n hi n th website + Tu n b u vào (Week Start On): Ngày mà mu n ngày u tiên c a tu n + Ngôn ng c a trang (Site Language): Ngôn ng mà mu n dùng website - t -> Vi t án t t nghi p ng Hình 4.2.29 p H i Phòng t Vi t a thi t l p: + nh d ng(Formatting): Bi chuy i bi ng chuy ng i ký hi u bi u c m sang d ng hình c h tr s n b i WordPress WordPress t ng s a ch a XHTML không h p l (WordPress should u post c a u ph u vào ph n n i dung c tuân th theo c u trúc cú pháp XHTML h pl + Chuyên m c m nh (Default Posnt Category): Category m nh c a m t Post n u quên ch + nh d ng vi t m m nh (Default Post Format): Lo nh d ng post u quên ch n + i dung c a m + n t (Post via ee-mail, s ng d n c th ph n m t riêng a ch án t t nghi p ng p H i Phòng + D ch v c p nh t (Update Service): Các d ch v ping mà mu n WordPress t - t- ng g i tín hi u ping có m i c Hình 4.2.30 c Ý ngh a c a thi t l p: + Hi n th nhi u nh t (Blog pages show at most): S ng post hi n th trang blog Hi n t i c hi t trang hi n th danh sách post m i nh t website + Dịng thơng tin cho vi t m i (Syndication feeds show the most recent): S ng post m c hi n th t i trang RSS Feed c a website (http://domain/feed) + Bài dịng thơng tin,hi n (For each article in a feed, show): + (Full text): hi n th n i dung RSS Feed v i toàn n i dung + Tóm t t (Summary): hi n th n i dung RSS Feed v i b n rút g n + i cơng c tìm ki m (Search Engine Visibility): N u u vào ph ch ng h n) khơng th a c máy tìm ki m (Google m c n i dung c a chúng ta, t c a không hi n th k t qu tìm ki m t i Google án t t nghi p - ng p H i Phòng t -> Th o lu n truy c p vào khu v c ng d n sau: t -> Th o lu n Hình 4.2.31: Trang khu v t -> th o lu n Ý ngh a c a thi t l p: + Tùy ch n m nh cho vi t/trang: Các thi t l vi c b có th i bình lu n cs al i d ng m ch n nh Các thi t l p t ng post/page riêng l + Các tùy ch n khác v ph n h i: Các thi t l p khác liên quan t i vi c g i bình lu n + E-mail me whenever: Thi t l p nh n e-mail thơng báo v bình lu n + : Áp d c ph n h c bình lu c hi n th lên + Xét t ph n h i: T bình lu n vào tr ng thái ch t n u a t khóa, liên k t, email ho M i quy t c ch u ph t a ch IP có danh sách m t dòng riêng án t t nghi p ng + p H i Phòng n h i: Các t c m bình lu n M i t c m s khai báo b ng m t dịng N u bình lu c a t c m s b d u Spam + - i di n: Tùy ch n hi n th nh avatar c t- i g i bình lu n n Hình 4.2.32: Trang khu v c tùy ch nh Media Các thi t l + sau: c nh (Image sizes): Các thi t l p s nh m nh c c c sinh sau upload m t t m vi n, bao g m lo i sau: C thu nh c nh lo i nh C trung bình (Medi c nh lo i trung bình C l n (Large size): c nh lo i l n + Khi t i t p tin lên (Uploading Files): Thi t l p liên quan t i vi c upload t p tin S p x p t p tin uploads into month c d and year based folder): T (Organize my t p tin c v i c u trúc ngày tháng so v i th i gian upload - t- ng d c án t t nghi p ng Hình 4.2.33: Trang khu v t- p H i Phòng ng d Các thi t l p khu v + t thông d ng (Common Settings): Các thi t l p thông d ng M nh (Default): C ng d n m (Day and name): C ng d ng) ng d n v i ki u hi n th ngày tháng (Month and name): C ng d n v i ki u hi n th D ng s (Numeric): C ng d n hi n th ID c a post thay tên Tên (Post name): Ch hi n th ng d n Tùy bi n (Custom Structure): Tùy ch nh c ng d n tùy ý, xem thêm ph n cu i vi t + Tùy ch n thêm (Optional): Các thi t l p tùy ch n không b t bu c ng d n m c a cho chuyên m c ng d n t i trang category c a th trang tag ng d n m c ng d n t i án t t nghi p ng p H i Phịng K T LU N Tìm hi u k thu t làm giao di i dùng cho h qu n tr n i dung WordPress ng d ng c quan tâm nhi u th i gian H qu n tr n i dung tri n r t m nh m Trong trình kh o sát tìm hi Chi i s ch d n c a gi c ph n th c công vi c c n ph 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 g - Hi - T tài tiêu chí sau: c c u trúc theme WordPress c m t website v i giao di n riêng theo ý mu n Giao di hoàn thành qu n tr c xây d ng m b WordPress v i nh ng Template c n thi tiêu chu n c a m t Theme n M trình kh o sát tìm hi u thi t k giao di sót Vì v y em mong quý th góp ý ki g ng r t nhi u không tránh kh i nh ng thi u ng quan tâm em hoàn thi n giao di n m tài ch d n án t t nghi p ng p H i Phòng CÁC TÀI LI U THAM KH O [1] K Thu t Và Th Thu t L p Trình PHP, Th.S Nguy n nhóm tin h c th c d ng, NXB H [2] T c ng Database B ng PHP&MySQL, VN-GUIDE (T ng h p biên d ch), NXB Th ng Kê [3] Giáo Trình - L p Trình ng D ng Web V i PHP (T p 1, T p 2), Khu t i H c Qu c Gia TP.HCM [4] S Tay PHP & MySQL, Nguy n Xã H i ng Sinh ch ng ... tin tài: Tìm hi u k thu t làm giao di n cho h qu n tr n i dung Wordpress ng d ng NHI M V TÀI N i dung yêu c u c n gi i quy t nhi m v tài t t nghi p a N i dung: - Tìm hi u v h qu n tr n i dung mã... WORDPRESS 3.1 Khái ni n v giao di i dùng WordPress (Theme Wordpress) i v i website làm b ng WordPress giao di Theme) i dùng (hay cịn g i c ch tồn b t p tin thi t k giao di phép i, ch nh s a giao. .. n: - Tìm hi u v h qu n tr n i dung mã ngu n m WordPress - t máy website xây d ng t WordPress - K thu t t o giao di i dùng cho WordPress - Qu n tr n i dung trang tin WordPress - Internet ng d n