Kävijä kirjoittaa hakukyselyn sivustosi hakupalkkiin ja... ei mitään. Tyhjä sivu. Tai seinä linkkejä, joissa ei ole mitään järkeä: katkaistuja otsikoita, sekavia päivämääriä, nolla osuvuutta. Henkilö poistuu. Silti hän osoitti jo kiinnostusta, tuli omasta aloitteestaan ja kirjoitti itse hakusanan.

Tavallinen WordPress-haku toimii minimiperiaatteella: se etsii osumia artikkelien otsikoista ja sisällöstä, dumppaa seinän tuloksia ja toteaa homman hoidetuksi. Kirjoitusvirhe? Tyhjä ruutu. Kahden sanan haku? "AND"-logiikka joustavan osittaisen täsmäytyksen sijaan. Ei termien korostusta, ei ehdotuksia, ei live-hakua.

Ongelma on korjattavissa noin tunnissa. Viisi kohdennettua parannusta muuttaa haun teknisestä jäänteestä yleisön pitotyökaluksi. Käymme sen läpi askel askeleelta: tietyt lisäosat, koodi, asetukset ja skenaariot eri tarpeisiin.

💡 Pikakatsaus:

• Näytä hakukysely tulossivulla
• Lisää haettujen termien korostus tuloksiin
• Ota käyttöön kirjoitusvirhe-ehdotukset "Tarkoititko"-toiminnolla
• Näytä lohko suositeltuja sivuja ja hakulomake
• Toteuta live-AJAX-haku pudotusvalikkoehdotuksilla

Mikä on hakutulossivu ja miksi se kannattaa räätälöidä

Kun lukija kirjoittaa sanan tai lauseen sivustosi sisäänrakennettuun hakuun, WordPress luo sivun, joka listaa kyselyä vastaavan sisällön. Tämä on hakutulossivu.

Toisin kuin Google, sisäinen haku indeksoi vain sivustosi sisällön. Mutta käyttäjien odotukset pysyvät samoina: osuvat tulokset, selkeä navigointi ja välitön palaute. Ilman näitä he lähtevät. Wpbeginner.comin tilastot osoittavat, että sisäistä hakua käyttävät vierailijat muuttuvat tilaajiksi ja ostajiksi 2-3 kertaa useammin kuin ne, jotka vain selaavat sivuja. Mutta vain, jos haku todella toimii.

WordPress antaa sinun parantaa hakua ilman syvällistä ohjelmointia. Viisi askelta alla, viisi konkreettista parannusta. Jokaisen voi toteuttaa erikseen tai yhdistää täydeksi kokonaisuudeksi kerralla.

5 Askelta fiksuun WordPress-hakuun

Ennen kuin teet mitään muutoksia, varmuuskopioi sivustosi. search.php- ja functions.php-tiedostojen kanssa työskentely ei ole monimutkaista, mutta varovaisuus ei ole koskaan pahitteeksi.

1. Hakukyselyn näyttäminen tulossivulla

🔗 Search & Filter WordPress.orgissa

Ensimmäinen asia, jonka Googlen käyttäjä näkee haun jälkeen, on vahvistusrivi: "Noin X tulosta haulle '...'". Tämä ei ole pelkkää koristelua; se on signaali siitä, että järjestelmä ymmärsi syötteen ja käsitteli sen. Jos tuloksia ei ole, on selvää, että ongelma on sanamuodossa, ei rikkinäisessä sivustossa.

Kopioi tämä lähestymistapa. Näytä tulosten yläpuolella rivi, kuten "Löytyi 15 tulosta haulle: hakukyselysi". Kaksi toteutustapaa:

Search & Filter -lisäosan avulla. Ilmainen, toimii tavallisen WordPress-haun päällä. Ota asetuksissa käyttöön hakukyselyn näyttäminen tulosten yläpuolella. Lisäosa antaa kävijöille myös tulosten lajittelun: päivämäärän ja otsikon mukaan ilmaisversiossa, mukautettujen kenttien ja taksonomioiden mukaan Pro-versiossa.

Manuaalisesti search.php-tiedoston kautta. Luo lapsiteema (yksityiskohtainen opas artikkelissamme WordPress-lapsiteeman luomisesta). Kopioi search.php pääteemasta lapsiteemaan. Korvaa otsikko seuraavalla:

1
<h1 class="search-title">
2
<?php echo $wp_query->found_posts; ?> <?php _e( 'Search Results Found For', 'locale' ); ?>: "<?php the_search_query(); ?>"
3
</h1>
4

Tallennuksen jälkeen tulossivu avautuu tekstillä "Löytyi X tulosta haulle:...". Käyttäjä ymmärtää kontekstin välittömästi, mikä vähentää todennäköisyyttä, että hän poistuu turhautuneena.

2. Hakutermien korostuksen lisääminen

🔗 Highlight Search Terms WordPress.orgissa

Kun joku silmäilee hakutuloksia, hänen on sekunnin murto-osassa päätettävä, onko tulos olennainen. Haettujen sanojen korostaminen keltaisella tussilla (kuten Google tekee) ratkaisee tämän välittömästi. Silmä havaitsee värin, päätös on tehty.

Highlight Search Terms -lisäosa tekee juuri tämän. Konfigurointia ei tarvita: asenna, aktivoi, valmista. Konepellin alla se käärii löydetyt termit <mark class="hilte term-N">-elementin sisään. Se tukee läpiklikkauskorostusta (korostus säilyy, kun siirryt artikkeliin) ja on yhteensopiva WooCommercen, bbPressin, BuddyPressin ja Search & Filter Pron kanssa.

Yksi varoitus: CSS. Jotta korostus näkyy kaikissa selaimissa, lisää tämä sääntö Mukauttajassa (Ulkoasu → Mukauta → Oma CSS):

