Hướng dẫn về Hệ thống phân cấp mẫu WordPress (Phiên bản 2022)

Nếu bạn muốn tùy chỉnh chủ đề hoặc xây dựng chủ đề mới từ đầu, điều quan trọng là phải hiểu cách hoạt động của hệ thống phân cấp mẫu WordPress.

Đầu tiên và quan trọng nhất, hệ thống WordPress này giúp giữ mọi thứ có tổ chức. Khi bạn biết tất cả các tệp mẫu chủ đề là gì, chúng làm gì và chúng được ưu tiên như thế nào, bạn sẽ có thể thay đổi hầu hết mọi khía cạnh của giao diện trang web WordPress của mình.

Trong bài viết này, chúng tôi sẽ giải thích phân cấp mẫu WordPress là gì và nó hoạt động như thế nào. Sau đó, chúng tôi sẽ cung cấp bảng phân tích đầy đủ về các tệp mẫu liên quan đến từng loại trang WordPress (bao gồm cả bảng gian lận để tham khảo), để giúp bạn sử dụng chúng có lợi cho mình.

Chúng ta hãy đi đến đó!

Thích xem phiên bản video?

Giới thiệu về Hệ thống phân cấp mẫu WordPress

Thông thường, các trang web không động sử dụng các tệp HTML và CSS tĩnh để hiển thị nội dung của chúng. Tuy nhiên, WordPress là một nền tảng động dựa trên ngôn ngữ lập trình PHP. Mỗi trang web WordPress tải nhiều tệp .php , mỗi tệp sẽ điều chỉnh giao diện của một phần hoặc thành phần cụ thể.

Bất cứ khi nào bạn tải một loại trang nhất định, Hệ thống Quản lý Nội dung (CMS) sẽ tìm kiếm các tệp mẫu tương ứng với nó.

Ví dụ: nếu bạn sử dụng tính năng tìm kiếm của WordPress và tải trang kết quả tìm kiếm, CMS sẽ tìm kiếm hai tệp mẫu:

1. s earch.php , điều chỉnh giao diện các trang kết quả tìm kiếm của bạn
2. index.php , là tệp mẫu mặc định mà WordPress sử dụng khi nó không thể tìm thấy tùy chọn hàng đầu trong mỗi hệ thống phân cấp

Các tệp mẫu mà bạn có quyền truy cập sẽ phụ thuộc vào chủ đề bạn sử dụng. Tất cả các chủ đề WordPress là một tập hợp các mẫu, bảng định kiểu và các yếu tố khác, chẳng hạn như hình ảnh. Vì vậy, trong ví dụ trên, nếu chủ đề bạn sử dụng bao gồm mẫu search.php , WordPress sẽ tìm và tải nó.

Trong một số trường hợp, bạn có thể sử dụng chủ đề không bao gồm tệp mẫu cho các loại trang bạn muốn tải. Đó là nơi xuất hiện hệ thống phân cấp mẫu WordPress. Đó là một hệ thống tích hợp sẵn cho WordPress biết những tệp mẫu nào cần tải và theo thứ tự nào.

Đối với một trang tìm kiếm, nếu WordPress không thể tìm thấy tệp search.php , nó sẽ chuyển xuống tệp tiếp theo trong hệ thống phân cấp, đó là index.php . Đây tệp là dự phòng cuối cùng cho mọi nhánh trong hệ thống phân cấp mẫu.

Về lý thuyết, bạn có thể có một chủ đề đầy đủ chức năng chỉ bao gồm một tệp mẫu và đó là index.php .

Tuy nhiên, trên thực tế, một chủ đề với một tệp mẫu đơn lẻ sẽ hầu như không bao gồm bất kỳ tùy chỉnh phong cách nào và mọi loại trang sẽ trông khá giống nhau. Trừ khi đó là những gì bạn đang làm, việc hiểu hệ thống phân cấp mẫu WordPress là một trong những bước quan trọng nhất mà bạn có thể thực hiện với tư cách là một nhà phát triển chủ đề.

