✅ WEB ja WordPressi uudised, teemad, pistikprogrammid. Siin jagame näpunäiteid ja parimaid veebisaidi lahendusi.

WordPressi teemaõpetus algajatele – 7. osa: teema seadistamine ja esiletoodud pildid

7

See algajatele mõeldud WordPressi teemaõpetuse õppetund jätkub teema seadistamiseks vajaliku põhikoodi lisamisega. Õpime lisama teematugesid ja selle tulemusena aktiveerub WordPressi esiletõstetud pildifunktsioon. Selles õppetükis parandame ka esilehe pealkirja, rakendades oma esimest filtrit.

Töötame enamasti functions.phpfailis, mille lisasime eelmises õppetükis. Lõpus lisame koodi esiletõstetud piltide väljastamiseks oma mallidesse.

Teema seadistamine

Kõik teemad vajavad seadistamiseks koodi, käsitades WordPressil teatud funktsioonid aktiveerida. See hõlmab menüüde, vidinate, tõlkimise jms aktiveerimist. Seda tehakse tavaliselt teema seadistamise funktsioonis, mis on tavaliselt ühendatud mugava nimega konksu külge after_setup_theme. Mõne konkreetse asja jaoks peame kasutama WordPressi lähtestamiskonksu nimega init.

Vajaliku teema seadistuskoodi kirjutamineafter_setup_theme

Seadistagem selline teema seadistamise funktsioon functions.php, mis on seotud after_setup_theme:

add_action('after_setup_theme', 'wptutorial_setup_theme'); function wptutorial_setup_theme() {   }

Selle funktsiooni sisse lisame WordPressi teemade jaoks hunniku tavalisi ja kasulikke häälestusfunktsioone. Palun asetage kõik järgmised kooditükid oma seadistusfunktsiooni.

Esmalt peame määratlema piltide ja manuste (nt videote) maksimaalse laiuse. See tagab, et kui autorid lisavad postitustesse suuri pilte, jäävad pildid teatud laiuse piiresse. Seadsin selle 840 pikslile (sest tahan ruumi külgribale), kuid saate seda oma maitse järgi reguleerida.

$GLOBALS['content_width'] = 840;

Samuti peaksime WordPressile teatama, et teema on tõlgitav ja kust ta saab tõlkefaile otsida. WordPressi teema tõlkimist käsitlen üksikasjalikult selle teemaõpetuse seeria järgmises etapis .

load_theme_textdomain('wptutorial', get_stylesheet_directory(). '/lang');

Pange tähele, et teemakataloogi hankimiseks kasutatakse uut funktsiooni get_stylesheet_directory(). See on väga sarnane get_stylesheet_directory_uri()viimases etapis nähtule, kuid siin vajame suhtelist teed, mitte URL-i.

Seejärel peame lisama mõned teematoed, mis aktiveerivad WordPressi funktsiooni, mis pole vaikimisi aktiveeritud.

See oli terve hulk add_theme_supportkõnesid! Nagu nimigi viitab, add_theme_supportkäsib WordPress aktiveerida funktsioonid, mis pole vaikimisi aktiveeritud. Näiteks esiletõstetud pildid ("post-pisipildid"), HTML5 siltide tugi ja WordPressi kohandatud logo funktsioon Customizeris (soovi korral kohandage soovitud logo pilti!).

Seal on veel palju lahedaid funktsioone, seega soovitan teil lugeda add_theme_support dokumentatsiooni. Näiteks on üsna uus title-tag, mis käsitleb pealkirja silti. Jätsin selle sellest õpetusest välja, kuna oleme pealkirjasildi juba header.phpkäsitsi lisanud.

Pidage meeles, et kui lisate toe title-tag, peaksite pealkirjamärgend oma päisefailist eemaldama, et vältida pealkirjamärgendite dubleerimist.

Lõpuks lisame mõned add_theme_supportWordPressi uue Gutenbergi jaoks. Lisame toe laiadele jaotistele, aktiveerides plokkide stiilide funktsionaalsuse ja toe tundlikele manustele:

add_theme_support('wp-block-styles'); add_theme_support('align-wide'); add_theme_support('responsive-embeds');

Lõpptulemus

Siin on meie lõplik seadistusfunktsioon functions.php:

Pärast salvestamist peaksite nüüd saama administraatoris postitustele esiletõstetud pilte lisada! functions.phpEnne esiletõstetud piltide lisamist oma mallidele lisame omale veel ühe teemaparanduse ; pea meeles, et wp_titlemeie header.phpvaikimisi ei saa esilehel midagi välja kajata? Teeme selle korda.

Filtri lisaminewp_title

