Tương tác với tùy biến chủ đề WordPress

  1. 1. Giới thiệu về Trình tùy biến chủ đề WordPress
  2. 2. Hiện đang đọc: Tương tác với tùy biến chủ đề WordPress
  3. 3. WordPress nồi hơi tùy biến chủ đề
  4. 4. Mở rộng Trình tùy chỉnh chủ đề WordPress
  5. 5. Nồi hơi tùy biến chủ đề – Tùy chọn có điều kiện, Chủ đề con và Plugin

Trong phần 1 của loạt Trình tùy chỉnh chủ đề WordPress tôi đã đề cập rằng để tương tác với Trình tùy chỉnh chủ đề, bạn cần tải $ wp_customize đối tượng, là một ví dụ của WP_Customize_Quản lý lớp học. Để làm điều đó, bạn phải sử dụng tùy chỉnh_register móc hành động:


add_action ('custom_register', 'my_theme_customize_register');
chức năng my_theme_customize_register ($ wp_customize) {

// Tương tác với đối tượng $ wp_customize

}

Bạn có thể đặt mã này trong chủ đề của bạn..

Thêm hoặc xóa các yếu tố Tùy biến chủ đề (phần, cài đặt và điều khiển)

Khi bạn đã tải $ wp_customize đối tượng bạn có thể sử dụng bất kỳ phương thức nào của nó để thêm, nhận hoặc xóa cài đặt, điều khiển và các phần trong đó (add_setting, get_setting, remove_setting, add_control, bạn nhận được điểm).

Vì vậy, nếu bạn muốn được hoặc là tẩy một phần, kiểm soát hoặc cài đặt, tất cả những gì bạn cần là ID của nó. Dòng này sẽ xóa phần Màu sắc (đặt nó bên trong hàm my_theme_customize_register khỏi đoạn mã đầu tiên):

$ wp_customize-> remove_section ('màu');

Thêm một phần, điều khiển hoặc cài đặt hơi khác nhau vì nó yêu cầu thêm một số tham số. Tôi sẽ không đi qua tất cả chúng ở đây vì hai lý do:

  1. Rằng không thực sự mục đích của loạt bài này là gì, chúng tôi sẽ tạo ra một bản tóm tắt Theme Customizer mà bạn chỉ có thể thả vào chủ đề của mình
  2. Alex Mansfield đã bao phủ nó trong con quái vật 6000 từ của mình Hướng dẫn tùy biến chủ đề rằng mọi nhà phát triển chủ đề WordPress đều phải đọc và sau đó tweet về (nghiêm túc, nếu bạn đã có sẵn, hãy đọc nó ngay bây giờ).

Tuy nhiên, hãy để Lôi xem cách bạn có thể thêm cài đặt của riêng mình bằng một điều khiển trong phần Tùy biến chủ đề mới, cũng như một số đối số. Vì nó rất dễ làm việc với các ví dụ thực tế, nên ở đây, những gì chúng tôi sẽ làm sau:

  • Một phần mới, được dán nhãn Giao diện Bố cục
  • Cài đặt mới lưu trữ bố cục chủ đề của bạn
  • Một điều khiển radio mới với hai tùy chọn – thanh bên ở bên trái và thanh bên bên phải

Điều đầu tiên để thêm vào Theme Customizer là phần Bố cục của Bố cục:

$ wp_customize-> add_section (
// TÔI
'layout_section',
// Mảng đối số
mảng(
'title' => __ ('Bố cục', 'my_theme'),
'khả năng' => 'edit_theme_options',
'description' => __ ('Cho phép bạn chỉnh sửa bố cục của chủ đề.', 'my_theme')
)
);

Don Patrick cố gắng xem nó trong tùy biến, một phần sẽ không được hiển thị trừ khi nó có cài đặt và điều khiển được thêm vào nó. Vì vậy, hãy để thêm vào cả hai:

