Skip to content

Kaikki WordPressistä, web-kehityksestä — ja paljon muuta

✂️ 5 Vinkkiä katkelmien mukauttamiseen WordPressissä

✂️ 5 Vinkkiä katkelmien mukauttamiseen WordPressissä

Saavut blogisi etusivulle ja näet valtavia tekstimöhkäleitä, jotka venyvät kolmen ruudun yli. Lukija ei selaa kolmea ruutua yhden artikkelin takia, vaan poistuu. Tai päinvastoin: esikatselut katkeavat kesken lauseen, "Lue lisää" -linkki ei näy ja RSS-syöte näyttää lauseenpätkiltä ilman alkua tai loppua.

Oletuksena WordPress katkaisee poiminnat 55 ensimmäisen sanan kohdalta ja lisää tavallisen kolmen pisteen. Ei pituusasetuksia, ei linkkitekstin muokkausta, eikä poimintoja ole edes saatavilla sivuille. Kaikki tämä on korjattavissa, mutta ei valintaruutuja klikkaamalla, vaan lisäämällä muutaman rivin koodia.

Alla on 5 toimivaa tekniikkaa: poiminnan pituuden muuttamisesta koko sivustolle aina hienosäätöön kategorioittain ja "Lue lisää" -linkin automaattiseen lisäämiseen. Jokaisesta on valmis pätkä, jonka kopioit ja liität tiedostoon functions.php.

💡 Pikakatsaus:

  • Muuta poiminnan pituus koko sivustolle yhdellä funktiolla functions.php:ssa
  • Aseta eri pituuksia eri kategorioille käyttämällä in_category()-ehtoa
  • Lisää "Lue lisää" -linkki jokaisen poiminnan loppuun
  • Ota poiminnat käyttöön WordPress-sivuille yhdellä koodirivillä
  • Hallitse poimintoja ilman ohjelmointia lisäosalla Advanced Excerpt

Mitä poiminnat ovat WordPressissä ja miten ne toimivat

Poiminta on lyhyt kuvaus artikkelista, joka näkyy artikkelilistauksissa: etusivulla, kategoria-arkistoissa, hakutuloksissa ja RSS:ssä. Toisin kuin <!--more-->-tagi, joka katkaisee sisällön mielivaltaisesta kohdasta, poiminta on itsenäinen kokonaisuus: WordPress joko ottaa manuaalisen tekstisi "Poiminta"-metaboksista tai luo sen automaattisesti artikkelin 55 ensimmäisestä sanasta.

Manuaaliset poiminnat menevät aina etusijalle. Jos olet täyttänyt "Poiminta"-kentän editorissa, järjestelmä näyttää juuri sen, eikä huomioi automaattista katkaisua. Tämä antaa täyden hallinnan: voit kirjoittaa merkityksellisen tiivistelmän sen sijaan, että tyytyisit kahteen ensimmäiseen lauseeseen, jotka sattuvat olemaan tekstin alussa.

Ongelmana on, että "Poiminta"-metaboksi on oletuksena piilossa. Se otetaan käyttöön "Näyttöasetukset"-kohdasta (painike artikkelin muokkaussivun yläreunassa), laita rasti "Poiminta"-kohdan viereen, niin kenttä ilmestyy editorin alapuolelle. Sen jälkeen muokkaus alkaa: alla olevat viisi tekniikkaa kattavat kaikki tyypilliset tilanteet.

1. Poiminnan pituuden muuttaminen functions.php:n kautta

Tämä on perusta. WordPress katkaisee oletuksena 55 sanan kohdalta, mikä ei riitä selkeään esikatseluun, mutta riittää lukijalle aiheen ymmärtämiseen. Jos tarvitset enemmän (tai vähemmän), excerpt_length-suodatin ratkaisee tehtävän yhdellä funktiolla.