Cách hoạt động của hệ thống phân cấp mẫu WordPress

Như bạn có thể biết, WordPress cho phép bạn sử dụng nhiều loại trang tùy thuộc vào những gì bạn muốn xuất bản. Có bảy danh mục chính bạn có thể sử dụng:

1. Trang đầu
2. Bài đăng đơn
3. Các trang đơn
4. Các loại bài đăng tùy chỉnh
5. Trang kết quả tìm kiếm
6. Các trang danh mục và thẻ
7. 404 trang lỗi

Mỗi trang đó có hệ thống phân cấp tùy chỉnh riêng, có nghĩa là nó sử dụng một tập hợp các tệp mẫu cụ thể.

Nếu bạn xem nhanh bất kỳ thư mục nào trong chủ đề của mình, bạn thường sẽ tìm thấy một bộ sưu tập các tệp mẫu. Sau đây là một ví dụ về các tệp mẫu được liệt kê trong thư mục chủ đề cho một bài đăng trên blog:

Đây là loại trang bài đăng đơn, có nghĩa là nó sử dụng tệp single.php làm mẫu cho nội dung chính trên trang (chính bài đăng trên blog).

Ngoài ra, nó có một tệp mẫu riêng cho từng phần tử trang, hầu hết trong số đó bạn sẽ có thể xác định được trong nháy mắt, bao gồm:

• Tiêu đề
• Chân trang
• Bình luận
• Thanh bên

Điều quan trọng là phải hiểu rằng, mặc dù mỗi loại trang có hệ thống phân cấp riêng, chúng cũng thường chia sẻ các tệp mẫu chung, chẳng hạn như header.php và footer.php .

Nếu bạn đang xây dựng chủ đề của riêng mình, điều đó có nghĩa là bạn có thể tạo các kiểu tùy chỉnh cho từng loại trang, đồng thời tạo các tệp mẫu để sử dụng lại.

Bạn cũng có thể tạo tệp mẫu tùy chỉnh cho các phần tử như thanh bên và chân trang chỉ áp dụng cho một số loại trang nhất định. Tính linh hoạt đó là nhờ vào cách tiếp cận theo mô-đun của WordPress đối với các mẫu.

Khi bạn chuyển đổi chủ đề, sự khác biệt về bố cục mà bạn thấy được quy cho các tệp mẫu mới mà WordPress tải. Các chủ đề con cũng đóng vai trò trong hệ thống phân cấp chủ đề WordPress mà chúng ta sẽ thảo luận ngay sau đây.

Định vị và thay đổi tệp mẫu WordPress ở đâu

Tệp .php có thể bao gồm cả mã PHP và đánh dấu HTML (tất cả đều mà bạn có thể chỉnh sửa). Do đó, các tệp mẫu WordPress có thể phức tạp như bạn cần. Trong nhiều trường hợp, các tệp mẫu mà WordPress sử dụng là một tập hợp các chức năng cho các phần tử mà chúng chi phối.

Để cung cấp cho bạn một ví dụ, đây là một cái nhìn nhanh về tệp mẫu header.php mà chủ đề WordPress Twenty Twenty-One chính thức sử dụng:

Như chúng tôi đã đề cập, mọi chủ đề WordPress đều bao gồm tập hợp các tệp mẫu của riêng nó. Bạn có thể xem các tệp mẫu mà chủ đề của mình bao gồm bằng cách truy cập vào thư mục của nó trong thư mục gốc của trang web của bạn thông qua ứng dụng Giao thức Truyền tệp (FTP).

Đây là giao diện của chủ đề WordPress chính thức trước đó, Twenty Twenty:

Theo mặc định, WordPress sẽ tải các tệp mẫu nằm trong thư mục chính của chủ đề của bạn ( wp_content> chủ đề ) hoặc trong thư mục phần mẫu .

Nếu bạn định tạo nhiều tệp mẫu, chúng tôi khuyên bạn nên giữ các mẫu trang chính của mình trong thư mục chính. Đối với các tệp mẫu cụ thể hơn, chẳng hạn như bố cục trang có chiều rộng đầy đủ hoặc thanh bên, bạn có thể sử dụng thư mục con.

