Banner 1
Banner 2
hero

Phạm Văn Tú

4518 thành viên

  1. Trang chủ /
  2. Wordpress /
  3. Cùng mình tìm hiểu cấu trúc thư mục theme trong wordpress nhé

Cùng mình tìm hiểu cấu trúc thư mục theme trong wordpress nhé

01/20/2023
Wordpress

Hello anh em lâu ngày quá. Hôm nay là 29 tết rồi, vừa dọn nhà xong tiện thể khai bút sê ri wordpress cho rộn ràng xíu hehe 😂

Mình mặc định là ae đã biết cài đặt wordpress à nếu chưa thì lên đây để tải về rồi tạo database rồi vô file config.php connect là được nghen

Theme wp thì sẽ nằm trong wp-content/themes. Mặc định là sẽ có 3 thư mục tương ứng với 3 theme của wp tạo sẵn cho mình. Việc của mình là tạo theme của mình trong này hoặc ae nào có sẵn thì có thể vào admin up giao diện lên cũng được nha rồi vô giao diện chọn theme của mình nhé. Để lập trình theme wordpress thì đầu tiên ae phải nắm được cấu trúc thư mục theme trong wordpress là gì nhé

Ngoài 2 file tất yếu phải có để chạy được theme wordpress là style.css để khai báo thông tin của theme chúng ta như tên theme, tác giả, version php… như bên dưới và file index.php đại diện cho trang chủ của mình thì có những file với những mục đích như sau

– File style.css

/*
Theme Name: Blog của Phạm Văn Tú
Text Domain: phamvantu.com
Version: 1.0
Requires at least: 4.7
Requires PHP: 5.2.4
Description: Theme wordpress by Tú Phạm
Author: Phạm Văn Tú
Author URI: https://v0.phamvantu.com
Theme URI: https://v0.phamvantu.com
*/

screenshot.png: Ảnh đại diện của theme functions.php: Dùng để viết các function dùng chung cho theme, đường nhiên là những file trong theme sẽ dùng được nha index.php: Hiển thị thông tin của trang chuyên mục category.php: Hiển thị thông tin của trang chuyên mục single.php: Hiển thị thông tin của trang chi tiết bài viết page.php: Hiển thị nội dung thông tin của trang tag.php: Hiển thị thông tin của trang chứa thẻ tag 404.php: Hiển thị nội dung của trang không tồn tại search.php: Hiển thị nội dung của trang kết quả tìm kiếm header.php: Chứa header của website dùng chung get_header() footer.php: Chứa footer của website dùng chung get_footer() sidebar.php: Chứa sidebar của website dùng chung get_sidebar()

Đôi lúc mình muốn tách những block riêng để dùng chung tùy nơi mong muốn thì sao

Thường mình sẽ tạo 1 folder template-part thì tạo file trong này rồi có thể gọi ra chỗ mình cần bằng cách get_template_part('ten-thu-muc/ten-file') Ví dụ trang mình có blog bên Huynh đệ bên sidebar thì thay vì mình copy sang trang chuyên mục, chi tiết bài viết thì mình có tạo 1 file box-huynh-de.php trong folder template-part để mình cần dùng thì block thì get_template_part('template-part /box-huynh-de') là okie rồi

Ngoài những file php dùng cho các trang thì mình cần nhưng file style, image, js cho trang mình nữa thì mình hay tạo 1 thư mục public ví dụ như dưới

public

— css: chứa những file style của mình

— images: chứa những file hình ảnh

— js: chứa những file js

— libs: chứa những thư viện mình down về như font, slider, animation…

Những phần nói trên là những file cơ bản cần dùng cho 1 trang nhưng chưa đủ 🤦‍♂️ . Ae xem 1 chút phần dưới để custom những page mình cần nha

Ví dụ trang web mình có 2 trang liên hệ với giới thiệu nhưng 2 trang lại có 2 giao diện khác nhau thì sao hè vì mình chỉ có 1 file là page.php để hiển thị trang chớ mấy nên nó đang nhận file page.php là trang chính thì cách giải quyết là mình sẽ tạo với tên file là page-ten-slug.php

Ví dụ với trang liên hệ thì sẽ có file tương ứng page-lien-he.php và trang giới thiệu page-gioi-thieu.php

Nhưng ví dụ trang mình có 5 trang giao diện như liên hệ 5 trang giao diện như giới thiệu chẳng lẽ mình tạo 1 page rồi copy qua hà =)). Rứa thì hơi cồng kềnh nên mình sẽ tạo ra 1 template page rồi vào admin mình sẽ chọn trang đó thuộc template nào thôi. Mình sẽ tạo 1 folder là template-page trong này mình sẽ tạo ra những file giao diện mình mong muốn và khai báo tên template cho nó Template Name: Template1

Tương tự chọn giao diện cho page thì post hoặc post type nào đó mình có thể chọn giao diện tương ứng bằng cách thêm 1 dòng dưới nữa Template Post Type: name_post_type

<?php
/*
Template Name: Giao diện 1
Template Post Type: post, page, product
*/
hero