$ wp_customize-> add_setting (
// TÔI
'my_theme_sinstall [layout_setting]',
// Mảng đối số
mảng(
'mặc định' => 'thanh bên phải',
'loại' => 'tùy chọn'
)
);
$ wp_customize-> add_control (
// TÔI
'layout_control',
// Mảng đối số
mảng(
'loại' => 'radio',
'nhãn' => __ ('Bố cục chủ đề', 'my_theme'),
'phần' => 'layout_section',
'Lựa chọn' => mảng (
'thanh bên trái' => __ ('Thanh bên trái', 'my_theme'),
'thanh bên phải' => __ ('Thanh bên phải', 'my_theme')
),
// Cái cuối cùng này phải khớp với ID cài đặt từ phía trên
'settings' => 'my_theme_sinstall [layout_setting]'
)
);

Giả sử bạn đọc các trang hướng dẫn và / hoặc Codex của Alex ở đó, chỉ có một tham số trong mảng đối số add_setting – ‘gõ, – mà tôi thích tập trung vào. Bạn có hai khả năng ở đây, ‘tùy chọn và và theme_mod, và bạn có thể truy xuất chúng bằng cách sử dụng get_optionget_theme_mod, tương ứng. Tôi luôn sử dụng ‘tùy chọn Đơn giản vì nó cho phép bạn tuần tự hóa các giá trị cài đặt chủ đề của mình bằng cách cung cấp cho họ ID như my_theme_sinstall [settings_1], my_theme_sinstall [settings_2] v.v … Bằng cách đó, tất cả các giá trị sẽ được lưu trữ dưới dạng một mục cơ sở dữ liệu trong bảng wp_options của bạn.

Và cuối cùng, sau khi bạn thêm hai đoạn mã đó vào chức năng bạn đã nối vào tùy chỉnh_register hook hành động (đoạn mã đầu tiên trong bài đăng này), Theme Customizer đã được tùy chỉnh:

Phần mới được thêm vào Tùy biến chủ đề

Phần mới được thêm vào Tùy biến chủ đề

Sử dụng các giá trị cài đặt Tùy biến chủ đề trong chủ đề của bạn

Sau khi bạn đã cung cấp cho người dùng khả năng lưu trữ cài đặt này, bạn có thể lấy giá trị của nó, móc vào body_group lọc hook và thêm nó vào mảng các lớp cơ thể hiện có:

add_filter ('body_group', 'my_theme_body_groupes');
hàm my_theme_body_groupes ($ class) {

/ *
* Vì chúng tôi đã sử dụng 'tùy chọn' trong mảng đối số add_setting
* chúng tôi lấy giá trị bằng cách sử dụng hàm get_option
* /
$ my_theme_sinstall = get_option ('my_theme_sinstall');

$ class [] = $ my_theme_sinstall ['layout_setting'];

trả về các lớp $;

}

Điều này sẽ thêm .left-sidebar hoặc .right-sidebar vào mảng các lớp cơ thể trong chủ đề của bạn. Bằng cách sử dụng hai lớp này trong tệp chủ đề style style.css của bạn, bạn sẽ có thể tạo hai bố cục khác nhau. Ví dụ:

/ * Thanh bên bên phải là bố cục mặc định * /
#Nội dung {
phao: trái;
chiều rộng: 60%;
}
#sidebar {
phao: phải;
chiều rộng: 30%;
}

/ * Sử dụng lớp .left-sidebar để ghi đè bố cục mặc định * /
.thanh bên trái #content {
phao: phải;
}
.thanh bên trái #sidebar {
phao: trái;
}

Tuyệt vời nhất, nhờ có WordPress Theme Customizer, người dùng có thể xem trước cả hai bố cục trước khi lưu bất cứ thứ gì. Lấy đó, các trang cài đặt chủ đề!

Tóm tắt và đọc thêm

Phiên bản TL; DR của bài đăng này sẽ giống như thế này: Bạn có thể lấy đối tượng $ wp_customize và sau đó thêm một cái gì đó (phần, cài đặt hoặc điều khiển) vào hoặc xóa khỏi nó. Mọi thứ khác sôi sùng sục xuống các thông số cài đặt.

Phần thứ ba là nơi loạt bài này trở nên thú vị khi chúng tôi sẽ bắt đầu tự động hóa toàn bộ quá trình và làm việc với Trình tùy chỉnh chủ đề nồi hơi mà bạn có thể thả vào chủ đề của mình và bắt đầu sử dụng ngay. Giữ nguyên!

Jeffrey Wilson Administrator
Sorry! The Author has not filled his profile.
follow me
    Like this post? Please share to your friends:
    Adblock
    detector
    map