Cách tốt nhất để nắm được hệ thống phân cấp mẫu WordPress đầy đủ là thông qua bảng gian lận. Trong trường hợp này, chúng tôi sẽ cho bạn thấy tổng quan trực quan về hệ thống phân cấp mẫu, nhờ sự hỗ trợ của WordPress Codex:

Codex WordPress bao gồm rất nhiều thông tin về hệ thống phân cấp mẫu, vì vậy chúng tôi khuyên bạn nên đánh dấu trang tài nguyên đó. Bây giờ, chúng ta hãy tìm hiểu từng loại trang và các tệp mẫu mà nó sử dụng.

Phân tích cấu trúc phân cấp mẫu WordPress theo loại trang

WordPress sử dụng bảy loại trang chính. Trong phần này, chúng tôi sẽ nói về từng loại và cung cấp cho bạn bảng phân tích về các tệp mẫu mà chúng sử dụng. Hãy bắt đầu với trang đầu.

Tệp Mẫu Trang Trước

Trang chủ WordPress của bạn là điểm dừng đầu tiên mà hầu hết người dùng thực hiện khi họ truy cập trang web của bạn. Trong thực tế, bố cục trang nhất có thể thay đổi đáng kể giữa các trang web.

Tuy nhiên, đối với một trang đầu cơ bản, WordPress sẽ tìm kiếm ba tệp mẫu này theo thứ tự:

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

Nếu chủ đề của bạn không bao gồm tệp mẫu front-page.php , thì WordPress sẽ mặc định là tùy chọn thứ hai, v.v. Như mọi khi, tệp index.php là điểm dừng cuối cùng mà WordPress thực hiện trong cây quyết định mẫu.

Bài đăng đơn lẻ

Các bài viết WordPress riêng lẻ sử dụng hệ thống phân cấp mẫu bài đăng duy nhất. Đối với nội dung chính của mỗi bài đăng trên blog, WordPress sẽ tìm kiếm các tệp sau:

1. single.php
2. singular.php
3. index.php

Tuy nhiên, nếu bạn nhìn vào bảng gian lận mẫu, bạn sẽ nhận thấy một hệ thống phân cấp phức tạp hơn xuất hiện trong một số trường hợp.

Đó là bởi vì WordPress cho phép bạn chỉ định các tệp mẫu cho các bài đăng riêng lẻ và các danh mục đơn lẻ, sau đó mặc định là single.php nếu nó không thể tìm thấy một trong các tùy chọn đó.

Ngoài các tệp mẫu chính, bạn có các phần tử như phần đầu trang, chân trang, thanh bên và phần nhận xét. Như chúng tôi đã đề cập trước đây, mỗi phần tử đó có thể có tệp mẫu riêng của nó.

Các trang đơn

Sau các bài đăng, các trang đơn là bánh mì và bơ cho hầu hết các trang web WordPress. Trong hầu hết các trường hợp, họ sử dụng một mẫu khác với trang đầu của bạn, trừ khi cả hai loại trang đều mặc định là index.php .

Đây là cách phân cấp mẫu trang đơn trông như thế nào:

1. page.php
2. singular.php
3. index.php

Mặc dù hệ thống phân cấp mẫu cho các bài đăng và trang đơn lẻ là tương tự nhau, nhưng có một số điểm khác biệt chính.

Đầu tiên, khi nói đến các trang, WordPress sử dụng đường dẫn get_page_templates () cho các tệp tùy chỉnh, bạn có thể sử dụng đường dẫn này để thay đổi hoặc chuyển hướng mẫu trang mặc định.

Ngoài ra, bạn có thể tạo mẫu cho các sên và ID cụ thể. Nếu bạn có tệp page– {slug} .php hoặc page- {id} .php , WordPress sẽ cố gắng tải từng tệp theo thứ tự, trước khi đặt mặc định là page.php .

Loại bài đăng tùy chỉnh