Mitä koodi tekee: ohittaa sanamäärän, jonka WordPress palauttaa funktiossa the_excerpt(). Ei koske manuaalisiin poimintoihin, jos olet täyttänyt kentän editorissa, se näkyy sellaisenaan.

  • Avaa functions.php teemassasi (Ulkoasu → Teemaeditori → functions.php) tai FTP:n kautta
  • Lisää tiedoston loppuun (ennen ?>-merkintää, jos se on olemassa):
1function my_excerpt_length($length) {
2 return 110;
3}
4add_filter('excerpt_length', 'my_excerpt_length');
  • Tallenna tiedosto

Numero 110 on sanamäärä. Tyypilliselle blogille 80-120 sanaa antaa 3-4 lausetta, mikä riittää merkitykselliseen esikatseluun kuormittamatta etusivua. RSS-lukijatkin arvostavat sitä: niillä on omat rajansa, ja liian pitkä poiminta saatetaan katkaista rajummin kuin suunnittelit.

Jos käytät lohkoteemaa (Block Theme, FSE), functions.php saattaa puuttua tai ei toimi odotetusti. Luo tällöin lapsiteema tai käytä Code Snippets -lisäosaa, se lisää pätkiä muokkaamatta teematiedostoja.

2. Eri poimintapituudet eri kategorioille

Uutiset tarvitsevat 30 sanaa, kun taas arvostelut ja oppaat tarvitsevat 100-120. excerpt_length-suodatin perusversiossaan antaa yhden arvon koko sivustolle, ei joustavasti. Seuraava koodi erottelee pituuden kategorian mukaan.

Skenaario A, yksi kategoria erikoispituudella. Sinulla on "Arvostelut"-kategoria, jossa poimintojen tulisi olla lyhyempiä:

1function excerpt_length_category($length) {
2 if (in_category('Reviews')) {
3 return 20;
4 } else {
5 return 60;
6 }
7}
8add_filter('excerpt_length', 'excerpt_length_category');

Korvaa Reviews kategoriasi polkutunnuksella, numerot sillä mitä tarvitset.

Skenaario B, useita kategorioita eri pituuksilla. if/elseif/else-ketju kattaa kolme tasoa: yhden kategorian, kategoriaryhmän ja kaiken muun:

1function excerpt_length_category($length) {
2 if (in_category('Review')) {
3 return 35;
4 } elseif (in_category(array('News', 'Videos', 'Editorial'))) {
5 return 60;
6 } else {
7 return 55;
8 }
9}
10add_filter('excerpt_length', 'excerpt_length_category');

in_category() hyväksyy kategorian polkutunnuksen (merkkijono) tai tunnusten taulukon. Ehdot tarkistetaan järjestyksessä, ensimmäinen osuma laukeaa. Yllä olevassa esimerkissä: "Review"-kategorian artikkelit saavat 35 sanaa, "News"-, "Videos"- ja "Editorial"-kategoriat saavat 60, kaikki muut saavat 55.

Tarkista tallennuksen jälkeen etusivu ja pari kategoriasivua, poimintojen pituuksien tulisi vaihdella sen mukaan, mihin kategoriaan artikkeli on liitetty.

3. Lisää "Lue lisää" -linkki poiminnan loppuun

Poiminta katkeaa, eivätkä lukijat aina ymmärrä, että tämä on vain esikatselu, ei koko artikkeli. Linkki poiminnan lopussa ratkaisee ongelman: selkeä kehotus klikata ja lukea kokonaan.

Esimerkki Lue lisää -linkistä WordPress-otteen lopussa

WordPress laittaa oletuksena [...] katkaisukohtaan, mutta se ei ole linkki. excerpt_more-suodatin korvaa kolme pistettä mukautetulla merkkijonolla, joka sisältää HTML:ää:

1function excerpt_readmore($more) {
2 return '... <a href="' . get_permalink($post->ID) . '" class="readmore">' . 'Read More' . '</a>';
3}
4add_filter('excerpt_more', 'excerpt_readmore');

Mitä voit muuttaa:

  • Linkkiteksti, korvaa Read More omalla versiollasi, esimerkiksi Continue reading tai Learn more
  • CSS-luokka, readmore class-attribuutissa voidaan korvata omallasi ja tyylitellä CSS:llä (väri, koko, välit, alleviivaus)
  • Erotin, kolme pistettä ja välilyönti '... ' ennen <a>-tagia voidaan poistaa tai korvata merkillä | tai ,

