\n Mit\u00e4 mallitiedostot ovat WordPressiss\u00e4?\n<\/p>\n
\n Mallit ovat tiedostoja, jotka kertovat WordPress-teemalle kuinka n\u00e4ytt\u00e4\u00e4 erityyppist\u00e4 sis\u00e4lt\u00f6\u00e4 j\u00e4rjestelm\u00e4llisesti.\n<\/p>\n
\n Kun joka kerta, kun joku l\u00e4hett\u00e4\u00e4 pyynn\u00f6n n\u00e4hd\u00e4 osan verkkosivustostasi, WordPress-verkkosivualusta selvitt\u00e4\u00e4, mit\u00e4 sis\u00e4lt\u00f6\u00e4 he haluavat n\u00e4hd\u00e4 ja miten kyseinen verkkosivustosi osa tulisi n\u00e4ytt\u00e4\u00e4 yleis\u00f6lle.\n<\/p>\n
\n Lis\u00e4ksi WordPress yritt\u00e4\u00e4 k\u00e4ytt\u00e4\u00e4 teemassasi olevaa sopivinta mallitiedostoa, joka tulee p\u00e4\u00e4tt\u00e4\u00e4 hierarkiaj\u00e4rjestyksen perusteella.\n<\/p>\n
- \n
- Se tunnetaan my\u00f6s nimell\u00e4 WordPress-sivumallihierarkia.\n <\/li>\n
- WordPress-sivumallihierarkia on kokonainen luettelo useista mallitiedostoista.\n <\/li>\n
- WordPress tuntee sen ja ne luokitellaan sen m\u00e4\u00e4ritt\u00e4miseksi, mik\u00e4 tiedosto on etusijalla toiseen n\u00e4hden. Se toimii kuin mik\u00e4 tahansa p\u00e4\u00e4t\u00f6spuu.\n <\/li>\n<\/ul>\n
\n Kun WordPress yritt\u00e4\u00e4 p\u00e4\u00e4tt\u00e4\u00e4, kuinka tietty sivu n\u00e4ytet\u00e4\u00e4n sopivimmalla tavalla, se toimii mallihierarkian mukaisesti.\n<\/p>\n
\n Esimerkiksi:<\/strong>\n<\/p>\n
\n Jos joku haluaa k\u00e4ytt\u00e4\u00e4 seuraavaa URL-osoitetta.\n<\/p>\n
\n
Your-site.com\/category\/news<\/code>\n<\/p>\n\n Sitten mukautettu WordPress-teema etsii oikeat mallitiedostot seuraavassa j\u00e4rjestyksess\u00e4:\n<\/p>\n
- \n
- \n
category-{slug}.php<\/code>: t\u00e4ss\u00e4 tapauksessacategory-news.php<\/code>\n <\/li>\n- \n
category-{id}.php<\/code>: jos kategoriatunnus olisi 5, WordPress yritt\u00e4isi l\u00f6yt\u00e4\u00e4 tiedoston nimelt\u00e4category-5.php<\/code>\n <\/li>\n- \n
category.php<\/code>\n <\/li>\n- \n
archive.php<\/code>\n <\/li>\n- \n
index.php<\/code>\n <\/li>\n<\/ol>\n\n T\u00e4m\u00e4n WordPressin mukautetun sivumallihierarkian lopussa on index.php-tiedosto.\n<\/p>\n
\n Sit\u00e4 k\u00e4ytet\u00e4\u00e4n n\u00e4ytt\u00e4m\u00e4\u00e4n kaiken tyyppist\u00e4 sis\u00e4lt\u00f6\u00e4, jolla ei ole tarkempaa mallitiedostoa. Jos mallitiedosto sijoittuu korkeammalle hierarkiassa, WordPress-teeman mukauttaminen k\u00e4ytt\u00e4\u00e4 automaattisesti kyseist\u00e4 tiedostoa sis\u00e4ll\u00f6n n\u00e4ytt\u00e4miseen.\n<\/p>\n
\n Mit\u00e4 sivupohjat ovat WordPress-verkkosivuilla?
\n<\/h3>\n\n WordPress-verkkosivuilla WordPress-sivumallilaajennus on yleens\u00e4 nimelt\u00e4\u00e4n page.php. Joskus saatavilla on tarkempi mallitiedosto nimelt\u00e4 archive.php.\n<\/p>\n
\n Mukautettu WordPress-teema k\u00e4ytt\u00e4\u00e4 samaa tiedostoa verkkosivustosi kaikkien sivujen sis\u00e4ll\u00f6n render\u00f6imiseen.\n<\/p>\n
\n Joskus on tarpeen muuttaa verkkosivustosi yksitt\u00e4isten osien ulkoasua, ulkoasua tai toimintoja.\n<\/p>\n
\n T\u00e4m\u00e4 on paikka, jossa sivumallit tulevat esiin.\n<\/p>\n
\n Mukautetun WordPress-sivumallin avulla voit standardoida ja yksil\u00f6id\u00e4 mit\u00e4 tahansa WordPress-verkkosivustosi osaa vaikuttamatta sen muihin osiin.\n<\/p>\n
\n Nyky\u00e4\u00e4n on esimerkiksi monia WordPress-teemoja, joissa oli mahdollisuus muuttaa sivusi t\u00e4ysleve\u00e4ksi ja lis\u00e4t\u00e4 siihen sitten toinen sivupalkki.\n<\/p>\n
\n Se voidaan tehd\u00e4 my\u00f6s erilaisten mallitiedostojen kautta.\n<\/p>\n
\n Jos teet saman ja ty\u00f6skentelet eri mallien kanssa, siihen kuuluu aktiivisen WordPress-teeman tiedostojen muokkaaminen ja muuttaminen, joten aloita aina lapsiteemalla, kun teet t\u00e4llaisia \u200b\u200bmukautuksia.\n<\/p>\n
\n Sit\u00e4 on helppo muokata, eik\u00e4 se korvaisi muita asioita.\n<\/p>\n
\n Kuinka mukauttaa sivuja WordPressin mukautetuissa sivumalleissa?
\n<\/h3>\n\n On olemassa kolme perustapaa k\u00e4ytt\u00e4\u00e4 mukautettuja WordPress-sivumalleja, jotka kuvataan seuraavasti:\n<\/p>\n
- \n
- Lis\u00e4\u00e4m\u00e4ll\u00e4 ehdollisia lauseita olemassa olevaan WordPress-sivumallihierarkiaan,\n <\/li>\n
- Luo erityinen sivumalli, joka sijoittuu korkeammalle hierarkiassa, ja\n <\/li>\n
- M\u00e4\u00e4rit\u00e4 mallit suoraan tietyille sivuille.\n <\/li>\n<\/ul>\n
\n Tutkitaan sit\u00e4 kaikkea syv\u00e4llisesti.\n<\/p>\n
![\"\"](\"https:\/\/inform.click\/wp-content\/uploads\/2022\/11\/post-285965-6382c2306e7de.webp\")
<\/a><\/p>\n\n Ehdollisten tunnisteiden k\u00e4ytt\u00f6 WordPress-verkkosivujen oletusmallissa
\n<\/h5>\n\n On helppo tapa tehd\u00e4 sivukohtaisia \u200b\u200bmuutoksia WordPress-teeman mukauttamisen ehdollisiin tageihin mihin tahansa tiettyyn jo k\u00e4yt\u00f6ss\u00e4 olevaan malliin.\n<\/p>\n
\n N\u00e4it\u00e4 tunnisteita k\u00e4ytet\u00e4\u00e4n luomaan toimintoja, jotka suoritetaan vain, jos tietty ehto t\u00e4yttyy vastaavasti.\n<\/p>\n
\n Sitten sinun tulee lis\u00e4t\u00e4 ehdollisia tunnisteita aktiivisen teemasi page.php-tiedostoon.\n<\/p>\n
\n Niiden avulla voit tehd\u00e4 muutoksia vain etusivulle, etusivulle, blogisivulle tai mille tahansa muulle verkkosivustosi sivulle.\n<\/p>\n
\n Jotkut yleisimmist\u00e4 k\u00e4ytetyist\u00e4 ehdollisista tunnisteista ovat seuraavat:\n<\/p>\n
- \n
- \n
is_page( )<\/code>: Sit\u00e4 k\u00e4ytet\u00e4\u00e4n kohdistamiseen tietylle sivulle, ja sit\u00e4 voidaan k\u00e4ytt\u00e4\u00e4 sivun tunnuksen, otsikon tai URL-osoitteen\/nimen kanssa.\n <\/li>\n- \n
is_home( )<\/code>: Koskee vain kotisivua.\n <\/li>\n- \n
is_front_page( )<\/code>: Se kohdistaa onnistuneesti verkkosivustosi etusivulle kohdassa Asetukset -> Lukeminen m\u00e4\u00e4ritettyjen mukaisesti\n <\/li>\n- \n
is_category( )<\/code>: Se on luokkasivun ehto. Se voi my\u00f6s k\u00e4ytt\u00e4\u00e4 tunnusta, otsikkoa tai URL-osoitetta\/nime\u00e4, kutenis_page( )<\/code>tunnistetta.\n <\/li>\n- \n
is_single( )<\/code>: Sit\u00e4 k\u00e4ytet\u00e4\u00e4n yksitt\u00e4isiin viesteihin tai liitteisiin\n <\/li>\n- \n
is_archive( )<\/code>: Se on arkistosivujen ehto\n <\/li>\n- \n
is_404( )<\/code>: Sit\u00e4 k\u00e4ytet\u00e4\u00e4n vain 404-virhesivuille\n <\/li>\n<\/ol>\n\n \u2013 Kun se esimerkiksi lis\u00e4t\u00e4\u00e4n sivu.php-tiedostoosi vakiotunnisteen sijaan
get_header( );<\/code>, seuraava koodi lataa mukautetun otsikkotiedoston, jonka nimi on header-shop.php, kun sivu n\u00e4ytet\u00e4\u00e4n sivustosi.fi\/tuote.\n<\/p>\n\n Koodi:<\/strong>\n<\/p>\n
If (is_page ('products')) {\n get_header ('shop');\n} else {\n get_header( );\n}<\/code><\/pre>\n\n \u2013 Esimerkiksi n\u00e4m\u00e4 kaksi ehtoa muuttavat t\u00e4ysin verkkosivustosi eri sivujen toimintaa.\n<\/p>\n
\n Edell\u00e4 mainitun kauppakohtaisen otsikkotiedoston lataamisen lis\u00e4ksi se lataa nyt my\u00f6s header-about.php-tiedoston sivulle, jonka tunnus on 42.\n<\/p>\n
\n Kaikilla muilla sivuilla normaali otsikkotiedosto koskee my\u00f6s sit\u00e4.\n<\/p>\n
\n Luo sivukohtaisia \u200b\u200btiedostoja WordPress-sivumallihierarkiassa
\n<\/h5>\n\n Ehdolliset tagit ovat yksi parhaista tavoista tehd\u00e4 pieni\u00e4 muutoksia WordPress-verkkosivuillesi.\n<\/p>\n
\n Se voi auttaa sinua luomaan suurempia mukautuksia k\u00e4ytt\u00e4m\u00e4ll\u00e4 monia ehdollisia lausekkeita per\u00e4kk\u00e4in.\n<\/p>\n
\n Yksi parhaista tavoista on ottaa k\u00e4ytt\u00f6\u00f6n koko WordPress-sivumallihierarkia, joka kulkisi luettelon suurimmasta mahdollisesta mallitiedostosta ja sitten voidaan valita, mik\u00e4 sopii heille parhaiten.\n<\/p>\n
\n WordPressin mukautettu sivumalli sis\u00e4lt\u00e4\u00e4 seuraavan hierarkian:\n<\/p>\n
\n
Page-{slug}.php<\/code>\n<\/p>\n\n
Page-{id}.php<\/code>\n<\/p>\n\n
Page.php<\/code>\n<\/p>\n\n
index.php<\/code>\n<\/p>\n\n Mukautetut sivumallit ovat ne, jotka on m\u00e4\u00e4ritetty tietylle sivulle.\n<\/p>\n
\n Joten jos jokin niist\u00e4 on olemassa, WordPress k\u00e4ytt\u00e4\u00e4 sit\u00e4 riippumatta siit\u00e4, ovatko mallitiedostot olemassa vai eiv\u00e4t. Sen j\u00e4lkeen WordPress l\u00f6yt\u00e4\u00e4 sivumallin, jossa on ”slug”.\n<\/p>\n
\n Esimerkki: Jos sis\u00e4llyt\u00e4t teematiedostoon tiedoston nimelt\u00e4 page-about.php, se l\u00f6ytyy t\u00e4llaisesta URL-osoitteesta yoursite.com\/about.\n<\/p>\n
\n Mukautettujen WordPress-sivumallien m\u00e4\u00e4ritt\u00e4minen
\n<\/h5>\n\n On my\u00f6s mahdollista m\u00e4\u00e4ritt\u00e4\u00e4 mukautetut mallit manuaalisesti tietyille sivuille, ja WordPress voi k\u00e4ytt\u00e4\u00e4 niit\u00e4 my\u00f6s automaattisessa muodossa.\n<\/p>\n
\n WordPress-sivumallihierarkian muodossa teemakansiossa on mallitiedosto.\n<\/p>\n
\n Joten aivan kuten luot sivukohtaisen mallin WordPress-hierarkialle, t\u00e4m\u00e4 pyyt\u00e4\u00e4 sinua antamaan tietyn mallitiedoston ja sitten linkitt\u00e4m\u00e4\u00e4n sen mille tahansa sivulle, jolla haluat k\u00e4ytt\u00e4\u00e4 sit\u00e4.\n<\/p>\n
\n Se voidaan tehd\u00e4 kahdella eri tavalla, joista tulet tutuksi. Jotkin yksityiskohdat esitet\u00e4\u00e4n seuraavasti:\n<\/p>\n
\n M\u00e4\u00e4rit\u00e4 mukautettuja sivumalleja WordPress-editorista
\n<\/h5>\n\n WordPress-editorissa on vaihtoehtokentt\u00e4 nimelt\u00e4 ”Sivun attribuutit”, jonka alla on avattava valikko nimelt\u00e4 ”Malli”.\n<\/p>\n
\n Kun olet napsauttanut sit\u00e4, se antaa sinulle luettelon erilaisista k\u00e4ytett\u00e4viss\u00e4 olevista sivumalleista WordPress-teemasivustollasi. Valitse haluamasi, tallenna se; p\u00e4ivit\u00e4 se, kun olet valmis.\n<\/p>\n
\n Mukautetun mallin m\u00e4\u00e4ritt\u00e4minen pikamuokkauksen avulla
\n<\/h5>\n- \n
- Siirry Kaikki sivut -osioon ja vie hiiri mink\u00e4 tahansa luettelossa mainitun kohteen p\u00e4\u00e4lle.\n <\/li>\n
- N\u00e4kyviin tulee valikko, joka sis\u00e4lt\u00e4\u00e4 ”Pikamuokkaus”-kohdan.\n <\/li>\n
- Napsauta sit\u00e4 muokataksesi sivun asetuksia suoraan sielt\u00e4.\n <\/li>\n
- N\u00e4et siell\u00e4 samankaltaisen avattavan valikon toisen sivumallin valitsemiseksi.\n <\/li>\n
- Valitse haluamasi ja muokkaa sit\u00e4.\n <\/li>\n<\/ul>\n
\n Kuinka k\u00e4ytt\u00e4\u00e4 mukautettua WordPress-sivumallia?
\n<\/h3>\n\n WordPress-sivupohjia voidaan k\u00e4ytt\u00e4\u00e4 moniin eri tarkoituksiin, ja ne voidaan helposti mukauttaa mihin tahansa.\n<\/p>\n
\n Se vaatii vain hyv\u00e4\u00e4 mielikuvitusta ja hyvin perehtynytt\u00e4 koodausta.\n<\/p>\n
\n Jotkut t\u00e4rkeimmist\u00e4 k\u00e4ytt\u00f6tavoista on esitetty alla:\n<\/p>\n
\n Sit\u00e4 voidaan k\u00e4ytt\u00e4\u00e4 t\u00e4ysleve\u00e4n\u00e4 sivupohjana.<\/strong>\n<\/p>\n
\n Ensinn\u00e4kin t\u00e4ss\u00e4 tapauksessa sivupalkki poistetaan poistamalla se t\u00e4ll\u00e4 komennolla,\n<\/p>\n
<?php get_sidebar(); ?><\/code><\/pre>\n\n Sitten CSS-koodaukseen tehd\u00e4\u00e4n joitain erityisi\u00e4 muutoksia alla olevan kuvan mukaisesti,\n<\/p>\n
.site-content {\n Float: left;\n Width: 65 %;\n}<\/code><\/pre>\n\n Leveys-attribuutti rajoittaa sivuston elementin, joka sis\u00e4lt\u00e4\u00e4 sis\u00e4lt\u00f6mme, 65 prosenttiin k\u00e4ytett\u00e4viss\u00e4 olevasta tilasta.\n<\/p>\n
\n Jos muutamme vain kooksi 100%, t\u00e4m\u00e4 vaikuttaa my\u00f6s kaikkiin muihin verkkosivustomme sivuihin, mik\u00e4 ei ole juuri sit\u00e4 mit\u00e4 haluamme.\n<\/p>\n
\n Joten t\u00e4t\u00e4 tarkoitusta varten WordPressin mukautetun sivumallin div-luokka muutetaan muotoon
class=\"site-content-fullwidth\"<\/code>.\n<\/p>\n\n Se n\u00e4ytt\u00e4isi jotain t\u00e4lt\u00e4, kuten alla on esitetty:\n<\/p>\n
![\"\"](\"https:\/\/inform.click\/wp-content\/uploads\/2022\/11\/post-285965-6382c23239d2d.webp\")
<\/a><\/p>\n\n Se voi lis\u00e4t\u00e4 404 sivua widget-palkeilla
\n<\/h5>\n\n 404-virhesivu on se tietty sivu, joka tulee n\u00e4kyviin, kun henkil\u00f6 laskeutuu jollekin sivulle verkkosivustolla, jota ei ole olemassa. Ehk\u00e4 se on viallinen linkki tai kirjoitusvirhe.\n<\/p>\n
\n On todella t\u00e4rke\u00e4\u00e4 lis\u00e4t\u00e4 n\u00e4m\u00e4 sivut verkkosivustollesi. Se osoittaa, ett\u00e4 olet vastuussa yleis\u00f6\u00e4 kohtaan.\n<\/p>\n
\n On vaikeaa koodata sivua tyhj\u00e4st\u00e4, jos et ole kovin perehtynyt koodauskykyihisi, niin on paljon parempi lis\u00e4t\u00e4 joitakin widgetej\u00e4 malleihisi. Sit\u00e4 voidaan muuttaa joustavasti vet\u00e4m\u00e4ll\u00e4 ja pudottamalla.\n<\/p>\n
\n Se tehd\u00e4\u00e4n 404.php-tiedoston avulla. Se ponnahtaa verkkosivustollesi, kun sit\u00e4 tarvitaan.\n<\/p>\n
\n Kun olet ladannut WordPress-verkkosivumallin verkkosivustolle, siirry eteenp\u00e4in kohti widget-alueen luomista.\n<\/p>\n
![\"\"](\"https:\/\/inform.click\/wp-content\/uploads\/2022\/11\/post-285965-6382c233d9dcb.webp\")
<\/a><\/p>\n\n Se helpottaa lis\u00e4\u00e4m\u00e4ll\u00e4 sivumallia mukautettujen viestityyppien n\u00e4ytt\u00e4mist\u00e4 varten
\n<\/h3>\n\n Mukautetut viestityypit ovat yksi tehokkaista tekniikoista esitell\u00e4 sis\u00e4lt\u00f6\u00e4, jolla on omat tietopisteet, suunnittelu ja muut vastaavat mukautukset.\n<\/p>\n
\n Luo ensin mukautettu viestityyppi – CPT, joka voidaan tehd\u00e4 helposti laajennuksen kautta tai manuaalisesti. ”Tyypit” -nimist\u00e4 laajennusta voidaan k\u00e4ytt\u00e4\u00e4 mukautettujen viestityyppien ja mukautettujen kenttien luomiseen.\n<\/p>\n
- \n
- \n
- \n
- \n