{"id":233415,"date":"2023-02-13T16:51:00","date_gmt":"2023-02-13T13:51:00","guid":{"rendered":"https:\/\/wordpress.mediadoma.com\/?p=233415"},"modified":"2022-11-10T23:34:21","modified_gmt":"2022-11-10T20:34:21","slug":"wordpressi-teemaopetus-algajatele-6-osa-teema-funktsioonid-php","status":"publish","type":"post","link":"https:\/\/wordpress.mediadoma.com\/et\/wordpressi-teemaopetus-algajatele-6-osa-teema-funktsioonid-php\/","title":{"rendered":"WordPressi teema\u00f5petus algajatele \u2013 6. osa: teema funktsioonid.php"},"content":{"rendered":"\n

T\u00e4na \u00f5pime, kus ja kuidas lisada koodi v\u00e4ljaspool meie teema malle. Teeme seda teema functions.php<\/code>faili lisamisega. Teel \u00f5pime ka seda, kuidas stiililehti ja skripte \u00f5igesti lisada.<\/p>\n

Teema funktsioonid.php fail<\/h2>\n

Teema peab kuhugi paigutama koodi, mis ei ole mallide osa. Alati on hulk koodi, mida k\u00f5ik teemad peavad funktsionaalsuse kasutamiseks lisama. N\u00e4iteks WordPressi esilet\u00f5stetud piltide funktsiooni lubamine (kas m\u00e4rkasite, et see puudub?), men\u00fc\u00fcde, vidinate tugi, stiilitabelite ja skriptide lisamine (\u00f5igel viisil) ja palju muud.<\/p>\n

See fail on functions.php<\/code>. WordPress laadib selle faili automaatselt ja alati, kui see on teie teemas olemas. See on alati laaditud nii administraatorisse kui ka kasutajaliidesesse.<\/p>\n

Funktsioonide.php faili lisamine meie teemasse<\/h2>\n

Loome oma juurteema kaustas uue t\u00fchja faili ja paneme sellele nimeks functions.php<\/code>.<\/p>\n

Selles failis alustage kohe PHP-i avam\u00e4rgendiga (<?php<\/code>) ja \u00e4rge lisage l\u00f5pum\u00e4rgendit<\/strong>. Fail on m\u00f5eldud functions.php<\/code>PHP-koodi, mitte HTML-i jaoks. Teie teema v\u00f5ib puruneda (v\u00f5i isegi m\u00f5juda imelikult), kui selles failis on m\u00e4rke v\u00f5i reavahetusi v\u00e4ljaspool PHP-silte. Ilmselgelt saate HTML-i v\u00e4ljastamiseks PHP-m\u00e4rgenditest v\u00e4lja murda, kuid seda tuleb teha funktsioonide v\u00f5i konksude sees. Lubage mul selgitada seda katsega.<\/p>\n

Testime seda faili, et n\u00e4ha, kuidas see t\u00f6\u00f6tab. Kirjutage sisse functions.php<\/code>kaja m\u00f5nele n\u00e4ilikule tekstile:<\/p>\n

<?php\necho 'This is an experiment';<\/code><\/pre>\n
V\u00e4rskendage oma esiosa. Ilmub n\u00e4iv tekst. Kui aga uurite v\u00f5i vaatate HTML-i allikat, n\u00e4ete, et tekst kuvatakse enne <html><\/code>. See muudab t\u00e4iesti kehtetu HTML-i!<\/p>\n
\"WordPressi<\/a><\/p>\n
Minge oma administraatoripaneelile ja kl\u00f5psake nuppu V\u00e4rskenda. See teeb sama asja ka seal (see v\u00f5ib olla administraatoririba taha peidetud, kuid see on seal HTML-is).<\/p>\n
Nagu n\u00e4ete, functions.php<\/code>laadib teie mis tahes kood meie mallides enne midagi muud. Seet\u00f5ttu peavad reeglina k\u00f5ik v\u00e4ljundid (HTML v\u00e4ljaspool PHP-silte v\u00f5i echo<\/code>) olema \u00f5igel ajal k\u00e4ivitatavate funktsioonide sees, mis on tavaliselt seotud toimingute v\u00f5i filtritega.<\/p>\n
Tuletage meelde, kui saime WordPressi teema\u00f5petuse algajatele 3 osas teada ja lisasime konksud.<\/a> Viis, kuidas me konksul koodi k\u00e4ivitame, on konksule funktsiooni kinnitamine nupuga add_action()<\/code>. Testime midagi muud; teeme funktsiooni konksuga konksuga, mille oleme oma mallides juba m\u00e4\u00e4ratlenud; wp_footer<\/code>.<\/p>\n
V\u00e4ljas functions.php<\/code>Eemaldage echo<\/code>lisasime testimise eesm\u00e4rgil ja kirjutage selle asemel:<\/p>\n
<?php\nadd_action('wp_footer', 'wptutorial_print_footer');\nfunction wptutorial_print_footer() {\n    echo 'This sentence will appear in footer!';\n}<\/code><\/pre>\n
Vajutage esiotsas refresh ja vaadake, et string ilmuks t\u00e4pselt teie m\u00e4\u00e4ratud kohas wp_footer<\/code>, vahetult enne sulgemist <\/body><\/code>. Samuti pange t\u00e4hele, et see ei kaja administraatoris midagi. Seda seet\u00f5ttu wp_footer<\/code>, et konks, mida juhitakse ainult esiservas.<\/p>\n
Teeme oma esimesed korralikud toimingud aastal functions.php<\/code>!<\/p>\n
M\u00e4rkus: PHP-s ei ole v\u00f5imalik omada kahte t\u00e4pselt sama nimega funktsiooni. See h\u00f5lmab funktsioonide nimesid WordPressis, teie teemat ja k\u00f5iki aktiveeritud pistikprogramme! J\u00e4rgige parimaid tavasid ja lisage oma funktsioonide ette oma teema, nagu \u00fclaltoodud n\u00e4ites: " wptutorial_<function_name><\/code>". See v\u00e4hendab oluliselt WordPressi surmavat kokkujooksmist identsete funktsioonide nimede t\u00f5ttu.<\/p>\n
M\u00e4rkus 2. Pole vahet, millises j\u00e4rjekorras funktsioone ja konkse omale lisate functions.php<\/code>. Pidage meeles, et konksud jooksevad nagunii teatud kontrollpunktides, mitte nende asukohas functions.php<\/code>. Ainus erand on see, kui kaasate muid faile v\u00f5i l\u00e4htestate oma klasse.<\/p>\n
\u00d5ige viis stiilide ja skriptide lisamiseks vs vale viis<\/h2>\n
M\u00f5ned teist ehk m\u00e4letavad 3 osast<\/a>, kus lisasime wp_head<\/code>konksu oma header.php<\/code>. P\u00e4rast seda, kui me seda tegime, suutis WordPress laadida oma stiilid ja skriptid, sealhulgas administraatoririba. V\u00f5ib-olla arvate, et laaditabelite lisamiseks peame laaditabeli k\u00fclge \u00fchendama funktsiooni wp_head<\/code>ja v\u00e4ljastama selle <link><\/code>… Tavaliselt on teil \u00f5igus!<\/p>\n
Kuid WordPressis on skriptide ja stiilide lisamiseks spetsiaalne viis. Seda peamiselt laadimisj\u00e4rjestuse haldamiseks ja dubleerivate teekide laadimise v\u00e4ltimiseks. N\u00e4iteks v\u00f5ite teema autorina soovida lisada jQuery<\/code>teegist s\u00f5ltuvaid Javascripte. Seej\u00e4rel peate veenduma, et see jQuery<\/code>laaditakse enne faile. Kuid WordPressil ja k\u00f5igil pistikprogrammidel on sama vajadus, et veenduda, et need jQuery<\/code>laaditakse enne nende skripte. Te ei saa teeki mitu korda laadida, jQuery<\/code>kuna see p\u00f5hjustab probleeme. Seega on WordPressil v\u00f5imalus hallata, millises j\u00e4rjekorras<\/strong> skripte ja laaditabeleid laaditakse.<\/p>\n
Stiilitabelite lisamine (\u00f5igel viisil)<\/h2>\n
Mis tahes stiilide ja javascriptide lisamiseks kasutame konksu nimega wp_enqueue_scripts<\/code>. Jah, te kasutate seda konksu ka stiilide jaoks, hoolimata selle nimest. Skriptide ja stiilide lisamist nimetatakse "j\u00e4rjekorraks" \u2013 nagu j\u00e4rjekorda panemine. Paneme oma laaditabeli j\u00e4rjekorda (lisagem), kasutades funktsiooni wp_enqueue_style<\/a> meie functions.php<\/code>:<\/p>\n
<?php\nadd_action('wp_enqueue_scripts', 'wptutorial_enqueue_scripts');\nfunction wptutorial_enqueue_scripts() {\n    wp_enqueue_style('theme-main-style', get_stylesheet_directory_uri().'\/style.css');\n}<\/code><\/pre>\n
Funktsioon wp_enqueue_style<\/code>v\u00f5tab v\u00e4hemalt kaks parameetrit. Esimene on kordumatu nimi (k\u00e4epide v\u00f5i "n\u00e4lkja ID") ja teine \u200b\u200bfaili asukoht. K\u00e4epide peab olema kordumatu, kuna seda identifikaatorit kasutab WordPress duplikaatide tuvastamiseks.<\/p>\n
Teema tagasip\u00f6\u00f6rdumiseks on saadaval palju funktsioone. Eespool kasutasin seda get_stylesheet_directory_uri()<\/code>, mis tagastab teie teemakausta URL-i, ja seej\u00e4rel lisasin \u00fclej\u00e4\u00e4nud tee meie stiililehele.<\/p>\n
PS: WordPress pakub eraldi funktsiooni t\u00e4ieliku URL-i tagastamiseks teie teema style.css<\/code>: get_stylesheet_uri()<\/code>. Kasutasin teist \u00fclaltoodud funktsiooni, kuna sellega on kasulikum tutvuda. Kasutate seda k\u00f5igi muude failide jaoks, mille peate j\u00e4rjekorda panema.<\/p>\n
Funktsioon wp_enqueue_style<\/code>aktsepteerib rohkem kasulikke parameetreid, nagu s\u00f5ltuvused (millised teised css-failid tuleb enne laadida) ja versiooninumber (kasulik vahem\u00e4llu salvestamiseks).<\/p>\n
V\u00e4rskendage oma kasutajaliidest ja veenduge, et teie stiilileht on <head><\/code>m\u00e4rgendisse laaditud!<\/p>\n
Kui olete \u00fcks neist, kes soovib oma teemat kodeerimise ajal ilusamaks muuta, siis siin on teie v\u00f5imalus. Soovitan teil alustada oma HTML-i, klasside ja \u00fcmbriste m\u00e4\u00e4ratlemist ning lisada oma style.css<\/code>. Lisame selle \u00f5petuste seeria k\u00e4igus rohkem sisu, mis vajab stiili.<\/p>\n
Skriptide lisamine (\u00f5ige viis)<\/h2>\n
Vaatame, kuidas me oma teemasse JavaScripti lisame. Seda tehakse sama konksu abil (nii et saate selle k\u00f5ik \u00fche funktsiooni sisse panna). Kuid skriptide jaoks kasutame veidi teistsugust funktsiooni.<\/p>\n
Skripti j\u00e4rjekorda panemiseks kasutage wp_enqueue_script()<\/code>. Parameetrid on samad, mis wp_enqueue_style()<\/code>. Esimene on kordumatu k\u00e4epide ja teine \u200b\u200bon skripti tee. Kolmas (valikuline) on s\u00f5ltuvuste massiiv. Neljanda (valikulise) parameetrina m\u00e4\u00e4rate versiooninumbri. Ja l\u00f5puks viiendaks (valikuline) m\u00e4\u00e4rate, kas skript tuleks laadida <head><\/code>sildis v\u00f5i m\u00e4rgendi l\u00f5pus v\u00f5i mitte <\/body><\/code>.<\/p>\n
WordPressiga on juba kaasas suur hulk teeke. Need pole alati k\u00f5ik laaditud, kuid vajaduse korral saadaval. Kui soovite lisada tavalise teegi skripti, kontrollige esmalt, kas WordPressil on see juba olemas<\/a>. N\u00e4iteks jQuery, k\u00f5ik jQuery kasutajaliidese moodulid, allkriips ja selgroog.<\/p>\n
Kui lisate s\u00f5ltuvusena \u00fche WordPressi kaasatud skriptidest, ei pea te seda skripti j\u00e4rjekorda panema! Teeme seda praktikas.<\/p>\n
Looge meie teemakaustas kaust assets<\/code>ja selle sees alamkaust js<\/code>ning seej\u00e4rel lisage uus t\u00fchi main.js<\/code>fail. Oletame, et see skript n\u00f5uab jQuery<\/code>teeki, seega m\u00e4\u00e4rasime selle s\u00f5ltuvuseks. Teame, et WordPressiga on kaasas jQuery<\/code>paketid ja selle k\u00e4epide on jquery<\/code>. Paneme oma skripti j\u00e4rjekorda j\u00e4rgmiselt:<\/p>\n
<?php\nadd_action('wp_enqueue_scripts', 'wptutorial_enqueue_scripts');\nfunction wptutorial_enqueue_scripts() {\n    wp_enqueue_style('theme-main-style', get_stylesheet_directory_uri().'\/style.css');\n    wp_enqueue_script('theme-main-script', get_stylesheet_directory_uri().'\/assets\/js\/main.js', ['jquery']);\n}<\/code><\/pre>\n
Kui v\u00e4rskendate esiserva ja kontrollite l\u00e4htekoodi, peaksite n\u00e4gema, et teie skript main.js<\/code>on lisatud, aga ka see jQuery<\/code>teek on laaditud. Ja jQuery<\/code>laaditakse enne teie faili!<\/p>\n
\"WordPressi<\/a><\/p>\n
N\u00fc\u00fcd olete \u00f5ppinud stiile ja skripte lisama. Rohkemate failide lisamiseks lisage iga uue faili jaoks wp_enqueue_style()<\/code>v\u00f5i .wp_enqueue_script()<\/code><\/p>\n
Kasutatud meetodite dokumentatsioon<\/h2>\n