Avaa tallennuksen jälkeen blogin etusivu tai arkisto, jokaisen poiminnan lopussa on klikattava linkki koko artikkeliin. Tämä toimii myös RSS:ssä (useimmat lukijat näyttävät HTML-linkit oikein).

4. Ota poiminnat käyttöön WordPress-sivuille

WordPress-sivut eivät tue poimintoja suoraan paketista. page-sisältötyyppiä ei ole rekisteröity excerpt-tuella, eikä metaboksi näy editorissa, vaikka ottaisit sen käyttöön "Näyttöasetukset"-kohdasta. Mutta joskus sitä tarvitaan: aloitussivu, jossa on esikatselut alasivuista, mukautettu tulostus WP_Queryn kautta, palvelusivut kortteina.

Ratkaisu on yksi funktio, joka lisää poimintatuen page-sisältötyypille:

1function wploop_pages_excerpt() {
2 add_post_type_support('page', 'excerpt');
3}
4add_action('init', 'wploop_pages_excerpt');

Kun olet tallentanut functions.php-tiedoston:

  • Siirry minkä tahansa sivun muokkausnäkymään
  • Klikkaa yläreunan "Näytä valinnat" -painiketta
  • Valitse "Tiivistelmä"-ruutu, niin se tulee näkyviin
  • Vieritä sivua alaspäin, tiivistelmäkenttä on ilmestynyt

Jos käytät mukautettua sisältötyyppiä (CPT), korvaa page oman CPT:si polkutunnuksella, mekaniikka on sama. Kun rekisteröit CPT:n register_post_type()-funktiolla, voit määrittää suoraan 'supports' => array(..., 'excerpt') ja välttää ylimääräisen koodin.

5. Hallitse poimintoja Advanced Excerpt -lisäosan avulla

Etkö halua säätää koodin kanssa? Advanced Excerpt -lisäosa antaa visuaalisen hallinnan poimintojen kaikkiin osa-alueisiin hallintapaneelin kautta.

Advanced Excerpt -lisäosan asetussivu WordPressin hallintapaneelissa

Asennuksen ja aktivoinnin jälkeen (ilmainen, WordPressin lisäosavarastosta) "Asetukset"-valikkoon ilmestyy Advanced Excerpt -sivu, jossa on seuraavat vaihtoehdot:

  • Poiminnan pituus, merkkeinä tai sanoina. Merkit ovat tarkempia asettelun hallintaan, sanat luettavuuteen
  • Ellipsi, symboli tai HTML-koodi, joka päättää poiminnan. Oletus on &hellip; (ellipsi ). Voidaan korvata merkeillä [...], nuolella, kuvakkeella tai jättää tyhjäksi
  • Katkaisutapa, merkeittäin (sana voi katketa kesken) tai lauseittain (aina kokonainen lause, mutta poiminnasta tulee ilmoitettua rajaa pidempi)
  • "Lue lisää" -linkki, ota käyttöön/poista käytöstä, aseta teksti, kääri mukautettuun HTML:ään
  • Älä näytä manuaalisia poimintoja, jos käytössä, lisäosa luo poiminnat aina automaattisesti, vaikka olisit täyttänyt kentän manuaalisesti
  • Poista shortcodet poiminnasta, pidä tämä ehdottomasti käytössä, jotta [contact-form-7] tai [shortcode] eivät sojota esikatselussa
  • Suodatin, valitse mitä funktiota teema käyttää poimintojen tulostamiseen: the_excerpt(), the_content() tai molemmat. Jos et ole varma, jätä molemmat valintaruudut päälle
Lisäsuodatusasetukset Advanced Excerpt -lisäosassa

Lisäosa käyttää samoja excerpt_length- ja excerpt_more-koukkuja kuin vinkkien 1-3 manuaalinen koodi, mutta paketoi ne käyttöliittymään. Kehittäjädokumentaatio GitHub Wikissä kuvaa suodattimia mukautettua integrointia varten.

