Samskipti við WordPress þema sérsniðna

  1. 1. Kynning á WordPress þema sérsniðna
  2. 2. Lestur sem stendur: Samskipti við WordPress þema sérsniðna
  3. 3. Boilerplate fyrir sérsniðið WordPress þema
  4. 4. Útvíkkun ketilsplata WordPress þema
  5. 5. Þema sérsniðið ketilplata – Skilyrt valkostur, þemu barna og viðbætur

Í hluta 1 af WordPress Theme Customizer seríunni nefndi ég að til þess að eiga samskipti við Theme Customizer þarftu að hlaða $ wp_customize hlut, sem er dæmi um WP_Customize_Manager bekk. Til að gera það verður þú að nota sérsníða_skráning aðgerðakrókur:


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

// Samskipti við $ wp_customize hlut

}

Þú getur sett þennan kóða í aðgerðir þemans.php eða skjal sem fylgir með því.

Bætir við eða fjarlægir þætti sérsniðinna þátta (hlutar, stillingar og stýringar)

Þegar þú hefur hlaðið $ wp_customize hlut sem þú getur notað hvaða aðferð sem er til að bæta við, fá eða fjarlægja stillingar, stýringar og hluta í því (add_setting, get_setting, remove_setting, add_control … þú færð punktinn).

Svo ef þú vilt eða fjarlægja hluti, stjórnun eða stilling, allt sem þú þarft er auðkenni þess. Þessi lína mun fjarlægja litarhlutann (setja hann inni í aðgerðinni my_theme_customize_register úr fyrsta kóðanum):

$ wp_customize-> remove_section ('litir');

Að bæta hluta, stýringu eða stilling er aðeins öðruvísi vegna þess að það þarfnast fleiri breytur. Ég mun ekki fara í gegnum þau öll hér af tveimur ástæðum:

  1. Það er í raun ekki tilgangurinn með þessari röð, við munum búa til Theme Customizer ketilplötu sem þú getur bara sleppt í þemað í staðinn
  2. Alex Mansfield fjallaði þegar um það í 6000 orða skrímsli sínu um a Tutorial Customizer einkatími að sérhver WordPress þema verktaki verður að lesa og síðan kvak um (alvarlega, ef þú hefur ekki þegar, farðu að lesa það núna).

En samt skulum líta á hvernig þú getur bætt við þínum eigin stillingum með stýringu í nýjum þema sérsniðna hluta auk nokkurra röksemda. Þar sem það er miklu auðveldara að vinna með raunveruleg dæmi, þá er það sem við erum að fara eftir:

  • Nýr hluti, merktur „Skipulag“
  • Ný stilling sem geymir skipulag þemans
  • Ný útvarpsstýring með tveimur valkostum – skenkur til vinstri og skenkur til hægri

Það fyrsta sem þarf að bæta við Theme Customizer er hlutinn „Layout“:

$ wp_customize-> add_section (
// Auðkenni
'layout_section',
// Rökum fylki
fylki (
'title' => __ ('Layout', 'my_theme'),
'capability' => 'edit_theme_options',
'description' => __ ('Gerir þér kleift að breyta skipulagi þemans.', 'my_theme')
)
);

Ekki reyna að sjá það í sérsniðnum ennþá, hluti verður ekki sýndur nema að honum sé stillt og stjórn bætt við hann. Svo skulum við bæta við báðum:

$ wp_customize-> add_setting (
// Auðkenni
'my_theme_settings [layout_setting]',
// Rökum fylki
fylki (
'default' => 'hægri hliðarstikan',
'type' => 'valkostur'
)
);
$ wp_customize-> add_control (
// Auðkenni
'skipulag_stjórnun',
// Rökum fylki
fylki (
'type' => 'útvarp',
'label' => __ ('Þemaskipan', 'my_theme'),
'section' => 'layout_section',
'choice' => fylki (
'left-sidebar' => __ ('Left sidebar', 'my_theme'),
'right-sidebar' => __ ('Right sidebar', 'my_theme')
),
// Þessi síðasti verður að passa stillingarauðkenni að ofan
'settings' => 'my_theme_settings [layout_setting]'
)
);

Miðað við að þú hafir lesið námskeið Alex og / eða Codex þá er aðeins ein breytu í add_setting rifröðum fylkisins – „tegund“ – sem ég vil einbeita mér að. Þú hefur tvo möguleika hér, „valkost“ og „þema_móði“ og þú getur sótt þá með því að nota get_option og get_theme_mod, hver um sig. Ég nota alltaf „valkost“ einfaldlega vegna þess að það gerir þér kleift að raðgreina gildi þemastillinganna með því að gefa þeim auðkenni eins og my_theme_settings [setting_1], my_theme_settings [setting_2] o.fl. Þannig verða öll gildi geymd sem ein gagnagrunnsfærsla í wp_options töflunni þinni.

Og að lokum, eftir að þú bætir við þessum tveimur kóðaútgáfum til að virka sem þú tengdist við sérsníða_skráning aðgerðakrókur (fyrsta kóðinn í þessari færslu), Theme Customizer hefur verið sérsniðinn:

Nýr hluti bætt við Theme Customizer

Nýr hluti bætt við Theme Customizer

Notkun stillingar þema sérsniðna í þema þínu

Eftir að þú hefur gefið notendum þínum möguleika á að geyma þessa stillingu geturðu gripið gildi hennar og tengst við líkamsflokks sía krók og bæta honum við fjölda núverandi flokka:

add_filter ('body_class', 'my_theme_body_classes');
virka my_theme_body_classes ($ flokkar) {

/ *
* Þar sem við notuðum 'valkost' í add_setting rökum fylkisins
* við sækjum gildi með því að nota get_option aðgerð
* /
$ my_theme_settings = get_option ('my_theme_settings');

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

skila $ flokkum;

}

Þetta bætir annað hvort .vinstri hliðarstiku eða .hægri hliðarstiku við fjölda líkamsflokka í þema þínu. Með því að nota þessa tvo flokka í style.css skrá þemans þíns geturðu búið til tvær mismunandi skipulag. Til dæmis:

/ * Skenkur til hægri er sjálfgefið útlit * /
#hald {
fljóta: vinstri;
breidd: 60%;
}
#sidebar {
fljóta: rétt;
breidd: 30%;
}

/ * Notkun .fl.-Hliðarstikuflokks til að hnekkja sjálfgefnu útliti * /
.vinstra megin # innihald {
fljóta: rétt;
}
.vinstri hliðarstikan # hliðarstikan {
fljóta: vinstri;
}

Það besta af öllu, þökk sé WordPress Theme Customizer, geta notendur forsýnt bæði skipulag áður en þeir spara eitthvað. Taktu það, þemastillingar síður!

Yfirlit og frekari lestur

TL; DR útgáfa af þessari færslu myndi ganga eitthvað svona: Þú getur fengið $ wp_customize mótmæla og síðan annað hvort bætt við einhverju (kafla, stilling eða stjórnun) á hann eða fjarlægt úr honum. Allt annað snýst um stillingar breytur.

Þriðji hluti er þar sem þessi sería verður áhugaverð þar sem við munum byrja að gera sjálfvirkan allt ferlið og vinna að Theme Customizer Boilerplate sem þú getur fallið inn í þemað þitt og byrjað að nota strax. Fylgstu með!

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