Toàn tập về WP hierarchy – cấu trúc giao diện WordPress

Quảng cáo
Ads_ngang
Website dinhthuanit.com có bài Toàn tập về WP hierarchy – cấu trúc giao diện WordPress Nền tảng WordPress tuân thủ một cấu trúc nghiêm ngặt để giữ mọi thứ được sắp xếp đúng vị trí: WP Hierachy. Hiểu cách hoạt động của cấu trúc giao diện WordPress (WordPress templates hierachy) sẽ giúp bạn có nhiều khả năng hơn để tùy biến theme

Nếu bạn mong muốn khai phá sức mạnh của WordPress, bạn sẽ cần biết cơ bản về cấu trúc giao diện WordPress. Khi WordPress render một trang, nó sử dụng template để kiểm tra xem mọi thứ trông có ổn không. Hơn thế nữa, nền tảng này cũng tuân thủ một cấu trúc cẩn mật để giữ mọi thứ được bố trí đúng vị trí: WP Hierachy. Hiểu cách hoạt động của cấu trúc giao diện WordPress (WP hierachy) sẽ giúp bạn có nhiều khả năng hơn để tùy biến theme.

WordPress template hierarchy được phân thành 7 mục chính:

  1. Site front page
  2. Single posts
  3. Single pages
  4. Category và tag pages
  5. Custom post types
  6. Trang kết quả tìm kiếm
  7. Trang lỗi 404

Trong bài hướng dẫn này, chúng tôi sẽ giới thiệu đến với bạn về WordPress templates và cấu trúc hierarchy. Chúng tôi sẽ giải thích vì sao bạn phải nắm vững WP hierarchy, cách theme sử dụng template files để hiển thị các trang của website. Có rất nhiều điều phải bàn tới, nên không chần chừ nữa, hãy bắt đầu thôi!

Giới thiệu về Template Files (Và nó liên quan đến WordPress Themes thế nào)

Khi bạn tạo một website đơn giản, bạn thường chỉ sử dụng HTML và CSS để render trang và thiết lập vẻ ngoài của nó. WordPress, ở một góc độ khác lại mạnh mẽ hơn nhiều. Nền tảng này được xây dựng bởi ngôn ngữ PHP, nó sử dụng nhiều files .php để tạo ra cách hiển thị của 1 trang.

Hãy nhìn về phía bên phải của bài post này. Có một thanh sidebar chứa những bài viết liên quan trong blog của chúng tôi. Khi browser yêu cầu WordPress tải bài viết này, nó sẽ kéo lên một vài ‘template’ files, một trong những chúng là sidebar.php . Files này chứa tin tức để render sidebard như bạn đang thấy, và tính chất nào phải kèm theo:

ví dụ về sidebar

Sidebars đương nhiên chỉ là một phần của toàn trang. Hầu hết các trang WordPress đều cần nhiều template files để hoạt động, bao gồm:

  • index.php
  • header.php
  • sidebar.php
  • footer.php
  • functions.php
  • single.php
  • comments.php

Lưu ý là những file templates không phải là tất cả files template trong WordPress. header.php sidebar.php , và footer.php đặc biệt quan trọng vì những file này được biết tới như là ‘template partials’. Có tức là chúng cũng có thể có thể được nhúng vào trong những templates khác.

Cách WordPress render trang cũng đều có thể phức tạp lúc ban đầu tìm hiểu. Nhưng thực tiễn nó rất hiệu quả. Nếu bạn có 1 template duy nhất cho mỗi trang của website, việc tùy biến sẽ trở thành ác mộng. WordPress “module hóa” bằng cách dùng template để bạn cũng có thể có thể chỉ phải chỉnh 1 files nhưng nhân tố đó lại được áp dụng cho toàn bộ website khi cần.

Khi chọn template nào để dùng cho trang nào, trước mắt WordPress sẽ kiểm tra theme đang sử dụng. Mỗi theme có một bộ templates files riêng và sẽ được mức ưu ái hơn những template khác. Cách bố trí thứ tự ưu tiên này được gọi là ‘template hierarchy’ trong WordPress khi triển khai, hoặc là WP hierarchy. Chúng ta sẽ tìm hiểu vấn đề này ở phần sau.