1
.hilte { background-color: #FFF176; }

Edistyneille käyttäjille: jokainen hakulausekkeen sana saa oman luokan: term-0, term-1 ja term-2. Voit tyylitellä eri sanat eri väreillä, jos suunnittelusi sitä vaatii.

3. Kirjoitusvirhesuojan käyttöönotto "Tarkoititko"-toiminnolla

🔗 Relevanssi WordPress.orgissa

Kirjoitusvirhe hakukyselyssä, ja tavallinen WordPress-haku nostaa kätensä pystyyn: nolla tulosta. Vierailija ei tiedä, mikä meni pieleen. Todennäköisesti hän poistuu.

Relevanssi on yksi vanhimmista ja luotettavimmista WordPressin hakulisäosista, jolla on yli 100 000 aktiivista asennusta. Se korvaa oletushakumekanismin kokonaan ja lisää osittaisen täsmäytyksen: kysely "cacheing" löytää sivut, joilla on "caching", "cache", "cached". Mikä tärkeintä, se näyttää "Tarkoititko..."-lohkon, joka ehdottaa korjattua kirjoitusasua, kun tarkkoja osumia ei ole.

Mitä ilmaisversio muuta osaa:

• Indeksoi kommentit, shortcodet, mukautetut kentät ja taksonomiat
• Järjestää tulokset relevanssin, ei päivämäärän mukaan
• Tukee hakua avainsanojen ja kategorioiden perusteella

Premium-versiossa on hienosäätöisemmät indeksointiasetukset, mutta ilmaisversio riittää tyypillisille sivustoille. Asennus on vakio: Lisäosat → Lisää uusi → "Relevanssi" → Asenna → Ota käyttöön. Käyttöönoton jälkeen mene Asetukset → Relevanssi ja napsauta "Rakenna indeksi" sisällön alkuindeksointia varten.

4. Vierailijoiden pelastaminen tyhjiltä tuloksilta

🔗 Better Search WordPress.orgissa

Turhauttavin skenaario: vierailija syöttää kyselyn, saa tyhjät tulokset, ja... siinä kaikki. Umpikuja. Ei vihjettä siitä, mitä tehdä seuraavaksi, ei hakupalkkia kokeillakseen eri sanamuotoa. Välilehti suljetaan, menetit hänet.

Better Search ratkaisee tyhjien tulosten ongelman. Se on kevyt lisäosa, joka korvaa oletushaun kahdella hyödyllisellä ominaisuudella:

• Suosittujen kyselyjen lämpökartta: widget tai shortcode, joka näyttää, mitä sivustollasi haetaan eniten. Toimii navigoinnin keskuksena.
• AJAX Live Search: tulokset ilmestyvät kirjoittaessasi (valinnaisesti määritettävissä).

Lisäosa käyttää MySQL FULLTEXT-indeksejä nopeaan hakuun, toimii hyvin välimuistilisäosien kanssa eikä vaadi koodin muokkaamista. Ilmaisversio kattaa otsikot, sisällön, tiivistelmäkentät, metakentät, kirjoittajat, avainsanat, taksonomiat ja kommentit.

🔗 Ivory Search WordPress.orgissa

Jos teemastasi puuttuu hakulomake tulossivulta, lisää sellainen erikseen. Ivory Search (entinen Add Search To Menu) tekee tämän parilla napsautuksella: asenna → Ivory Search → Valikko → valitse "Lisää navigointivalikkoon". Hakupalkki ilmestyy valikkoon ja tulossivulle.

Ivory Searchin ilmaisversio sisältää: AJAX-haun, WooCommerce-tuotehaun, mukautetut sisältötyypit ja mediatiedostot, tiettyjen sivujen poissulkemisen tuloksista, ulkoasun mukauttamisen Customizerin kautta ja hakuanalytiikan.

Kaksi lisäosaa (Better Search tulosten laatuun ja Ivory Search lomakkeeseen) kattavat "tyhjät tulokset" -skenaarion kokonaan: vierailijat näkevät suosittuja kyselyjä ja voivat heti syöttää uuden.

5. Live AJAX -haun toteuttaminen

🔗 Ajax Search Lite WordPress.orgissa

Live-haku tarkoittaa, että tulokset ilmestyvät pudotusvalikkona suoraan hakupalkin alle kirjoittaessasi. Ei sivun siirtymiä, ei "Enter → odota → katso → takaisin". Käyttäjä kirjoittaa "cach" ja näkee jo "WordPress Caching W3 Total Cachen kanssa", "Kuinka korjata välimuistivirhe" ja 5 muuta relevanttia sivua.

Ajax Search Lite on suosittu ilmainen lisäosa live-WordPress-hakuun, jolla on 4,5★ arvosana satojen arvostelujen perusteella. Ominaisuudet:

• Haku otsikoista, sisällöstä, tiivistelmäkentistä, kategorioista, avainsanoista ja mukautetuista kentistä
• Kategoria- ja sisältötyyppisuodattimet suoraan pudotusvalikossa
• 10+ sisäänrakennettua teemaa värien mukautuksella
• Tulosten välimuistitus nopeampia toistuvia kyselyjä varten
• Google Analytics -integraatio ja hakutapahtumat
• Mobiilisopeutus

Asennus: Lisäosat → Lisää uusi → "Ajax Search Lite" → Asenna → Ota käyttöön. Käyttöönoton jälkeen korvaa oletushaku: Ajax Search Lite → Yhteensopivuusasetukset → "Korvaa oletushaku". Valitse sivustosi ulkoasuun sopiva teema, ja live-haku toimii.

🔗 Toolset Search kehittäjän verkkosivustolla

Jos sivustosi on rakennettu Toolsetilla ja käytät mukautettuja sisältötyyppejä, joissa on monimutkaisempia kenttärakenteita, harkitse Toolset Searchia. Tämä on kaupallinen ratkaisu, joka on räätälöity Toolset-ekosysteemiin: haku mukautetuilla kenttäsuodattimilla, tulokset ruudukkona, listana tai karttana, sivutus, AJAX-päivitykset tuloksiin ja sijaintisuodattimet.

Useimmille sivustoille Ajax Search Lite kattaa live-haun tarpeet ilmaiseksi. Toolset Search on järkevä silloin, kun haku on sivustosi ydintoiminto: luettelot, tietokannat, ilmoitushakemistot.

⁉️🤔 Usein kysytyt kysymykset

Pitäisikö search.php-tiedostoa muokata käsin vai käyttää lisäosia?

Lisäosia useimmissa tapauksissa. search.php-tiedoston manuaalinen muokkaus on perusteltua, kun tarvitset jotain hyvin spesifiä: räätälöityä tulosasettelua tai integraatiota epästandardin teeman kanssa, ja sinulla on käytettävissäsi kehittäjä. Tyypillisiin parannuksiin lisäosat saavuttavat saman lopputuloksen ilman riskiä teeman rikkoutumisesta seuraavassa päivityksessä. Search & Filter, Highlight Search Terms ja Better Search eivät ole ristiriidassa keskenään; kukin ratkaisee oman tehtävänsä.

Mistä tiedän, paraniko haku todella?

Ota käyttöön hakuanalytiikka. Ajax Search Litessä ja Ivory Searchissa on sisäänrakennetut kyselylaskurit. Better Search näyttää suosittujen kyselyiden tilastot hallintapaneelissa. Vertaa kahta mittaria ennen parannusten toteuttamista ja niiden jälkeen: hakua käyttäneiden kävijöiden prosenttiosuutta ja tyhjältä tulossivulta poistuneiden prosenttiosuutta. Jos ensimmäinen nousee ja toinen laskee, olet oikeilla jäljillä.

Hidastavatko hakulisäosat sivustoa?

Laadukkaat eivät hidasta. Ajax Search Lite välimuistittaa tulokset, Better Search käyttää MySQL FULLTEXT -indeksejä, Relevanssi rakentaa oman indeksinsä aktivoinnin yhteydessä ja päivittää sitä inkrementaalisesti. Havaittava hidastuminen on mahdollista vain erittäin suurilla sivustoilla (yli 100 000 artikkelia) indeksin alkuperäisen rakentamisen aikana, ja silloinkin kyse on kertaluonteisesta tapahtumasta. Tavallisella hostingilla, jossa on 5 000-10 000 artikkelia, ero sivun latausajassa lisäosan kanssa ja ilman sitä mahtuu mittausvirheen rajoihin.

Voinko käyttää vain yhtä lisäosaa kaikkeen?

Lähimpänä "kaikki yhdessä" -ratkaisua on Ivory Search: lomake, AJAX, mukautetut suodattimet, poissulkemiset, analytiikka. Mikään ilmainen lisäosa ei kuitenkaan kata samanaikaisesti termien korostusta, "Tarkoititko"-toimintoa ja reaaliaikaisia tuloksia. Käytäntö osoittaa, että yhdistelmä Ivory Search (lomake ja perustulokset) + Highlight Search Terms (korostus) + Relevanssi (älykäs haku ehdotuksilla) tuottaa lähes Google-haun tasoisia tuloksia, täysin ilmaiseksi.

Tarvitseeko hakua määrittää, jos sivustollani on alle 50 sivua?

Kyllä. Pienillä sivustoilla harvempi käyttää hakua, mutta ne jotka käyttävät, ovat motivoituneimpia kävijöitäsi. He etsivät tarkkoja tietoja: "yhteystiedot", "hinta", "toimitus". Jos haku ei löydä "Yhteystiedot"-sivua kyselyllä "yhteystiedot", kyse ei ole teknisestä häiriöstä, vaan menetetystä liidistä. Perusasetusten teko yhdellä lisäosalla, kuten Better Searchilla, vie 10 minuuttia ja maksaa itsensä takaisin ensimmäisen pelastetun kävijän myötä.

Mitä asentaa omaan käyttötapaukseesi: kolme skenaariota

Älä yritä toteuttaa kaikkea kerralla. Tässä on kolme skenaariota erilaisiin tarpeisiin ja aikabudjetteihin:

Minimi: 10 minuuttia. Better Search korvaa oletushaun relevanteilla tuloksilla ja lisää suosittujen kyselyiden lämpökartan. Sopii blogeille ja pienille sivustoille, joissa haku ei ole päätoiminto, mutta haluat sen toimivan kelvollisesti.

Optimaalinen: yksi tunti. Better Search + Highlight Search Terms + Ajax Search Lite. Laadukkaat tulokset, termien korostus ja reaaliaikainen haku samassa paketissa. Paras vaihtoehto sisältöprojekteille ja keskikokoisille sivustoille.

Maksimi: 2-3 tuntia. Relevanssi (Better Searchin sijaan) + Ivory Search (lomake ja analytiikka) + Highlight Search Terms + Ajax Search Lite. Kaupallisen sivuston tai verkkokaupan taso, jossa haku vaikuttaa suoraan myyntiin.

Älä viivyttele. Huono haku tarkoittaa hiljaisia menetyksiä joka päivä. Hyvä haku tarkoittaa kävijöitä, jotka löytävät etsimänsä ja jäävät.