Bạn có thể tạo các loại bài đăng tùy chỉnh cho nhiều loại nội dung khác nhau mà bạn có thể không muốn kết hợp với các trang hoặc bài đăng. Các loại bài đăng tùy chỉnh cung cấp cho bạn mức độ tổ chức cao hơn cho nội dung của bạn và chúng cũng có hệ thống phân cấp mẫu riêng:

1. lưu trữ- {post_type} .php
2. archive.php
3. index.php

Hệ thống phân cấp mẫu cho các loại bài đăng tùy chỉnh không phức tạp như cho các trang hoặc bài đăng đầy đủ. Tuy nhiên, WordPress cho phép bạn tạo các tệp mẫu cho từng loại bài đăng tùy chỉnh, vì vậy chúng không phải chia sẻ cùng một bố cục chính xác.

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

Chúng tôi đã giới thiệu cho bạn về hệ thống phân cấp mẫu mà WordPress sử dụng cho các trang kết quả tìm kiếm, vì vậy hãy tóm tắt ngắn gọn nó trông như thế nào:

1. search.php
2. index.php

Khi chúng tôi loại bỏ các loại trang ‘phức tạp’ như bài đăng hoặc trang đầu của bạn, hệ thống phân cấp mẫu WordPress trở nên đơn giản hơn nhiều.

Với một trang tìm kiếm, bạn thường không cần bao gồm quá nhiều yếu tố ngoài bản thân kết quả. Cấu trúc càng đơn giản, hệ thống phân cấp thường ngắn hơn.

Trang danh mục và thẻ

Mặc dù rất nhiều trang web không liên kết trực tiếp đến chúng, nhưng WordPress tạo ra các trang tập thể cho các thẻ và danh mục của bạn. Ngoài ra còn có các trang con cụ thể cho từng mục trong phân loại đó.

Xem xét cách phân loại phức tạp có thể trở nên đối với các trang web có thư viện nội dung lớn, hệ thống phân cấp này bao gồm nhiều ‘bước’ hơn bình thường:

1. danh mục– {slug} .php
2. danh mục- {id} .php
3. category.php
4. archive.php
5. index.php

Lưu ý rằng cùng một hệ thống phân cấp được sử dụng cho các thẻ, ngoại trừ “thẻ” thay thế “danh mục” trong tất cả các trường hợp.

Về lý thuyết, bạn có thể tạo các tệp mẫu riêng lẻ cho từng danh mục hoặc thẻ trên trang web WordPress của mình và xác định chúng thông qua sên hoặc ID. Tuy nhiên, rất ít trang web thực sự trải qua tất cả những rắc rối đó.

Nếu bạn không có kế hoạch cho phép khách truy cập duyệt trang danh mục của mình, hãy đặt mặc định thành mẫu archive.php .

Các trang lỗi 404

Đôi khi, khách truy cập sẽ cố gắng truy cập một trang không tồn tại. Khi điều đó xảy ra, WordPress sẽ trả về trang lỗi 404.

Theo mặc định, WordPress không cung cấp các tùy chọn để tùy chỉnh giao diện của trang này. Tuy nhiên, bạn có thể tự điều chỉnh giao diện của nó thông qua tệp mẫu. Hệ thống phân cấp mẫu khá ngắn gọn:

1. 404.php
2. index.php

Khi trang web của bạn phát triển, các trường hợp người dùng có thể gặp phải lỗi 404 cũng vậy. Có một trang lỗi tùy chỉnh cho những trường hợp đó có thể giúp bạn thông báo cho khách truy cập lý do tại sao trang không tải, hướng họ sang hướng khác và giảm bớt sự thất vọng.

Khi tải tệp mẫu 404, WordPress sẽ tìm kiếm và tải tệp tùy chỉnh của bạn trước khi sử dụng tệp mặc định.

Nơi Chủ đề con phù hợp với Hệ thống phân cấp mẫu WordPress