Giờ bạn đã hiểu cách WordPress render trang, bạn cũng đều có thể đoán được là themes cơ bản chỉ là một tập hợp các template files. Trên thực tế, một theme chỉ cần một file template để hoạt động, và nó là index.php . Tuy nhiên, hầu hết các themes đều rất nhiều templates. Nếu themes thiếu cái gì, WordPress sẽ dùng những files khác theo thứ tự trong cấu trúc giao diện của nó để dùng thay thế.

WP hierarchy (WordPress Template Hierarchy) hoạt động như thế nào

Trong phần trước, chúng tôi có thí dụ về WordPress templates file. Tuy nhiên, đó chỉ là một vài template cũng đều có thể được sử dụng khi page hoặc post được tải lên. WordPress template hierarchy sẽ quyết định template nào được dùng, và theo thứ tự nào.

Nếu bạn load một trang của 1 category giả định mang tên là  hosting,  cách vận hành phía đằng sau nền tảng là:

  1. WordPress sẽ tìm file template gọi là category-hosting.php trong cùng thư mục của theme.
  2. Nếu không có file category-hosting.php , WordPress sẽ tìm theo category ID, ví dụ như category-2.php .
  3. Nếu WordPress không thể tìm được bất kỳ file nào, nó sẽ tìm file category.php .
  4. Nếu nó vẫn chưa tìm thấy file category.php , WordPress sẽ quay lại tìm template file archive.php .
  5. Cuối cùng, nếu tất cả đều không thành công, nó sẽ tải file index.php của theme và dùng nó làm template của trang.

Một số template files luôn có độ ưu tiên cao hơn các template khác, vì vậy đó là lý do vì sao nó được sắp xếp theo dạng cấp bật (hierarchy). Tổng thể, WordPress chia thành 7 loại trang mỗi loại có quy tắc hierarchy cẩn mật riêng. Tiếp theo, hãy tìm hiểu xem các dòng categories đây là gì và hierarchies của chúng hoạt động thế nào.

Phân tích các loại WP hierarchy (7 loại)

Với WordPress, mọi thứ các website cũng đều có thể được chia làm 7 loại trang. Mỗi categories có cấu trúc template hierarchy WordPress được dựng sẵn. Chúng tôi sẽ lý giải mỗi loại một cho bạn.

1. Site Front Page

Đầu tiên, hãy nói đến front page của website bạn. Khi WordPress tải trang chủ lên, đầu tiên nó sẽ xem qua file front-page.php . Nếu file đó không có sẵn, nền tảng này sẽ quay về tìm file home.php . Nếu cả 2 đều không có, WordPress sẽ tìm tới file index.php , file này khi nào cũng tồn tại (nếu không, theme sẽ không hoạt động).

Nói cách khác, đây là thứ tự ưu tiên hiển thị:

  1. front-page.php
  2. home.php
  3. index.php

Kể cả 3 files này giống y như nhau, WordPress vẫn sẽ làm theo cấu trúc logic này. Thứ tự này vô cùng đơn giản. Hãy tiếp tục tìm biết thêm các loại các phức tạp hơn một chút nhé!

2. Single Posts

Bài viết WordPress (như là bài này) nằm ở phía trong loại single posts. Ở phần đầu, chúng tôi có nói đến một số file template dùng để làm render một bài viết. Tuy nhiên, chúng thường là các nhân tố internal. Trước khi WordPress render chúng, WordPress sẽ sử dụng template sau để sử dụng cho trang trước, theo thứ tự sau.

Hierarchy của single posts:

  1. single-{post-type}-{slug}.php
  2. single-{post-type}.php
  3. single.php
  4. singular.php
  5. index.php

Có thể bạn không nhận thấy một số file templates. Chúng tôi sẽ đưa nó vào tỉ dụ dễ hiểu hơn. Đầu tiên là single-{post-type}-{slug}.php , có ví dụ cụ thể là single-product-ca-12.php , (ví dụ về cửa hàng online). Nói cách khác, WordPress sẽ tìm một template file duy nhất cho từng bài viết, bên trong một category nhất định. Nếu WordPress không tìm thấy đúng template, nó sẽ sử dụng single-{post-type}.php và tiếp tục cho đến khi nó file index.php cuối cùng.

