Tìm hiểu cấu trúc giao diện WordPress
Đối tượng: dành cho những người không biết lập trình php.
Mục đích: hiểu cấu trúc giao diện để có thể tự chỉnh sửa, chèn code.
Những ngày đầu tiên mó máy với WP, tôi cài thử khá nhiều plugin. Thích nhất là những loại chỉ việc upload và kích hoạt rồi dùng, khổ sở nhất là những plugin phải chèn code vào. Đôi lúc, các bạn sẽ gặp được những câu kiểu “insert this code to wherever you like“-hãy chèn code này vào chỗ nào bạn thích. Chúng ta cũng không đến nỗi đần độn lắm nhưng có phải ai cũng biết về máy tính đâu, nhất là lập trình, bởi phải dành thời gian cho chuyên môn của mình (nếu cũng suốt ngày ngồi máy tính thì ta cũng giỏi như họ thôi 
). Bản thân tôi làm về Vật lý, đôi lúc cũng phải viết code để máy tính “nói chuyện” được với máy đo nhằm lấy dữ liệu mà đụng tới cái món này cũng thấy oải. Với lời chỉ dẫn kiểu thế kia, chúng ta biết không phải là in ra, cắt rồi dán lên màn hình mà phải dán vào một file nào đó. Nhưng file đó là file nào thì chịu. Vấn đề này chỉ có thể giải quyết bằng cách hiểu được cấu trúc giao diện của WP, file nào hiển thị phần nào trên màn hình, lúc đó thì công việc trở nên quá ngon chuối.
Hãy tìm hiểu một kiểu giao diện rất hay được dùng trong WP. Khi cài WP, chúng ta có 2 theme: classic và default. Chúng đều có một kiểu như nhau, chỉ bố trí khác đi mà thôi, các theme trôi nổi trên internet cũng vậy.
Hình dưới đây phác họa một cấu trúc giao diện, gồm các phần:
- Đầu: header.php.
- Thân: index.php, archive.php, search.php, page.php, single.php.
- Cột: sidebar.php, tên_plugin.php (tên file tùy thuộc vào plugin).
- Chân: footer.php.
Mỗi vùng trên giao diện do một hoặc nhiều file đảm nhiệm. Có lẽ chỉ cần nhìn vào hình này là các bạn đã biết những file nào cần sửa rồi. Tuy nhiên, để cho đầy đủ thì ta vẫn cứ bàn sâu thêm chút nữa.
Phần đầu
Header.php tải các file định dạng css. Link tới banner cũng hay được chứa ở đây. Nếu muốn sửa nội dung banner, bạn phải xem trong folder theme/tên theme/images. Các menu ngang cũng được gọi từ file này bằng hàm wp_list_pages.
Phần thân
Đây là phần chứa nội dung của bài, trang. Các file sau sẽ được gọi tùy theo trường hợp:
- index.php: hiển thị nội dung các bài trên trang chủ. Số bài xuất hiện do các bạn qui định trong Admin. (Xem “Cấu trúc index.php”)
- archive.php: khi click chuột vào Category (Chuyên mục) thì file này được gọi ra để hiển thị các bài trong Chuyên mục đó.
- search.php: giống như archive.php, hiển thị các bài tìm thấy khi sử dụng chức năng tìm kiếm
- page.php: hiển thị 1 trang tĩnh.
- single.php: hiển thị nội dung 1 bài và lời bình của bài này. Nó được gọi khi click vào bài để đọc.
Cấu trúc của 4 file đầu khá giống nhau. Ban đầu, chúng gọi đầu==> bài==>cột==>chân. Kết quả là ta có một trang web hoàn chỉnh.
Phần quan trọng nhất chứa danh sách tóm tắt các bài hoặc nội dung 1 bài được bắt đầu bằng vòng lặp (loop), while (have_post()), tức là trong khi còn bài với số bài ta qui định hoặc tìm thấy thì hãy hiển thị ra. Trong vòng lặp này, các bạn thấy nó sẽ yêu cầu hiển thị (trong ngoặc là các hàm):
- thời gian (the_time),
- tác giả (the_author),
- nội dung (the_content)
- số lời bình (comments_popup_link)
của mỗi bài nên ta thấy các bài có cấu trúc lặp lại nhau.
Riêng single.php thì hơi khác: nó hiển thị chỉ 1 bài cùng các thông tin như trên nhưng còn thêm phần liệt kê lời bình với lệnh comments_template();. Để sửa giao diện các lời bình và phần trả lời của độc giả, bạn sửa file comments.php.
Sau khi hiển thị nội dung bài với vòng lặp rồi thì cả 4 file này đều gọi tiếp cột (get_sidebar()) và chân (get_footer();)
Phần Cột
sidebar.php sẽ dùng phép thử xem chúng ta có dùng widget hay không:
if ( function_exists(’dynamic_sidebar’) && dynamic_sidebar(1) )
Nếu không thì nó sẽ mặc định hiển thị một số phần. Mỗi theme sẽ có phần mặc định riêng của mình, đó là các phần mà bạn nhìn thấy mỗi khi cài theme mới.
Nếu chúng ta dùng widget thì để sửa, ta phải sửa các plugin mà ta gắp bỏ vào sidebar.
Phần Chân
footer.php dùng để hiển thị phần dưới cùng của theme chứa thông tin của tác giả tạo ra theme ấy.
Như vậy, chúng ta đã đi qua một lượt các file quan trọng của một theme. Sẽ có những theme có cấu trúc phức tạp, khác nhau ở việc bố trí các phần nhưng linh hồn của chúng thì đều nằm ở vòng lặp. Các phần tiêu đề, nội dung, ngày tháng, thông tin phụ ở trong đó, khác nhau ở phần bố trí cái nào trước sau mà thôi.
Hi vọng qua bài này, các bạn có một cái nhìn toàn cảnh về cấu trúc của một theme, từ đó sẽ tự chỉnh sửa một cái cho riêng mình và khi gặp câu “insert this code to wherever you like” thì biết chỗ mà ta thích nằm ở đâu rồi. :-d :-d :-d
Chúc các bạn thành công!
ultra pasturized half and half or castille soa or sima products corp or soa esb or ultra turbo hg
allegra seatle or side effects of allegra or allegra led zeppelin violin or does allegra contain any depressant ingredients or allegra print and imaging
He he, đi đâu cũng được bà con chỉ! Cám ơn mọi người rất nhiều nha!
Qua bài này mình đã học được một tri thức mới. Cảm ơn bạn. Lâu lâu mình mới đi ghé thăm các blog, thấy dạo này các blog đã đi sâu vào chất lượng bài viết chứ không đơn thuần là chia sẻ cảm xúc mộc mạc nữa. Điều này thật là tuyệt.
Bạn có thể đọc bài mới của mình để giải quyết vấn đề này:
http://www.quocthinh.com/cau-truc-index
Cám ơn anh. Vậy việt hóa No Comments thành 0 Ý kiến, thì mình sữa hàm nào ở file Comment.php hả anh.
Cái đó mình sửa trực tiếp trong index.php:
<div class=”postmeta”>
Mục: < ?php the_category(', ') ?>, < ?php the_time('j-m-Y') ?>
</div>
Như vậy, hàm the_category sẽ gọi tên mục ra, tiếp đó là dấu phẩy và hàm the_time gọi ngày tháng. Để viết thành ngày tháng như blog này thì bạn viết thành j-m-Y, hoặc j/m/Y nếu thích dùng gạch chéo.
Thưa anh thịnh, em việt hóa cụm từ sau: Đăng bởi admin vào ngày 19th, February, 2008 trong danh mục…Nhưng làm thế nào để việt hóa tự động như anh là (ví dụ bài này) Mục: Làm Blog, ngày 29-01-2008
Em không thích February làm sao cho nó tự động thành tháng 2. Cám ơn anh nhiều.
Cám ơn anh Thịnh nhiều !!!
Trả lời cho bạn Công Hùng: Chống DDoS, dù host việt hay host nước ngoài thì cũng như nhau, quan trọng bạn tạo một trang mở màn (có link dẫn vào nội dung trang index bên trong), phải thông qua trang mở màn này thì mới vào được như vậy hạn chế IP giả dội bom
Ví dụ trang mở màn có cài Protection Gate Lite v3.2 chống DDoS
Bạn sẽ thấy Press the button below to access to the trangcuaban.COM, click vào buuton mới vào được.
Hiện tại thì mình mới biết plugin để giải quyết việc định nghĩa sidebar cho từng page:
http://www.nexterous.com/scripts/pagesidebars.php
Còn nếu muốn định nghĩa riêng các trang theo ý muốn thì phải tự sửa code. Hướng dẫn ở đây
http://marstonstudio.com/index.php/2007/07/17/multiple-wordpress-widget-sidebars/
Mới đọc qua thì mình thấy không khó lắm. Mình chưa thử nên bạn phải tự lực xem.
Chào anh thịnh, tình cờ search goolge về thủ thuật WP. Thấy trang của anh. Đọc trang anh, em thấy rất hay và ý nghĩa. Em đang bí về chiêu sau: hiện hay em chèn code để nghe nhạc, chèn vào Text của Slidebar (cột trái). những em chỉ muốn ở trang index nghe được nhạc từ việc chèn code ở Text. Còn Vào trang Page hay Single thì làm sao để mất text chứa code này, chủ yếu không nghe nhạc. Rất cám ơn anh
Mấy nhà cung cấp nhỏ còn bị cái này thì mình làm gì có cách chống. Tất nhiên, nếu mua host xịn thì sẽ thoát được cảnh này. Thực ra thì mình thấy thuê host ở VN cũng được, tiền nào của nấy, ở đâu cũng thế thôi.
Em chuẩn bị mở web riêng nhưng thấy cái vụ tấn công Distributed Denial of Service Attacks (liên tục bị DDoS với mức độ cao) làm hết băng thông qui định trong 1 tháng chỉ trong vòng vài ngày, thì tiền đâu mà thuê thêm băng thông. Anh có cách nào chống lại tấn công này không. Thuê host ở nước ngoài an toàn không anh ?
Bạn định thêm cái gì vào sau đó? Hàm của họ l
the_views(’lần xem’, true) thì cứ để nguyên thế, thêm làm gì để bị lỗi. Bạn cứ chèn rồi xem kết quả.
Ah. Làm được rùi cám ơn anh nhiều.
Ý em nói là thêm vào sau the_views(’lần xem’, true) đúng không anh
Không, cứ đẻ thể mà chèn, có thể thay View bằng gì bạn muốn hiển thị, ví dụ:
the_views(’lần xem’, true) thì nó sẽ hiển thị
xxx lần xem
mã hướng dẫn chỉ có nhiêu đây the_views(’Views’, true)
thêm một tý vào mã đó để chèn, đúng không anh
index.php: hiển thị nội dung các bài trên trang chủ.
single.php: hiển thị nội dung 1 bài và lời bình của bài này. Nó được gọi khi click vào bài để đọc.
Nếu bạn muốn hiển thị ở cả trang chủ lẫn khi xem riêng một bài thì phải chèn vào cả 2.
Chèn ở đâu? Chèn ở phía trong cái loop mà mình đã giới thiệu. Trong loop, sẽ hiển thị title, metadata, content. Bạn cứ chèn thử ở đâu đó, chạy thử, rồi lại thử vị trí khác, cái này tùy vào sở thích của bạn muốn hiển thị thông tin kia xuất hiện ở đâu. Ví dụ muốn hiển thị sau content thì chèn ngay sau hàm gọi content (tìm phía trong loop). Cứ thử đi, không sợ hỏng đâu, tất nhiên là nhớ backup lại file gốc để restore khi cần.
Tình hình thế này thì có lẽ mình sẽ viết thêm một bài về ví dụ chèn code trong loop.
Nhưng mà chèn vào file nào hả anh, index.php hay single.php, chèn vị trí nào.
Trong cái đoạn Function Reference, họ liệt kê các hàm mà tùy thuộc vào mục đích, bạn sẽ chèn nó vào theme.
Ví dụ, muốn có total views number thì dùng hàm cuối cùng, sử dụng true hoặc false tùy vào bạn có muốn tính cả số lần view của các robot tìm kiếm: get_totalviews(true,true)
Hàm đầu tiên cũng được: the_views(’Views’, true). Bạn thay từ View bằng chữ gì bạn thích, ví dụ ‘lần xem’.
Bài viết mình đã viết rất rõ và vẽ hình là chèn vào file nào, bạn cũng nên đọc để hiểu được cấu trúc để có thể biết chèn ở đâu khi cần.
Em tải Post Views Plus về rùi.
Nó hướng dẫn như sau:
Upload the files of ‘postviews_plus’ folder to the ‘/wp-content/plugins/’ folder.
Activate the plugin ‘WP-PostViews Plus’.
Add the funvtion of showing views to your templates.function reference
Em làm theo hường dẫn và vào trang hướng dẫn của chương trình http://fantasyworld.idv.tw/programs/wp_postviews_plus/en/2
Nó kêu sau active là chèn mã vào theme. chèn những mã sau, em không biết chèn ở file nào của theme và có chèn hết đoạn mã dài dòng như nó kêu không ?
Function Reference
the_views(’Views’, true)
The views of post.
1st value: the world after views number.
2nd value: is output(true for output, false for return number)
the_user_views(’Views’, true)
The views of post by user.
1st value: the world after views number.
2nd value: is output(true for output, false for return number)
the_bot_views(’Views’, true)
The views of post by bot.
1st value: the world after views number.
2nd value: is output(true for output, false for return number)
get_most_viewed(”, 10, 0 , true , true)
The most views posts. return the string of list start by and end by .
1st value: type of post(’post’ for post, ‘page’ for page, ” for both)
2nd value: the number of post you what to get
3th value: the words of title(0 for no limit)
4th value: is output(true for output, false for return string)
5th value: is include bot views(true for include, false for uninclude)
get_most_viewed_category(0, ”, 10, 0, true, true)
The most views posts in catrgory. return the string of list start by and end by . (After Version 1.1.0)
1st value: the category ID(It can be a single ID or an array of ID)
2nd value: type of post(’post’ for post, ‘page’ for page, ” for both)
3nd value: the number of post you what to get
4th value: the words of title(0 for no limit)
5th value: is output(true for output, false for return string)
6th value: is include bot views(true for include, false for uninclude)
get_timespan_most_viewed(”, 10, 7, true, true, 0)
The most views posts of posted in recent several days. return the string of list start by and end by .
1st value: type of post(’post’ for post, ‘page’ for page, ” for both)
2nd value: the number of post you what to get
3th value: the days for seach
4th value: is output(true for output, false for return string)
5th value: is include bot views(true for include, false for uninclude)
6th value: the words of title(0 for no limit)
get_timespan_most_viewed_cat(0, ”, 10, 7, true, true, 0)
The most views posts in catrgory of posted in recent several days. return the string of list start by and end by . (After Version 1.1.0)
1st value: the category ID(It can be a single ID or an array of ID)
2nd value: type of post(’post’ for post, ‘page’ for page, ” for both)
3th value: the number of post you what to get
4th value: the days for seach
5th value: is output(true for output, false for return string)
6th value: is include bot views(true for include, false for uninclude)
7th value: the words of title(0 for no limit)
get_totalviews(true,true)
Total views number
1st value: is output(true for output, false for return string)
2nd value: is include bot views(true for include, false for uninclude)
Ở trong kho WP có cái này, bạn thử xem
Post Views
http://wordpress.org/extend/plugins/wp-postviews/
hoặc mạnh hơn
Post Views Plus
http://wordpress.org/extend/plugins/wp-postviews-plus/
Xin chào anh Thịnh. Cho em hỏi thêm, để biết số lượi xem trong mội bài (post) thì mình cài plugin nào hả anh.
Cảm ơn bác quá khen. Có lẽ sắp tới em sẽ không còn viết về WP nữa vì sắp về VN rồi. Có nhiều thứ để lo lắng hơn.
Chúc bác Phamen vững tay chèo.
Lâu lâu không thấy bác Thịnh viết bài, ai dè dưỡng sức để viết ra một bài quá hay thế này.
Bạn mở header.php ra, gõ tiếng Việt vào, save lại, xem bằng browser coi nó hiển thị ở đâu, thế nào. Phải làm trực tiếp chứ không có code nào để tạo text rồi mới gõ vào đó cả. Nếu hiển thị ở sidebar thì có sẵn cái text đó, không thì phải làm thủ công như vậy. Ngoài ra, để trang trí, căn lề, font chữ này nọ thì bạn phải biết html. Cái đó phải tự học rồi hỏi dần dần chứ không ai có thể chỉ được ngay. Ở trường ĐH, đó cũng là một phần của môn học, cũng phải học nửa học kì đấy.
Chào anh Thịnh. em phải chèn code gì để là một cái Text dưới giữa banner ?
Bài viết thật công phu và trình bày rõ ràng. Hiểu biết kỹ về cấu trúc của WordPress. Cám ơn tác giả.
Vậy thì bạn phải sửa header.php thôi. Muốn cái gì xuất hiện ở phía dưới menu thì phải chèn code của nó ở dưới code của menu. Bạn nên chèn thử một vài chỗ để xem nó xuất hiện ở đâu, rồi cứ từ từ chỉnh dần.
Em thấy trang vnitweb.com có cấu trúc như em nói. chèn 1 text vào dưói và giữa banner, đoạn text này dùng chèn hình, chèn goolge search và quảng cáo. Trong khi qui định của theme Redie 3.0 là không có text chèn chỗ này, chỉ chèn hai bên. Em hỏi chủ nhân nhiều lần nhưng họ không chỉ, bí quá hỏi anh Thịnh vậy,
Tôi không biết website của bạn như thế nào nên chịu. Nếu cấu trúc giống như bài viết thì sửa header.php. Bạn cứ viết vào đó rồi xem nó hiện ở đâu, từ đó cứ chỉnh dần. Nếu không biết đọc code thì phải làm mò như thế vậy.
Em muốn bổ xung cái 1 Text chỉ nằm dưới và ở giữa banner được không anh. Phải thêm câu lệnh gì khác.
Trong widget có cái gọi là TEXT. Bạn gắp nó lên sidebar, ấn vào góc phải trên cùng của cái TEXT đó thì có thể vào đó viết các thứ, thậm chí có thể viết html.
Thưa anh, để chèn thêm một khung text cho slidebar theo ý mình, khung này nằm giữa và dưới Header thì mình chỉnh sửa thêm cho slidebar bằng cách nào. Thanks. Em đang dùng theme Redie 3.0
OK. G9
Nếu muốn vậy, bạn thử plugin này xem: Custom Smilies của Đỗ Quang Anh. Đọc trong phần hướng dẫn để biết chi tiết.
Tự mò nhé, khi nào tự tìm ra thì sẽ thấy vui hơn. Tớ đi ngủ đây. Good night!
Còn cho xuất hiện thêm các biểu tượng smile nằm ở trên khung soạn thảo này để chèn vào phần trả lời thì minh làm như thế nào hả anh.
tuyệt vời ! đã làm được. Thanks
Bạn sửa file comments.php xem.
Chào anh thịnh. Anh cho em hỏi, làm sao việt hóa cái plugin – Viết trả lời Tên (cần có) E-mail (không hiện ra) (cần có) Website (nếu có) Gửi trả lời của anh.
Cảm ơn bạn.
Bài đang sửa vì có một số chỗ chưa chính xác.
Cực hay, em hâm mộ anh quá.