{"id":233602,"date":"2023-02-18T13:17:00","date_gmt":"2023-02-18T10:17:00","guid":{"rendered":"https:\/\/wordpress.mediadoma.com\/?p=233602"},"modified":"2022-11-11T00:35:25","modified_gmt":"2022-11-10T21:35:25","slug":"wordpressi-teemaopetus-algajatele-3-osa-duenaamiline-sisu","status":"publish","type":"post","link":"https:\/\/wordpress.mediadoma.com\/et\/wordpressi-teemaopetus-algajatele-3-osa-duenaamiline-sisu\/","title":{"rendered":"WordPressi teema\u00f5petus algajatele \u2013 3. osa: d\u00fcnaamiline sisu"},"content":{"rendered":"\n<p>Selles algajatele m\u00f5eldud WordPressi teema\u00f5petuse \u00f5ppet\u00fckis \u00f5pime tundma WordPressi konksu ja lisame oma teemasse m\u00f5ned konksud, mis on vajalikud teema n\u00f5uetekohaseks WordPressi ja pistikprogrammidega t\u00f6\u00f6tamiseks. Samuti hakkame oma p\u00e4ises juurde p\u00e4\u00e4sema WordPressi d\u00fcnaamilisele sisule, n\u00e4iteks hankime automaatselt praeguse lehe pealkirja.<\/p>\n<p>K\u00f5igepealt peame natuke \u00f5ppima WordPressi konksude kohta. Konksud on p\u00f5hifunktsioonid, millega peate tutvuma. Ma ei armasta lihtsalt terve hulga koodide n\u00e4itamist, milles peate kopeerima + kleepima, teadmata, mida see tegelikult teeb. Kui j\u00e4rgite seda \u00f5petust, soovite seda \u00f5igesti \u00f5ppida, eks?<\/p>\n<p>\u00c4rge muretsege, ma j\u00e4tan selle praegu l\u00fchikeseks. Sellest \u00f5petusest saame nende kohta lisateavet hiljem.<\/p>\n<h2>Konksud WordPressis<\/h2>\n<p>L\u00fchidalt; kuna WordPress k\u00e4ivitab kogu koodi lehe laadimiseks ja renderdamiseks, on teatud &quot;kontrollpunktid&quot; \u2013 mida me nimetame konksudeks. Nendes punktides v\u00f5imaldab WordPress arendajatel oma koodi muuta v\u00f5i lisada. WordPress on m\u00e4\u00e4ratlenud terve hulga kontrollpunkte, kus, millel k\u00f5igil on kordumatu nimi. Kui teate selle nime, saate nendesse kontrollpunktidesse lisada oma koodi. Nii saate h\u00f5lpsalt k\u00e4skida WordPressil teie koodi k\u00e4ivitada, kui see protsessi osana sellesse kontrollpunkti j\u00f5uab.<\/p>\n<p>Konkse on kahte t\u00fc\u00fcpi; toimingud ja filtrid. <strong>Toimingud<\/strong> on koodi punktid, kuhu saate lisada kohandatud koodi, n\u00e4iteks v\u00e4ljastada midagi v\u00f5i teha midagi oma eesm\u00e4rkidel. <strong>Filtrid<\/strong> on koodi punktid, kus saate muuta teatud muutujat enne selle kasutamist v\u00f5i v\u00e4ljastamist. Need on v\u00e4ga sarnased, kuid filtrid on seotud \u00fche kindla muutujaga ja toimingud mitte.<\/p>\n<p>Pluginad, teemad ja WordPress ise saavad oma koodi <code>add_action()<\/code>toimingute ja <code>add_filter()<\/code>filtrite jaoks &quot;haakida&quot;. Need kaks funktsiooni k\u00e4sivad WordPressil k\u00e4ivitada konksuga koodi alati, kui t\u00e4itmine j\u00f5uab nende konksudeni.<\/p>\n<p><code>do_action()<\/code>Toimingute ja <code>apply_filters()<\/code>filtrite jaoks kasutatavate konksude m\u00e4\u00e4ratlemiseks .<\/p>\n<p>K\u00f5igile, kes soovivad rohkem teada saada, on mul veel \u00fcks <a href=\"http:\/\/awhitepixel.com\/blog\/all-about-hooks-in-wordpress\/\" target=\"_blank\" rel=\"noopener nofollow\" class=\"external external_icon\">postitus, mis k\u00e4sitleb \u00fcksikasjalikult<\/a> WordPressi konkse.<\/p>\n<p>WordPressi teema peab sisaldama m\u00f5nda konkreetset olulist konksu (toimingut). Need konksud v\u00f5imaldavad WordPressil, pistikprogrammidel ja meie teemal endal haakuda ja teha olulisi asju. Vaatame neid kriitilisi konkse, mida peame lisama.<\/p>\n<h2>Teema p\u00e4ise ja jaluse konksud<\/h2>\n<p>K\u00f5igil WordPressi teemadel peab mallides olema kaks konksu. \u00dcks toiming tuleb paigutada p\u00e4isesse (<code>&lt;head&gt;<\/code>m\u00e4rgendi sisse) ja teine \u200b\u200bjalusesse (vahetult enne <code>&lt;\/body&gt;<\/code>m\u00e4rgendi sulgemist). Need kaks konksu on h\u00e4davajalikud, et WordPress, teie teema ja k\u00f5ik pistikprogrammid saaksid teie teemale lisada oma skripte ja stiilide koodi.<\/p>\n<p>Vajalikud konksud on <code>wp_head<\/code>ja <code>wp_footer<\/code>vastavalt p\u00e4ise ja jaluse jaoks.<\/p>\n<p>Tavaliselt, kui tahame konksu joosta, helistame <code>do_action(&lt;hook name&gt;)<\/code>. Kuid kuna need kaks konksu on nii kriitilised, on WordPress neid meie jaoks lihtsustanud, pannes need lihtsasse funktsioonikutsesse. Nii et nende kahe konksu jaoks saate lihtsalt kasutada <code>wp_head()<\/code>ja <code>wp_footer()<\/code>. Taustal k\u00e4itavad need kaks funktsiooni <code>do_action()<\/code>.<\/p>\n<p>Lisame need kaks konksu (funktsioonikutsed) oma p\u00e4ise- ja jalusemallidesse ja vaatame, mis juhtub.<\/p>\n<pre><code>&lt;!DOCTYPE html&gt;\n&lt;html&gt;\n    &lt;head&gt;\n        &lt;meta charset=\"utf-8\"&gt;\n        &lt;title&gt;A White Pixel Theme&lt;\/title&gt;\n\u00a0\n        &lt;?php wp_head(); ?&gt;\n    &lt;\/head&gt;\n&lt;body&gt;<\/code><\/pre>\n<pre><code>        &lt;?php wp_footer(); ?&gt;\n    &lt;\/body&gt;\n&lt;\/html&gt;<\/code><\/pre>\n<p>Kl\u00f5psake oma kasutajaliideses v\u00e4rskendust. Kui olete sisse logitud, peaksite n\u00fc\u00fcd n\u00e4gema WordPressi administraatoririba! See t\u00e4hendab, et WordPress saab n\u00fc\u00fcd edukalt oma skripte ja stiile teie teemale lisada.<\/p>\n<p><a href=\"https:\/\/wordpress.mediadoma.com\/wp-content\/uploads\/2022\/01\/post-152824-61e4fb80a88c0.png\" data-rel=\"lightbox\"><img decoding=\"async\" class=\"SDStudio-light-box-enable SDStudio-editor-tools-md-imp\" src=\"https:\/\/wordpress.mediadoma.com\/wp-content\/uploads\/2022\/01\/post-152824-61e4fb80a88c0.png\" alt=\"WordPressi teema\u00f5petus algajatele \u2013 3. osa: d\u00fcnaamiline sisu\" ><\/a><\/p>\n<p>Saate kontrollida oma HTML-i allikat ja n\u00e4ha, et teie p\u00e4is sisaldab n\u00fc\u00fcd \u00fcsna palju koodi. See on kood, mida te oma teemale ei lisanud. Nagu n\u00e4ete, kasutab WordPress ise meie lisatud konkse oma asjade tegemiseks.<\/p>\n<p>Liigume konksudest edasi ja hakkame uurima, kuidas saaksime WordPressist d\u00fcnaamiliselt sisu hankida ja need meie p\u00e4ises v\u00e4ljastada.<\/p>\n<h2>D\u00fcnaamiline sisu p\u00e4ises<\/h2>\n<p>\u00dctleme WordPressile, et ta m\u00e4\u00e4raks d\u00fcnaamiliselt dokumendi pealkirja (<code>&lt;title&gt;<\/code>sildi jaoks). Selleks kasutame funktsiooni (millel on muide filter) nimega <code>wp_title()<\/code>. Nagu \u00fclalpool teada saime <code>wp_title()<\/code>, saate v\u00e4ljundit muuta teie, WordPress v\u00f5i pistikprogrammid, kuna tegemist on filtriga. Lisame sellele \u00f5petuses hiljem filtri.<\/p>\n<p>Funktsioonil <code>wp_title()<\/code>on <a href=\"https:\/\/developer.wordpress.org\/reference\/functions\/wp_title\/\" target=\"_blank\" rel=\"noopener nofollow\" class=\"external external_icon\">mitu argumenti<\/a>, mida saate oma maitse j\u00e4rgi kohandada, kuid praegu lisan t\u00fchja stringi, nii et see kuvab ainult selle lehe pealkirja, millel me oleme.<\/p>\n<p>L\u00fclitage oma <code>&lt;title&gt;<\/code>silt v\u00e4lja <code>header.php<\/code>j\u00e4rgmisele:<\/p>\n<pre><code>&lt;title&gt;&lt;?php wp_title(''); ?&gt;&lt;\/title&gt;<\/code><\/pre>\n<p>Innukas teist v\u00f5is m\u00e4rgata, et esilehel ei teki pealkirja. See on WordPressi standardk\u00e4itumine, mille parandame hiljem selles \u00f5petuses (teeme seda filtri abil). Kui k\u00fclastate \u00fchte postitust v\u00f5i lehte, peaksite saama postituse pealkirja.<\/p>\n<p>WordPressil on vahva funktsioon, mis loob d\u00fcnaamiliselt m\u00e4rgendi jaoks hulga klasse <code>&lt;body&gt;<\/code>s\u00f5ltuvalt sellest, millisel lehel me viibime; nimega <a href=\"https:\/\/developer.wordpress.org\/reference\/functions\/body_class\/\" target=\"_blank\" rel=\"noopener nofollow\" class=\"external external_icon\">body_class<\/a>. V\u00e4rskendage <code>&lt;body&gt;<\/code>m\u00e4rgendit <code>header.php<\/code>j\u00e4rgmiselt:<\/p>\n<pre><code>&lt;body &lt;?php body_class(); ?&gt;&gt;<\/code><\/pre>\n<p><code>&lt;body&gt;<\/code>V\u00e4rskendage ja vaadake k\u00f5iki sildile lisatud klasse. Heitke pilk erinevatele lehtedele (esileht, \u00fcksik, kategooria). K\u00f5ik need klassid on v\u00e4ga kasulikud stiili kujundamiseks ja erinevate sarnaste osade eristamiseks. T\u00f5en\u00e4oliselt kasutate m\u00f5nda neist oma CSS-is.<\/p>\n<p>HTML-i heade tavade j\u00e4rgimiseks peaksime teavitama ka saidi keele HTML-is. Selleks kasutame WordPressi funktsiooni, et saada keel seadetest; <a href=\"https:\/\/codex.wordpress.org\/Function_Reference\/language_attributes\" target=\"_blank\" rel=\"noopener nofollow\" class=\"external external_icon\">keele_atribuudid<\/a>.<\/p>\n<pre><code>&lt;html &lt;?php language_attributes(); ?&gt;&gt;<\/code><\/pre>\n<p>Ja l\u00f5puks tahaksin lisada m\u00f5ned metasildid ja sellised, mis ei ole WordPressi spetsiifilised, kuid j\u00e4rgivad levinud veebidisaini tavasid. T\u00e4isfail <code>header.php<\/code>n\u00e4eb v\u00e4lja selline:<\/p>\n<pre><code>&lt;!DOCTYPE html&gt;\n&lt;html class=\"no-js\" &lt;?php language_attributes(); ?&gt;&gt;\n&lt;head&gt;\n    &lt;meta charset=\"utf-8\"&gt;\n    &lt;meta http-equiv=\"X-UA-Compatible\" content=\"IE=edge\"&gt;\n\u00a0\n    &lt;meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\"&gt;\n    &lt;title&gt;&lt;?php wp_title(''); ?&gt;&lt;\/title&gt;\n\u00a0\n    &lt;?php wp_head(); ?&gt;\n&lt;\/head&gt;\n&lt;body &lt;?php body_class(); ?&gt;&gt;<\/code><\/pre>\n<p>Selle \u00f5petuse j\u00e4rgmise sammuna lahkume <code>header.php<\/code>ja sukeldume sellesse <code>index.php<\/code>, et \u00f5ppida, kuidas hankida d\u00fcnaamilisemat sisu, n\u00e4iteks postitusi.<\/p>\n<h2>Kasutatud meetodite dokumentatsioon<\/h2>\n<ul>\n<li><a href=\"https:\/\/codex.wordpress.org\/Function_Reference\/wp_head\" target=\"_blank\" rel=\"noopener nofollow\" class=\"external external_icon\">wp_head<\/a><\/li>\n<li><a href=\"https:\/\/codex.wordpress.org\/Function_Reference\/wp_footer\" target=\"_blank\" rel=\"noopener nofollow\" class=\"external external_icon\">wp_footer<\/a><\/li>\n<li><a href=\"https:\/\/developer.wordpress.org\/reference\/functions\/wp_title\/\" target=\"_blank\" rel=\"noopener nofollow\" class=\"external external_icon\">wp_title<\/a><\/li>\n<li><a href=\"https:\/\/developer.wordpress.org\/reference\/functions\/body_class\/\" target=\"_blank\" rel=\"noopener nofollow\" class=\"external external_icon\">keha_klass<\/a><\/li>\n<li><a href=\"https:\/\/codex.wordpress.org\/Function_Reference\/language_attributes\" target=\"_blank\" rel=\"noopener nofollow\" class=\"external external_icon\">keele_atribuudid<\/a><\/li>\n<\/ul>\n<p><div id=\"PostUnique_PostSource\" style=\"padding-top: 50px\">:  <a target=\"_blank\" rel=\"noopener nofollow\" href=\"\/\/awhitepixel.com\" class=\"external external_icon\">awhitepixel.com<\/a><\/div><\/p>\n","protected":false},"excerpt":{"rendered":"<p>Sellest \u00f5ppet\u00fckist saate teada WordPressi konksude ja WordPressi d\u00fcnaamilise sisu juurde p\u00e4\u00e4semise ja p\u00e4ises v\u00e4ljastamise kohta.<\/p>\n","protected":false},"author":1,"featured_media":224746,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":"","_wp_rev_ctl_limit":""},"categories":[718,894,718,833,894,916,916,1110,842,833,926,926,842,863,863],"tags":[1165],"class_list":{"0":"post-233602","1":"post","2":"type-post","3":"status-publish","4":"format-standard","5":"has-post-thumbnail","6":"hentry","7":"category-arendaja","8":"category-kood","10":"category-juhend-algajatele","12":"category-muud","14":"category-n-a","15":"category-opetused","17":"category-teemasid","20":"category-wordpress-4","22":"tag-affiai-et"},"_links":{"self":[{"href":"https:\/\/wordpress.mediadoma.com\/et\/wp-json\/wp\/v2\/posts\/233602","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/wordpress.mediadoma.com\/et\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/wordpress.mediadoma.com\/et\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/wordpress.mediadoma.com\/et\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/wordpress.mediadoma.com\/et\/wp-json\/wp\/v2\/comments?post=233602"}],"version-history":[{"count":0,"href":"https:\/\/wordpress.mediadoma.com\/et\/wp-json\/wp\/v2\/posts\/233602\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/wordpress.mediadoma.com\/et\/wp-json\/wp\/v2\/media\/224746"}],"wp:attachment":[{"href":"https:\/\/wordpress.mediadoma.com\/et\/wp-json\/wp\/v2\/media?parent=233602"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/wordpress.mediadoma.com\/et\/wp-json\/wp\/v2\/categories?post=233602"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/wordpress.mediadoma.com\/et\/wp-json\/wp\/v2\/tags?post=233602"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}