Vuonna 2026 lisäosa on käytössä yli 80 000 sivustolla, mutta päivittyy harvoin: viimeisin julkaisu tuli ulos tammikuussa 2024 ja se on testattu WordPress 6.4:ään asti. Ennen asennusta tuoreeseen WordPress-versioon, tarkista yhteensopivuus staging-ympäristössä.

Ennen usein kysyttyihin kysymyksiin siirtymistä, lyhyt video poimintojen kanssa työskentelystä WordPressissä käytännössä:

⁉️🤔 Usein kysytyt kysymykset

Miten manuaalinen poiminta eroaa <!--more-->-tagista?

Poiminta on erillinen kenttä, joka tulostetaan the_excerpt()-funktiolla teemapohjissa. <!--more-->-tagi lisätään artikkelin runkoon ja se katkaisee the_content()-funktion tietystä kohtaa. Poiminnat näkyvät artikkelilistauksissa ja RSS:ssä, more-tagi toimii vain siellä, missä the_content() on käytössä. Lyhyeen yhteenvetoon arkistoissa käytä poimintoja, pitkän artikkelin katkaisemiseen etusivulla more-tagi riittää.

Miksi poiminta ei näy, vaikka kirjoitin sen editorissa?

Teema ei kutsu the_excerpt()-funktiota tarvittavassa pohjassa. Tarkista archive.php-, category.php-, home.php- ja search.php-pohjat. Jos niissä on the_content(), manuaaliset poiminnat ohitetaan. Korvaa the_excerpt()-funktiolla tai käytä ehtorakennetta if (has_excerpt()) { the_excerpt(); } else { the_content(); }.

Voinko näyttää artikkelikuvan poiminnan vieressä?

Kyllä, teeman tulee kutsua the_post_thumbnail()-funktiota ennen the_excerpt()-funktiota loopissa. Useimmat modernit WordPress-teemat tekevät tämän oletuksena. Jos ei, lisää kuvan kutsu pohjaan ennen poimintaa. Mukautettua merkkausta varten kääri molemmat kutsut <div class="post-card">-elementtiin ja tyylittele CSS:llä.

Miten poistan poiminnat vain etusivulta, säilyttäen ne arkistoissa?

Käytä ehtotagia is_home() suodattimen sisällä. Esimerkiksi functions.php-tiedostossa:

1 function disable_excerpt_on_home($excerpt) {
2 if (is_home()) {
3 return '';
4 }
5 return $excerpt;
6 }
7add_filter('get_the_excerpt', 'disable_excerpt_on_home');

Tarkempia asetuksia sivutyypin, kategorian tai sisältötyypin mukaan saat käyttämällä Advanced Excerpt -lisäosaa vinkistä 5: sen asetuksissa on "Poista käytöstä..." -valintaruudut etusivulle, arkistoille, haulle ja yksittäisille sivuille.

Mitä tehdä poiminnoille juuri nyt

Toteutusjärjestys, yksinkertaisesta monimutkaiseen. Aloita vinkistä 1: yksi funktio, yksi numero, ja poiminnan pituus koko sivustolla on jo hallinnassa. Lisää sitten "Lue lisää" -linkki (vinkki 3), tämä on kriittistä klikattavuuden kannalta etusivulla ja RSS:ssä. Jos pyörität blogia, jossa on eri formaattien osioita, vinkki 2 pituudesta kategorioittain poistaa epäsuhdan uutisten ja pitkien artikkelien väliltä.

Ota Advanced Excerpt -lisäosa (vinkki 5), jos haluat välttää koodin kokonaan tai jos teemasi käyttää epästandardia tapaa sisällön tulostamiseen eivätkä excerpt_length/excerpt_more-suodattimet käynnisty. Muissa tapauksissa functions.php-tiedoston koodi on luotettavampi: vähemmän riippuvuuksia, ei aiheuta kuormaa, toimii minkä tahansa teeman kanssa.

1