Nếu bạn thích tùy chỉnh các chủ đề WordPress của mình, một phương pháp hay nhất là sử dụng một chủ đề con. Các chủ đề con cũng có vị trí trong hệ thống phân cấp mẫu WordPress, nhưng nó không rõ ràng nếu bạn nhìn vào bảng gian lận mà chúng tôi đã cung cấp trước đó.

Tóm lại, sử dụng chủ đề con sẽ thêm một lớp thứ hai vào hệ thống phân cấp mẫu cho bất kỳ loại trang nào mà bạn sử dụng.

Giả sử bạn đang sử dụng một chủ đề con bao gồm các tệp mẫu tùy chỉnh cho các trang đơn lẻ. Đây là thứ tự mà WordPress sẽ cố gắng tải tệp:

1. p age.php trong chủ đề con
2. page.php trong chủ đề mẹ
3. singular.php trong chủ đề con
4. singular.php trong chủ đề mẹ
5. index.php trong chủ đề con
6. index.php trong chủ đề mẹ

Nếu WordPress có thể tìm thấy phiên bản của tệp mẫu trong chủ đề con của bạn, thì đó là phiên bản mà nó sẽ tải, ngay cả khi có một bản sao cho nó trong chủ đề mẹ. Trong một số trường hợp, bạn có thể rơi vào tình huống muốn tùy chỉnh các tệp mẫu cho một chủ đề mà bạn sử dụng và việc tận dụng một chủ đề con là hoàn hảo trong những trường hợp đó.

Giống như các loại tùy chỉnh khác, bạn sẽ mất các thay đổi đối với tệp mẫu của chủ đề khi cập nhật nó. Thêm những thay đổi đó thông qua một chủ đề con sẽ giúp bạn thoát khỏi tình huống đó.

Sử dụng thẻ mẫu WordPress để phát triển chủ đề

Trong quá trình phát triển WordPress, bạn sẽ thường gặp phải các thẻ mẫu, là các hàm PHP mà bạn có thể sử dụng để tạo và tìm nạp dữ liệu động. Các thẻ mẫu thường là một phần của tệp mẫu, nhưng chúng không thể hoán đổi cho nhau.

WordPress xây dựng hàng tá thẻ mẫu vào mã của nó, bạn có thể sử dụng chúng trong quá trình phát triển chủ đề. Một số ví dụ bao gồm:

• get_header ()
• get_footer ()
• get_sidebar ()
• get_search_form ()
• get_template_part ()

Các thẻ này cho phép bạn thu thập các tệp mẫu từ chủ đề bạn đang sử dụng. Trong thực tế, điều đó có nghĩa là bạn có thể thêm các phần tử cụ thể vào các tệp mẫu chính, chẳng hạn như front-page.php hoặc index.php .

Nếu bạn muốn có danh sách đầy đủ tất cả các thẻ mẫu mà bạn có thể sử dụng trong quá trình phát triển WordPress, hãy xem WordPress Codex.

Tại đó, bạn sẽ tìm thấy hướng dẫn về cách sử dụng từng thẻ mẫu, các thông số riêng lẻ của chúng và các ví dụ về mã đang hoạt động.

Bản tóm tắt

Mặc dù hệ thống phân cấp mẫu WordPress thoạt nhìn có thể phức tạp, nhưng nó tóm gọn lại thành một loạt các cây quyết định đơn giản. Bất cứ khi nào bạn truy cập một trang web WordPress, CMS sẽ xem loại trang bạn đang cố gắng truy cập và sau đó sử dụng hệ thống phân cấp để xác định tệp mẫu nào cần tải.

Ngoài các mẫu chính cho từng loại trang, bạn cũng có thể có các tệp mẫu cho các phần tử riêng lẻ như đầu trang, chân trang và thanh bên.

Cách tiếp cận mô-đun này cung cấp cho bạn toàn quyền kiểm soát mỗi trang trên trang web của bạn trông như thế nào và giúp bạn tiết kiệm thời gian trong quá trình phát triển WordPress.

Bạn có bất kỳ câu hỏi nào về cách hoạt động của hệ thống phân cấp mẫu WordPress không? Chia sẻ chúng trong phần bình luận bên dưới!