Thực tế sử dụng, thì cách này sẽ giúp bạn tùy chỉnh mẫu website cho mỗi bài viết hoặc từng mặt hàng một. Nếu bạn thích tạo mẫu riêng của toàn bộ bài viết, thì nên sử dụng file s ingle.php .

3.  Single Pages

Single pages rơi vào category riêng của nó trong WordPress. Ví dụ, website Hostinger có https://www.hostinger.com là trang chủ. Khi truy cập nó sẽ tải lên template front-page.php . Những phần khác của website, như là https://www.hostinger.com/web-hosting , sẽ rớt vào tình huống single pages.

Một single page sẽ tuân thủ hierarchy sau:

  1. File template riêng
  2. page {slug}.php
  3. page-{id}.php
  4. page.php
  5. singular.php
  6. index.php

Bạn thấy là ưu ái đầu tiên không phải là tên file. Vì WordPress cũng có thể có thể nhiều loại nội dung là single pages. Ví dụ, nếu bạn đang làm việc với bài viết, WordPress sẽ mặc định đưa nó vào cấu trúc ở trên. Singles page (ví dụ /web-hosting), mặc khác có template riêng nên WordPress sẽ ưu ái template này trước, rồi tới page-slug.php . Trong tỉ dụ của chúng ta, file này sẽ là page-web-hosting.php  (nếu nó tồn tại).

Tiếp theo, cấu trúc phân cấp hierarchy sẽ hoạt động tựa như như ở bài viết riêng lẽ. WordPress sẽ tìm ID cho khớp, cho đến lúc đi tới file index.php. 

4. Category và Tag Pages

Template của hierarchy này theo thứ tự sẽ có gọi đến là:

  1. category {slug}.php
  2. category-{id}.php
  3. category.php
  4. archive.php
  5. index.php

Cấu trức thứ bậc này hoạt động giống như single post và page (bài viết riêng lẻ và trang riêng lẻ). WordPress sẽ tìm template khớp với category nó muốn tải, bằng phương pháp tìm dựa theo filename mà có thêm slug vào, sau đó nó sẽ chuyển tới ID. Nếu thất bại, nó sẽ tiếp tục tìm về file category.php , rồi tiếp theo là archive.php. WordPress archive sẽ cho dù là post từ tất cả mọi categories, đó là lý do vì sao archive.php lại nằm ở trong đúng hierarchy này.

Chúng tôi cũng thêm WordPress tags vào mục này, vì cả 2 đều là nhân tố phân loại (taxonomic elements). Thêm nữa, hierachies của chúng ta là y hệt nhau, ngoại trừ việc bản chỉ cần thay category thành tag category-{slug}.php thành tag-{slug}.php . Như vậy hirerchy của tag pages sẽ là:

  1. tag {slug}.php
  2. tag-{id}.php
  3. tag.php
  4. archive.php
  5. index.php

5. Custom Post Types

Nếu vẫn chưa biết về định nghĩa custom post type., hãy đọc bài viết này.  Cơ bản chúng là loại nội dung không rơi và những loại mặc định có sẵn của WordPress. Ví dụ, nếu bạn vận hành một blog thiên về đánh giá sản phẩm, bạn sẽ cần tạo một loại custom post type xem là reviews rồi tùy chỉnh sao cho nó có thêm nhiều tính năng để đánh giá.

WordPress template hierarchy của custom post type như sau:

  1. archive-{post_type}.php
  2. archive.php
  3. index.php

Như bạn thấy, hierarchy không giống những loại khác. Tuy nhiên, bạn vẫn có nhiều lớp để chỉnh sửa trước khi rơi vào index.php , đủ để bạn tạo ra những trang web phức tạp.

6. Trang kết quả kiếm tìm

WordPress hierarchy của loại trang kết quả tìm kiếm (search result pages) này không cầu kỳ như sau:

  1. search.php
  2. index.php