Lisame oma esimese õige filtri muutmise funktsiooni, kasutades add_filter(). Filtril, mille külge ühendame, on sama nimi kui funktsioonil, mida kasutasime WordPressi puhul lehe pealkirja dünaamiliseks toomiseks; wp_title. Me parandame selle, et pealkiri ei oleks esilehel tühi – see on WordPressis vaikimisi. Esilehel olles soovime, et see oleks täidetud WordPressi saidi nimega.

Pidage meeles, et filtrifunktsioonides tagastatakse alati filtreeritud muutuja! Kõik filtrid muudavad muutujat ja kui te midagi ei tagasta, muutub muutuja määratlemata. See võib põhjustada palju probleeme. Filtrite kohta põhjalikuma teabe saamiseks vaadake minu postitust, mis selgitab kõike konksude ja filtrite kohta.

Teadmine, millal pealkirja kohandada

Pealkirja muutujat tahame kohandada ainult siis, kui oleme esilehel. Kõigi teiste lehtede puhul tahame selle rahule jätta (lihtsalt tagastage see sellisena, nagu see on). Aga kuidas me teame, kui oleme esilehel?

Saame ära kasutada WordPressi tingimusmärgendeid, mis on terve hulk kasulikke funktsioone, mis tagastavad tingimuse alusel tõese või väära. Neid kasutatakse kõige sagedamini selleks, et küsida, kas oleme kindlal lehel või mallil. Võime lihtsalt küsida "Kas oleme esilehel?". Kui see meetod tagastab tõene, muudame pealkirja muutujat alles siis.

Väärib märkimist, et esilehel on kaks tingimuslikku silti, nimelt is_home()ja is_front_page().Need erinevad olenevalt teie "Lugemise" seadistusest – kas teie esilehel kuvatakse viimaseid postitusi või on see fikseeritud lehekülg. Kui järgite seda õpetust uhiuue vaikeseadega WordPressi installiga, kasutate is_front_page().

WordPressi saidi nime hankimine

Nüüd teame, millist filtrit kasutada ja kuidas tagada, et muudaksime pealkirja ainult siis, kui oleme õiges kohas. Aga mis peaks pealkiri olema? Tavaliselt on esilehe lehe pealkiri teie WordPressi saidi nimi. Aga kuidas me seda teavet saame?

WordPressi praeguse installi kohta teabe hankimiseks kasutame bloginfo()funktsiooni. Parameetrina palume tagastada saidi nime, mis tehakse, määrates parameetri väärtuseks " name". Ja kuna see on filter ja me peame selle tagastama, mitte seda kordama, kasutame selle sõsarmeetodit get_bloginfo(). Helistamine bloginfo()kajab alati välja.

add_filter('wp_title', 'wptutorial_title_filter'); function wptutorial_title_filter($title) { if (is_front_page()) { return get_bloginfo('name'); } return $title; }

Kui värskendate oma esilehte, peaksite nägema, et teie saidi nimi kuvatakse <title>sildis (ja brauseri vahekaardil)! Meie filter mõjutab ainult esilehte, nii et kõik muud lehed, näiteks üks postitus, peaksid tagastama sama, mis varem; postituse pealkiri.

Esiletõstetud piltide väljastamine mallifailides

Varem lisasime teematugede seadistamisel esiletoodud piltide toe. Kui see on aktiveeritud, saame nüüd need pildid oma mallidesse väljastada. Teeme seda nüüd!

Avage index.phpja leidke neile silmuse sees koht. Otsustasin paigutada selle pealkirja järele, kuid see on teie otsustada, kuhu soovite. Funktsiooni kasutate the_post_thumbnail()pildi väljastamiseks. Soovitatav on esmalt kontrollida, kas postitusel on isegi esiletoodud pilt, mida teeme kasutades has_post_thumbnail().

Kui teie postitusel pole esiletoodud pilti, ei näe te pealkirja järel midagi. Kui aga määrate mõnele oma postitusele esiletõstetud pildi, the_post_thumbnail()väljastaks <img>see valitud pildiga sildi. See funktsioon aktsepteerib mõningaid lisaparameetreid. Näiteks saate määrata, millist pildi suurust soovite kasutada, ja juhtida pildile lisatud atribuute. Nagu tavaliselt, soovitan teil kiiresti dokumentatsiooniga tutvuda ja oma maitse järgi kohandada.

Kasutatud meetodite dokumentatsioon

See veebisait kasutab teie kasutuskogemuse parandamiseks küpsiseid. Eeldame, et olete sellega rahul, kuid saate soovi korral loobuda. Nõustu Loe rohkem