Interakce s WordPress Theme Customizer

V části 1 série WordPress Theme Customizer jsem zmínil, že pro interakci s Theme Customizer musíte načíst $ wp_customize objektu, což je instance WP_Customize_Manager třída. K tomu musíte použít customize_register akční háček:

add_action ('customize_register', 'my_theme_customize_register');
function my_theme_customize_register ($ wp_customize) {

// Interakce s $ wp_customize objektem

}

Tento kód můžete umístit do funkcí motivu.php nebo do souboru, který je v něm obsažen.

Přidání nebo odebrání prvků Theme Customizer (sekce, nastavení a ovládací prvky)

Po načtení $ wp_customize objekt můžete použít kteroukoli z jeho metod k přidání, získání nebo odebrání nastavení, ovládacích prvků a sekcí v něm (add_setting, get_setting, remove_setting, add_control… dostanete bod).

Pokud tedy chcete dostat nebo odstranit část, ovládání nebo nastavení, vše, co potřebujete, je její ID. Tento řádek odstraní sekci Colors (umístěte ji do funkce my_theme_customize_register z prvního fragmentu kódu):

$ wp_customize-> remove_section ('colours');

Přidání sekce, ovládacího prvku nebo nastavení se mírně liší, protože vyžaduje některé další parametry. Nebudu zde všechny projít ze dvou důvodů:

1. To není opravdu to, k čemu je tato série určena, vytvoříme ohřívač tematických přizpůsobovačů, který můžete místo toho jednoduše vložit do svého motivu
2. Alex Mansfield to již zakryl ve své 6000 slovní monstrum a Výukový program pro přizpůsobení motivu které si musí každý vývojář motivu WordPress přečíst a pak o něm tweetovat (vážně, pokud jste to ještě neudělali, jděte si přečíst nyní).

Podívejme se ale na to, jak můžete přidat vlastní nastavení pomocí ovládacího prvku v nové sekci Personalizátor motivů, a také některé argumenty. Protože je mnohem snazší pracovat se skutečnými příklady, jdeme na následující:

• Nová sekce s názvem „Rozložení“
• Nové nastavení, které ukládá rozvržení motivu
• Nové rádiové ovládání se dvěma možnostmi – postranní panel vlevo a postranní panel vpravo

První věc, kterou lze přidat do Theme Customizer, je sekce „Layout“:

$ wp_customize-> add_section (
// ID
'layout_section',
// Pole argumentů
pole (
'title' => __ ('Layout', 'my_theme'),
'schopnost' => 'edit_theme_options',
'description' => __ ('Umožňuje upravit rozvržení motivu.', 'my_theme')
)
);

Nezkoušejte to vidět v personalizátoru, sekce se nezobrazí, pokud k němu není přidáno nastavení a ovládací prvek. Přidejme tedy obě:

$ wp_customize-> add_setting (
// ID
'my_theme_settings [layout_setting]',
// Pole argumentů
pole (
'default' => 'right-sidebar',
'type' => 'option'
)
);
$ wp_customize-> add_control (
// ID
'layout_control',
// Pole argumentů
pole (
'type' => 'radio',
'label' => __ ('Rozložení motivu', 'my_theme'),
'section' => 'layout_section',
'choices' => array (
'levý postranní panel' => __ ('Levý postranní panel', 'my_theme'),
'pravý postranní panel' => __ ('pravý postranní panel', 'my_theme')
),
// Tento poslední musí odpovídat ID nastavení shora
'settings' => 'my_theme_settings [layout_setting]'
)
);

Předpokládejme, že si přečtete Alexovy stránky tutoriálu nebo Codexu, v poli add_setting argumentů – „type“ – bych se chtěl soustředit jen na jeden parametr. Zde máte dvě možnosti: „option“ a „theme_mod“ a můžete je načíst pomocí get_option a get_theme_mod, resp. Vždy používám „možnost“ jednoduše proto, že vám umožňuje serializovat hodnoty nastavení motivu tak, že jim dávají ID jako my_theme_settings [setting_1], my_theme_settings [setting_2] atd. Tímto způsobem budou všechny hodnoty uloženy jako jeden databázový záznam v tabulce wp_options.

A konečně poté, co jste přidali tyto dva úryvky kódu, abyste fungovali customize_register akční háček (první fragment kódu v tomto příspěvku), přizpůsobitel motivu byl upraven:

Do sekce Custom Customizer byla přidána nová sekce

Používání hodnot nastavení motivu motivu v motivu

Poté, co jste svým uživatelům umožnili uložit toto nastavení, můžete získat jeho hodnotu a připojit se k nim body_class filtrujte háček a přidejte jej do řady existujících tříd těla:

add_filter ('body_class', 'my_theme_body_classes');
function my_theme_body_classes ($ třídy) {

/ *
* Protože jsme v poli argumentů add_setting použili 'option'
* získáme hodnotu pomocí funkce get_option
* /
$ my_theme_settings = get_option ('my_theme_settings');

$ třídy [] = $ my_theme_settings ['layout_setting'];

návrat $ třídy;

}

Tímto způsobem přidáte do pole tříd těla ve svém motivu buď postranní panel .left, nebo pravý postranní panel. Použitím těchto dvou tříd v souboru style.css vašeho motivu budete moci vytvořit dvě různá rozvržení. Například:

/ * Boční panel vpravo je výchozí rozložení * /
#obsah {
plavat vlevo;
šířka: 60%;
}
#sidebar {
float: right;
šířka: 30%;
}

/ * Použití třídy .left-sidebar k přepsání výchozího rozvržení * /
.levý postranní panel #content {
float: right;
}
.levý boční panel #sidebar {
plavat vlevo;
}

Nejlepší ze všeho je, že díky WordPress Theme Customizer mohou uživatelé zobrazit náhled obou rozvržení před uložením čehokoliv. Vezměte si to, stránky nastavení motivů!

Shrnutí a další čtení

TL; DR verze tohoto příspěvku by šla takto: Můžete získat $ wp_customize objekt a pak k němu buď přidat něco (sekce, nastavení nebo ovládání), nebo z něj odebrat. Vše ostatní se scvrkává na parametry nastavení.

Třetí část je zajímavá, protože tato řada začíná být automatizací celého procesu a pracujeme na Boilerplate Theme Customizer Boilerplate, který můžete vložit do svého tématu a začít ihned používat. Zůstaňte naladěni!