Trong tình huống này, mặc định WordPress sẽ dùng index.php  ngay nếu nó không tìm thấy custom template cho trang kết quả tìm kiếm. Hầu hết các theme hiện đại  sẽ  có một vài tùy chỉnh riêng của trang search.

7. Trang lỗi 404 (404 error pages)

Trang lỗi là một trang không người sử dụng nào muốn thấy. Nhưng nó quan trọng trong một số trường hợp nhất định. WordPress không có file template riêng của trang lỗi 404. Nhưng cũng dễ nếu bạn muốn tạo trang như vậy.

Nếu bạn tạo trang lỗi riêng, WordPress sẽ mở nó ra trước, theo thứ tự WordPress hierarchy sau:

  1. 404.php
  2. index.php

Theo ý kiến của chúng tôi, bạn cũng nên bỏ ít thời gian để cài đặt custom error page nếu bạn có traffic lớn. Bằng cách này, bạn sẽ không làm người truy cập bỏ ngay đi khi lỗi chẳng may xảy ra.

Cách hoạt động thực tiễn của WordPress Template Hierarchy

Ở phần cuối này, chúng tôi sẽ chỉ bạn xem cách hoạt động thực tế của WordPress Template Hierarchy. Chúng tôi sẽ dùng hypothetical website làm ví dụ.

Hãy mường tượng bạn đã tạo một trang chủ, với vài single page, và nhiều bài viết khác nhau. Bạn cũng đang sử dụng thêm có những template file sau:

  • index.php
  • home.php
  • page.php
  • archive.php
  • category.php

Đây là một bộ templates file khá đơn giản. Trong tình huống này, nếu bạn truy cập vào trang chủ, WordPress sẽ tải template home.php lên.

Một số tỉ dụ khác của các trang bạn có thể truy cập, và các template file theo wp hierarchy nó sẽ sử dụng:

  • Một bài viết bất kỳ sẽ tải index.php như là template file của nó, vì không có lựa chọn nào khác trong cấu trúc wp hierarchy.
  • Bất kỳ category nào được load lên cũng sẽ dùng category.php , vì nó có sẵn. Nếu nó không tồn tại thì WordPress sẽ tải archive.php .
  • Trang riêng rẻ (single page) sẽ sử dụng page.php , mặc dù mặc định của trang này là index.php.
  • Vì bạn không có trang lỗi, WordPress sẽ sử dụng index.php làm template của tình huống gặp lỗi.

Có nhiều ví dụ khác, nhưng như vậy chắc đã đủ để bạn hình dung site sẽ hoạt động như thế nào. Template nào WordPress sẽ dùng được quyết định bởi files nào của theme đã được thiết lập. Và theo cấu trúc wp hierarchy, thứ tự cấp bậc sử dụng sẽ làm WordPress hoạt động một cách trật tự. Hy vọng, những tin tức này sẽ hữu ích để bạn cũng có thể có thể làm việc với theme hoặc wp hierarchy trong tương lai.

Lời kết

WP hierarchy có vẻ như có vẻ rất phức tạp. Tuy nhiên, ở bài viết trên, chúng mình đã dễ dàng hóa mọi việc bằng cách cho bạn biết template files nào ưu ái hơn template nào. Chỉ với các thông tin này thôi, bạn đã đủ để biết cần sử dụng file nào để chỉnh sửa hoặc chẳng cần dùng file nào trong WordPress theme của bạn.

Bạn có thắc mắc gì về cấu trúc WordPress template hierarchy không? Hay nó không hoạt động giống như vậy phía trên website của bạn? Hãy cứ hỏi chúng tôi ở bình luận bên dưới nhé!

Từ khóa bài viết: dinhthuanit.com,

Bài viết Toàn tập về WP hierarchy – cấu trúc giao diện WordPress được tổng hợp và biên tập bởi: dinhthuanit.com. Mọi ý kiến đóng góp và phản hồi vui lòng gửi Liên Hệ cho dinhthuanit.com để điều chỉnh. dinhthuanit.com xin cảm ơn.

Bài Viết Liên Quan


Bài Viết Khác


Quảng cáo
Ads_ngang