{"id":233966,"date":"2023-02-25T10:48:00","date_gmt":"2023-02-25T07:48:00","guid":{"rendered":"https:\/\/wordpress.mediadoma.com\/?p=233966"},"modified":"2022-11-11T13:27:55","modified_gmt":"2022-11-11T10:27:55","slug":"wordpress-teeman-opetusohjelma-aloittelijoille-osa-10-lisaeae-malleja","status":"publish","type":"post","link":"https:\/\/wordpress.mediadoma.com\/fi\/wordpress-teeman-opetusohjelma-aloittelijoille-osa-10-lisaeae-malleja\/","title":{"rendered":"WordPress-teeman opetusohjelma aloittelijoille \u2013 Osa 10: Lis\u00e4\u00e4 malleja"},"content":{"rendered":"\n

T\u00e4ll\u00e4 WordPress-teeman opetusohjelman aloittelijoille oppitunnilla sukeltaamme enemm\u00e4n malleihin. Opimme mallin osista ja toteutamme ne uudelleenk\u00e4ytett\u00e4vyytt\u00e4 varten. Ja lis\u00e4\u00e4mme teemaamme lis\u00e4\u00e4 WordPressin oletusmalleja.<\/p>\n

Mutta ennen kuin alamme lis\u00e4t\u00e4 mallitiedostoja, meid\u00e4n on tiedett\u00e4v\u00e4, miksi meid\u00e4n pit\u00e4isi vaivautua mallin osien<\/strong> kanssa .<\/p>\n

Mallin osat: Joustavampia rakennuspalikoita<\/h2>\n

Mallin osat toimivat t\u00e4sm\u00e4lleen kuten get_header()<\/code>ja get_footer()<\/code>joista opimme osassa 2<\/a>, mutta eiv\u00e4t rajoitu n\u00e4ihin tiedostoihin. Voit k\u00e4ytt\u00e4\u00e4 malliosia mille tahansa tiedostolle!<\/p>\n

Teemat k\u00e4ytt\u00e4v\u00e4t yleens\u00e4 malliosaa silmukassa oleville viesteille. Yleens\u00e4 monet mallit, kuten kategoria, arkisto ja hakutulokset, n\u00e4ytt\u00e4v\u00e4t yleens\u00e4 jokaisen viestin silmukassa samalla tavalla. Siksi on eritt\u00e4in hyv\u00e4 idea erottaa post-silmukan tulos yhdeksi tiedostoksi. N\u00e4in sinun ei tarvitse toistaa sit\u00e4 jokaisessa mallissa.<\/p>\n

"Muunnetaan" osa olemassa olevasta koodistamme malliosiksi ennen kuin alamme tehd\u00e4 lis\u00e4\u00e4 malleja!<\/p>\n

Postisilmukan malliosan luominen<\/h2>\n

Luo uusi tyhj\u00e4 tiedosto teemakansioomme; kutsutaan content-loop.php<\/code>. Voit nimet\u00e4 mallin osia miten haluat. Mutta et voi nimet\u00e4 niit\u00e4 samalla tavalla kuin mit\u00e4\u00e4n WordPressin m\u00e4\u00e4ritt\u00e4mi\u00e4 malleja<\/a>. Etsi artikkelistamme kaikki, mit\u00e4 index.php<\/code>sinulla on silmukan sis\u00e4ll\u00e4, leikkaa se irti ja liit\u00e4 se sis\u00e4\u00e4n content-loop.php<\/code>.<\/p>\n

K\u00e4yt\u00e4 nyt tyhj\u00e4n silmukan sis\u00e4ll\u00e4 index.php<\/code>funktiokutsua get_template_part()<\/code>ja m\u00e4\u00e4rit\u00e4 malliosatiedostosi parametriksi (ilman tunnistetta .php<\/code>). T\u00e4lt\u00e4 sen pit\u00e4isi n\u00e4ytt\u00e4\u00e4 molemmissa tiedostoissa:<\/p>\n

...\n    while (have_posts()): the_post(); \n        get_template_part('content-loop');\n    endwhile;\n    the_posts_pagination();\n...<\/code><\/pre>\n
<article <?php post_class(); ?>>\n    <h2><a href=\"<?php the_permalink(); ?>\" title=\"<?php the_title(); ?>\"><?php the_title(); ?><\/a><\/h2>\n    <?php if (has_post_thumbnail()) {\n        the_post_thumbnail();\n    } ?>\n    <?php the_excerpt(); ?>\n    <?php the_category(); ?>\n<\/article><\/code><\/pre>\n
Jos p\u00e4ivit\u00e4t etusivusi, sinun ei pit\u00e4isi n\u00e4hd\u00e4 mit\u00e4\u00e4n eroa.<\/p>\n
Loistava! Nyt kun mallimme index.php<\/code>on mukava ja puhdas, voimme k\u00e4ytt\u00e4\u00e4 sit\u00e4 pohjana kopioidaksemme uusia malleja. Alla k\u00e4yn l\u00e4pi luokkamallin ja hakutulosmallin lis\u00e4\u00e4misen, mutta kehotan sinua luomaan lis\u00e4\u00e4 malleja, jotta voit paremmin hallita teemasi suunnittelua.<\/p>\n
Luokkamallin lis\u00e4\u00e4minen<\/h2>\n
Jos palaat WordPressin mallihierarkiaan<\/a>, voit n\u00e4hd\u00e4, ett\u00e4 WordPress etsii viestiluokista mallia nimelt\u00e4 category.php<\/code>. Luomme sen ensin.<\/p>\n
Tee teemakansiossasi kopio index.php<\/code>tiedostosta ja nime\u00e4 kopio uudelleen category.php<\/code>.<\/p>\n
Ja.. siin\u00e4 se. Olet periaatteessa valmis\u2026!<\/p>\n
Lis\u00e4\u00e4mme kuitenkin yhden yksityiskohdan; haluamme n\u00e4ytt\u00e4\u00e4 otsikon, joka kertoo, ett\u00e4 olemme luokkasivulla X-kategorian viestien luokkasivulla. WordPressiss\u00e4 on t\u00e4t\u00e4 varten toiminto, jota voit k\u00e4ytt\u00e4\u00e4 kaikissa arkistomalleissa (luokka, tagit, p\u00e4iv\u00e4m\u00e4\u00e4r\u00e4-arkistot), the_archive_title<\/code>. Lis\u00e4t\u00e4\u00e4n se ennen silmukkaa <h1><\/code>tagin sis\u00e4\u00e4n.<\/p>\n
<?php get_header(); ?>\n<h1><?php the_archive_title(); ?><\/h1>\n<?php\nif (have_posts()) {\n...<\/code><\/pre>\n
Jos tarkastelet viestiluokkasivua, sinun pit\u00e4isi n\u00e4hd\u00e4 jotain t\u00e4m\u00e4n kaltaista, ja arkiston otsikko on "Category:". PS: Jos haluat muuttaa arkiston otsikon tulostetta (esimerkiksi "Category:" ei n\u00e4y), voit lis\u00e4t\u00e4 suodattimen kohtaan get_the_archive_title<\/a>. Dokumentaatiosivulla on loistava esimerkki siit\u00e4, miten se tehd\u00e4\u00e4n.<\/p>\n
\"WordPress-teeman<\/a><\/p>\n
No se oli helppoa! K\u00e4sitell\u00e4\u00e4n seuraavaksi hakutulosmallia.<\/p>\n
Hakutulosmallin lis\u00e4\u00e4minen<\/h2>\n
Menettely on t\u00e4sm\u00e4lleen sama kuin teimme luokkamalleille. Tee t\u00e4ll\u00e4 kertaa kopio category.php<\/code>ja nime\u00e4 kopio uudelleen muotoon search.php<\/code>.<\/p>\n
Meid\u00e4n tarvitsee vain korjata otsikko. Arkiston otsikkotoiminto, jota k\u00e4ytimme kategoriamallissa, ei valitettavasti toimi kovin hyvin hakutulosmallissa. Itse asiassa WordPressiss\u00e4 ei ole yksinkertaista toimintoa, joka tuottaa meille otsikon.<\/p>\n
Mutta voimme helposti tehd\u00e4 sellaisen itse, ja samalla n\u00e4yt\u00e4n, kuinka dynaaminen muuttuja voidaan tulostaa ja silti pit\u00e4\u00e4 teksti k\u00e4\u00e4nnett\u00e4v\u00e4n\u00e4.<\/p>\n
PHP:ss\u00e4 on kaksi hy\u00f6dyllist\u00e4 toimintoa printf()<\/code>ja sprintf()<\/code>. He tekev\u00e4t samoin, paitsi ett\u00e4 printf<\/code>se tulostaa sen (kuten kaiku) ja sprintf<\/code>palauttaa sen, jotta voimme tallentaa sen muuttujaan. Kun teksti on asetettu ensimm\u00e4isiksi parametreiksi, voimme lis\u00e4t\u00e4 argumenteiksi dynaamisia muuttujia, jotka sitten lis\u00e4t\u00e4\u00e4n tekstiin. Niiden sis\u00e4ll\u00e4 voimme k\u00e4ytt\u00e4\u00e4 k\u00e4\u00e4nnett\u00e4v\u00e4n tekstin funktioita __()<\/code>ja _e()<\/code>. Suosittelen, ett\u00e4 luet hieman printf<\/a> :n tai sprintf<\/a> :n toiminnasta, koska en mene t\u00e4ss\u00e4 enemp\u00e4\u00e4 yksityiskohtiin.<\/p>\n
WordPress tarjoaa yksinkertaisen toiminnon haetun merkkijonon saamiseksi; get_search_query()<\/code>. T\u00e4m\u00e4n j\u00e4lkeen korvataan arkiston otsikkotoiminto t\u00e4ll\u00e4;<\/p>\n
<h1><?php printf(__('Search: %s', 'wptutorial'), get_search_query()); ?><\/h1><\/code><\/pre>\n
Yll\u00e4 oleva koodi tekee sis\u00e4lt\u00e4 ulosp\u00e4in; m\u00e4\u00e4ritell\u00e4\u00e4n k\u00e4\u00e4nnett\u00e4v\u00e4 teksti "Haku: %s", joka laitetaan a:n sis\u00e4\u00e4n, printf<\/code>joka toistaa merkkijonoa ja korvaa merkkijonovakion (%s<\/code>) toisella argumentilla; joka on get_search_query()<\/code>.<\/p>\n
T\u00e4m\u00e4n seurauksena saamme seuraavanlaisen otsikon haettaessa "er":<\/p>\n
\"WordPress-teeman<\/a><\/p>\n
Kiva! Toinen malli tehty. Mit\u00e4 tulee t\u00e4m\u00e4n oppitunnin viimeiseen osaan, siirrymme yksitt\u00e4isviestimalliimme ja lis\u00e4\u00e4mme jotain hyvin yleist\u00e4 WordPressiss\u00e4; kommenttimalli.<\/p>\n
Kommenttimallin lis\u00e4\u00e4minen yhteen viestiin<\/h2>\n
Viestiartikkelissamme single.php<\/code>haluamme n\u00e4ytt\u00e4\u00e4 kommentteja. Kommenttien tulee tuottaa luettelo aiemmista kommenteista ja lomake uuden kommentin lis\u00e4\u00e4mist\u00e4 varten.<\/p>\n
Kommenttimalli on mallitiedosto, jonka voit lis\u00e4t\u00e4 teemaasi, mutta WordPressill\u00e4 on itse asiassa oma oletuskommenttimallitulosteensa. Jos sinulla ei ole comments.php<\/code>teemaa, kommenttimallin pyyt\u00e4minen palauttaa WordPressin oletustulosteen sille. N\u00e4in teemme t\u00e4ss\u00e4 opetusohjelmassa.<\/p>\n
Haluamme kutsua kommenttimallia vain, jos viestiss\u00e4 on aktivoituja kommentteja (se on kunkin viestin asetus ja yleinen sivustoasetus). Joten lis\u00e4\u00e4mme if-tarkistuksen tarkistaaksemme, ovatko kommentit sallittuja, comments_open()<\/code>ja jos se palauttaa tosi, pyyd\u00e4mme kommenttimallia comments_template()<\/code>. Muista, ett\u00e4 kaiken t\u00e4m\u00e4n on tapahduttava silmukan sis\u00e4ll\u00e4. Lis\u00e4sin sen lopun j\u00e4lkeen <\/article><\/code>, juuri ennen silmukan sulkemista.<\/p>\n
...\n        <p><?php _e('Author', 'wptutorial'); ?>: <?php the_author(); ?><\/p>\n    <\/article>\n    <?php \n    if (comments_open()) {\n        comments_template();\n    }\n    endwhile;\n} else {\n    ?><p><?php _e('No posts, sorry.', 'wptutorial'); ?><\/p><?php\n...<\/code><\/pre>\n
Jos vierailet yksitt\u00e4isess\u00e4 viestiss\u00e4, joka on sallinut kommentit (lis\u00e4sin kommentin vain n\u00e4ytt\u00e4\u00e4kseni sinulle my\u00f6s kommenttiluettelon); saat t\u00e4m\u00e4n kauniin (ahem) oletuskommenttimallin:<\/p>\n
\"WordPress-teeman<\/a><\/p>\n
Nyt voit (ja sit\u00e4 usein suositellaan) luoda omasi comments.php<\/code>teemaasi, joka ohittaa WordPressin oletustulosteen. En kuitenkaan luo t\u00e4ss\u00e4 opetusohjelmassa kommenttimallia, koska WordPressin oletustulostus toimii hienosti, kunhan muotoilet sen oikein. Jos tarkastelet HTML-koodia, k\u00e4ytett\u00e4viss\u00e4 on runsaasti k\u00e4\u00e4reit\u00e4 ja luokkia.<\/p>\n
Dokumentaatio k\u00e4ytetyist\u00e4 menetelmist\u00e4<\/h2>\n