Pakikipag-ugnay Sa Customizer ng WordPress Tema

  1. 1. Panimula Sa Ang WordPress Tema Customizer
  2. 2. Kasalukuyang nagbabasa: Pakikipag-ugnay Sa Customizer ng WordPress Tema
  3. 3. WordPress Tema Customizer Boilerplate
  4. 4. Pagpapalawak ng WordPress Theme Customizer Boilerplate
  5. 5. Tema Customizer Boilerplate – Mga Pagpipilian sa Kondisyon, Mga Tema ng Bata at Plugin

Sa bahagi 1 ng serye ng WordPress Theme Customizer na nabanggit ko na upang makipag-ugnay sa Tema Customizer kailangan mong i-load $ wp_customize bagay, na kung saan ay isang halimbawa ng WP_Customize_Manager klase. Upang gawin iyon, dapat mong gamitin ipasadya_register pagkilos hook:


add_action ('custom_register', 'my_theme_customize_register');
gumana ang aking_theme_customize_register ($ wp_customize) {

// Nakikipag-ugnay sa $ wp_customize ang bagay

}

Maaari mong ilagay ang code na ito sa mga function.php ng ​​iyong tema o isang file na kasama dito.

Pagdaragdag o pag-alis ng mga elemento ng Tema Customizer (mga seksyon, setting at kontrol)

Kapag nag-load ka $ wp_customize bagay na maaari mong gamitin ang alinman sa mga pamamaraan nito upang magdagdag, kumuha o mag-alis ng mga setting, mga kontrol at mga seksyon sa loob nito (add_setting, get_setting, alisin_setting, add_control … makuha mo ang punto).

Kaya, kung nais mo kumuha o alisin isang seksyon, kontrol o setting, ang kailangan mo lang ay ang ID nito. Tatanggalin ng linya na ito ang seksyon ng Mga Kulay (ilagay ito sa loob ng my_theme_customize_register function mula sa unang code snippet):

$ wp_customize-> alisin_section ('kulay');

Pagdaragdag ng isang seksyon, ang kontrol o setting ay bahagyang naiiba dahil nangangailangan ito ng ilang higit pang mga parameter. Hindi ko na madadaan ang lahat ng mga ito dito sa dalawang kadahilanan:

  1. Hindi talaga kung ano ang layunin ng seryeng ito, gagawa kami ng isang Boilerplate ng Tema Customizer na maaari mo lamang ihulog sa iyong tema sa halip
  2. Nasakop na ni Alex Mansfield ito sa kanyang 6000 salitang monster ng isang Tutorial ng Tema ng Tema na dapat basahin ng bawat developer ng tema ng WordPress at pagkatapos ay mag-tweet tungkol sa (sineseryoso, kung wala ka, basahin mo na ito).

Ngunit, tingnan natin kung paano mo maaaring idagdag ang iyong sariling setting na may kontrol sa isang bagong seksyon ng Tema Customizer, pati na rin ang ilan sa mga argumento. Dahil mas madali itong magtrabaho kasama ang mga totoong halimbawa, narito ang susunod namin:

  • Ang isang bagong seksyon, may label na “Layout”
  • Isang bagong setting na nag-iimbak ng layout ng iyong tema
  • Ang isang bagong kontrol sa radyo na may dalawang pagpipilian – sidebar sa kaliwa at sidebar sa kanan

Ang unang bagay na maidaragdag sa Tema Customizer ay seksyon ng “Layout”:

$ wp_customize-> add_section (
// ID
'layout_section',
// array ng argumento
laruan
'title' => __ ('Layout', 'my_theme'),
'kakayahan' => 'edit_theme_opsyon',
'description' => __ ('Pinapayagan kang i-edit ang layout ng iyong tema.', 'my_theme')
)
);

Huwag subukang makita ito sa customizer pa, ang isang seksyon ay hindi ipapakita maliban kung mayroon itong setting at idinagdag ang isang control. Kaya’t idagdag ang dalawa:

$ wp_customize-> add_setting (
// ID
'my_theme_settings [layout_setting]',
// array ng argumento
laruan
'default' => 'kanan-sidebar',
'type' => 'pagpipilian'
)
);
$ wp_customize-> add_control (
// ID
'layout_control',
// array ng argumento
laruan
'type' => 'radio',
'label' => __ ('layout ng Tema', 'my_theme'),
'section' => 'layout_section',
'options' => array (
'left-sidebar' => __ ('Kaliwa ng sidebar', 'my_theme'),
'right-sidebar' => __ ('Kanan sidebar', 'my_theme')
),
// Ang huling ito ay dapat tumugma sa setting ng ID mula sa itaas
'setting' => 'my_theme_settings [layout_setting]'
)
);

Ipinapalagay na basahin mo ang tutorial ni Alex at / o mga pahina ng Codex ay may isang parameter lamang sa mga add_setting na mga argumento na nasa hanay – ‘type’ – na nais kong ituon. Mayroon kang dalawang posibilidad dito, ‘pagpipilian’ at ‘theme_mod’ at maaari mong makuha ang mga ito sa pamamagitan ng paggamit get_option at get_theme_mod, ayon sa pagkakabanggit. Palagi akong gumagamit ng ‘opsyon’ nang simple dahil pinapayagan kang mag-serialize ang iyong mga halaga ng mga setting ng tema sa pamamagitan ng pagbibigay sa kanila ng mga ID my_theme_settings [setting_1], my_theme_settings [setting_2] atbp Sa ganoong paraan ang lahat ng mga halaga ay maiimbak bilang isang entry sa database sa iyong mesa wp_options.

At sa wakas, pagkatapos mong idagdag ang mga dalawang mga snippet ng code upang gumana ka nakasabit ipasadya_register pagkilos hook (unang snippet ng code sa post na ito), na-customize ang Tema Customizer:

Ang bagong seksyon na idinagdag sa Tema Customizer

Ang bagong seksyon na idinagdag sa Tema Customizer

Paggamit ng mga halaga ng setting ng Mga Customizer ng Tema sa iyong tema

Matapos mong bigyan ang iyong mga gumagamit ng kakayahang mag-imbak ng setting na ito, maaari mong makuha ang halaga nito, mai-hook body_class i-filter ang hook at idagdag ito sa hanay ng mga umiiral na mga klase ng katawan:

add_filter ('body_class', 'my_theme_body_classes');
i-function ang my_theme_body_classes ($ klase) {

/ *
* Dahil ginamit namin ang 'pagpipilian' sa add_setting argumento array
* Kinukuha namin ang halaga sa pamamagitan ng paggamit ng get_option function
* /
$ my_theme_settings = get_option ('my_theme_settings');

$ klase [] = $ my_theme_settings ['layout_setting'];

bumalik $ klase;

}

Ito ay magdagdag ng alinman sa .left-sidebar o. Tama-sidebar sa hanay ng mga klase ng katawan sa iyong tema. Sa pamamagitan ng paggamit ng dalawang klase na ito sa file.css ng iyong tema ay makakalikha ka ng dalawang magkakaibang layout. Halimbawa:

/ * Sidebar sa kanan ay default na layout * /
#content {
lumutang pakaliwa;
lapad: 60%;
}
#sidebar {
lumutang: tama;
lapad: 30%;
}

/ * Paggamit ng .left-sidebar klase upang ma-override ang default na layout * /
.kaliwang-sidebar #content {
lumutang: tama;
}
.kaliwang sidebar #sidebar {
lumutang pakaliwa;
}

Pinakamaganda sa lahat, salamat sa WordPress Theme Customizer, maaaring i-preview ng mga gumagamit ang parehong mga layout bago i-save ang anuman. Dalhin iyon, mga pahina ng mga setting ng tema!

Buod at Karagdagang Pagbasa

TL; DR bersyon ng post na ito ay pupunta tulad ng: Maaari kang makakuha ng $ wp_customize object at pagkatapos ay magdagdag ng isang bagay (seksyon, setting o control) upang o alisin ito. Lahat ng iba pa ay bumababa sa mga setting ng mga setting.

Ang Bahagi Tatlong ay kung saan ang seryeng ito ay nakakakuha ng kawili-wili habang sisimulan namin ang pag-automate ng buong proseso at nagtatrabaho sa Tema Customizer Boilerplate na maaari mong ihulog sa iyong tema at simulan ang paggamit kaagad. Manatiling nakatutok!

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