📑 7 Parasta välilehtilisäosaa WordPressille 2026 (ilmaiset ja maksulliset)

Sisällötön sivu on kuin kirja ilman sisällysluetteloa. Vierailija selaa ja poistuu, koska ei näe, mistä vastaus hänen kysymykseensä löytyy.

Välilehdet ratkaisevat tämän ongelman: ne pakkaavat kolmen ruudun verran tietoa yhteen klikkaukseen kuormittamatta sivua. WooCommerce-verkkokaupassa tuotekuvaukset ja tekniset tiedot välilehdissä parantavat konversiota. Blogissa oppaat ja UKK-osiot välilehdissä pitävät lukijat pidempään mukana.

Tässä koosteessa on 7 WordPress-välilehtilisäosaa, jotka testasimme käsin testisivustolla kuormitettuna: kevyistä shortcode-ratkaisuista Gutenberg-lohkoihin ja WooCommerce-työkaluihin. Ei "kaikki mahdollinen" -sivunrakentajia, vaan ainoastaan lisäosia, jotka oikeasti toimivat välilehtien kanssa.

💡 Pikaopas:

• Lue artikkelin alussa oleva vertailutaulukko, se karsii heti sopimattomat vaihtoehdot pois.
• Valitse lisäosa tehtäväsi mukaan: WooCommerce → Custom Product Tabs, Gutenberg → Ultimate Blocks, sivupalkin toimintakehote → Simple Side Tab.
• Asenna lisäosa, lisää välilehdet artikkeliin tai sivuun shortcodella tai lohkona ja tarkista, miltä välilehdet näyttävät mobiilissa.

Lisäosien vertailutaulukko

Yllä olevalla videolla näytetään vaihe vaiheelta, miten välilehtiä lisätään WordPressissä vakioeditorin kautta. Sama periaate toimii kaikkien tämän koosteen lisäosien kanssa.

1. Tabs Responsive

Bootstrap-kehykseen perustuva lisäosa, joka on responsiivinen ja mobiiliystävällinen suoraan paketista. Näyttää sekä vaaka- että pystysuuntaiset välilehdet yhtä hyvin. Lisäät välilehdet [TABS_R id=xx]-shortcodella mille tahansa sivulle tai artikkeliin.

Välilehden sisällä voi olla tekstiä, kuvia, videota, musiikkia ja sisäkkäisiä shortcodeja. Sivupalkkia varten on erillinen widget. Ilmaisversio tarjoaa vedä ja pudota -kokoamisen, mukautetut kuvakkeet Font Awesomen kautta ja rajattoman määrän välilehtiä.

Plussat:

• Toimii WooCommercen kanssa, erillinen laajennus tuotevälilehdille.
• Pro-versiossa yli 20 mallipohjaa ja yli 500 Google Fonts -fonttia.
• Välilehtien järjestely vedä ja pudota -toiminnolla suoraan hallintapaneelissa.

Miinukset:

• WYSIWYG-editori joskus nollaa HTML-muotoilut, tarkista tallennuksen jälkeen.
• Pro-lisenssi yhdelle sivustolle, tuki kuudeksi kuukaudeksi.

Hinta: Ilmainen. Pro, $9 yhdelle sivustolle.

🔗 Tabs Responsive WordPress.orgissa🔗 Pro-version live-demo

2. Custom Product Tabs for WooCommerce

Kapea mutta tehokas työkalu: lisää mukautettuja välilehtiä WooCommerce-tuotesivuille. Vakio-välilehdet "Kuvaus", "Lisätiedot" ja "Arvostelut" voi poistaa tai täydentää esimerkiksi "Toimitus"-, "Kokotaulukko"- tai "Videoarvostelu"-välilehdellä.

Välilehden sisältö syötetään tavallisella WordPress-editorilla: teksti, HTML, kuvat, shortcodet. Tallennettuja välilehtiä sovelletaan useisiin tuotteisiin kerralla. Lisäosa on yhteensopiva WPML:n kanssa, mikä on kriittistä monikielisille verkkokaupoille.

Plussat:

• Laajentaa vakio-WooCommerce-haun mukautettujen välilehtien sisältöön.
• Välilehden otsikon globaali piilotus ilman ulkoisia suodattimia.
• Ilmaisversiota ei ole karsittu toiminnallisuuksista.

Miinukset:

• Vain WooCommerce, ei sovellu tavallisille artikkeleille ja sivuille.
• Tuki on käyttäjäarvioiden mukaan hidasta.

Hinta: Ilmainen. Pro, $29.99.

🔗 Custom Product Tabs WordPress.orgissa

3. Responsive Tabs

Kevyt shortcode-lisäosa WP Darkolta. Luot hallintapaneelissa joukon välilehtiä, joilla kullakin on oma otsikko ja sisältö, kopioit shortcoden ja liität sen minne tahansa. Ilmaisversiossa ei ole rajoituksia: voit muuttaa väriä, välilehtien järjestystä ja mobiilissa haitariksi vaihtamisen raja-arvoa.

Käytännössä tämä on nopein tapa lisätä välilehdet olemassa olevalle sivustolle: viisi minuuttia asennuksesta lopputulokseen. Tukee PHP 8:aa, yhteensopiva uusimman WordPress-version kanssa (testattu versioon 6.9.4 asti).

Hyvää:

• Ilmaisversio on täysin toimiva, ei keinotekoisia rajoituksia.
• Muuttaa välilehdet automaattisesti haitariksi kapeilla näytöillä.
• Tukee sisäkkäisiä shortcodeja välilehtien sisällä.

Huonoa:

• Pro-versio tuo lähinnä kuvakkeita ja tyylejä, ydin on yksinkertainen.
• Aikaisemmissa versioissa oli XSS-haavoittuvuuksia, päivitä versioon 4.0.11.

Hinta: Ilmainen. Pro, alkaen $19.99 per sivusto.

🔗 Responsive Tabs WordPress.orgissa

4. WP Tabs

ShapedPluginin lisäosa, jossa on kätevä shortcode-generaattori. Voit luoda rajattoman määrän välilehtiryhmiä, joilla kullakin on omat asetuksensa: värit, fontit, marginaalit, kuvakkeet. Valmis shortcode lisätään artikkeliin, sivulle tai widgettiin.

RTL-yhteensopivuus ja käännös useille kielille, plussaa monikielisille projekteille. Välilehdet vaihtuvat klikkauksella tai hoverilla, ja ne järjestetään vetämällä ja pudottamalla. Lisäosan toinen versio on kirjoitettu kokonaan uudelleen Gutenbergia varten.

Hyvää:

• Yli 30 tyylin mukautusvaihtoehtoa ilmaisversiossa.
• Shortcode-generaattori yhteensopiva kaikkien suosittujen sivunrakentajien kanssa.
• Selkeä ja intuitiivinen hallintapaneeli.

Huonoa:

• Välilehtien muokkaus vain hallintapaneelissa, ei visuaalista esikatselua sivulla.
• Pro-versio vuositilauksella, ei kertamaksulla.

Hinta: Ilmainen. Pro, alkaen $29/vuosi.

🔗 WP Tabs WordPress.orgissa🔗 ShapedPluginin sivusto

5. Tabby Responsive Tabs

Erittäin kevyt lisäosa minimalisteille. Ei hallintapaneelia, vain shortcodet tekstissä. Työpöydällä vaakasuuntaiset välilehdet, mobiilissa (kapea näyttö) ne tiivistyvät automaattisesti haitariksi.

Kehittäjät arvostavat: välilehdet mukautetaan CSS:llä, ne tukevat semanttista otsikkomerkintää (H1-H2 välilehden sisällössä parantaa hakukoneoptimointia) ja ovat näppäimistöllä käytettävissä. Font Awesome -kuvakkeet saa käyttöön yhdellä valintaruudulla. Useita välilehtiryhmiä yhdellä sivulla, ei ongelmaa.

Hyvää:

• Lataa juuri sen mitä tarvitaan, ilman ylimääräistä koodia.
• Näppäimistöllä käytettävä ja ruudunlukijaystävällinen.
• Haitari mobiilissa suoraan paketista.

Huonoa:

• Ei visuaalista editoria, vain CSS.
• Yksi asettelutyyppi: vaakasuuntaiset välilehdet.

Hinta: Ilmainen. Tabby Tabs Customizer, £24 yhdelle sivustolle tai £89 rajoittamattomalle määrälle.

🔗 Tabby Responsive Tabs WordPress.orgissa🔗 Cubecolour-sivusto

6. Ultimate Blocks

22 lohkon lisäosa Gutenbergille, joista yksi on "Tabbed Content". Kolme tyyliä valittavana: perinteiset välilehdet, "pillerit" ja alleviivaus. Värit, välilehtien järjestys ja ankkuri määritetään suoraan lohkoeditorin sivupalkista.

Välilehtien lisäksi Ultimate Blocks tarjoaa lohkoja arvosteluille, sisällysluettelolle, "Jaa"-painikkeille ja skeemamerkinnöille (UKK, HowTo). Arvosana 4,9 tähteä WordPress.orgissa ja yli 60 000 aktiivista asennusta. Täysin ilmainen, myös kaupalliseen käyttöön.

Plussat:

• Kolme välilehtityyliä (välilehdet, pillerit, alleviivaus), mihin tahansa ulkoasuun.
• 21 muuta hyödyllistä lohkoa mukana.
• Ilmainen ilman rajoituksia, myös kaupallisiin projekteihin.

Miinukset:

• Vain Gutenberg, ei toimi perinteisessä editorissa eikä sivunrakentajissa.
• Välilehtien muokkausmahdollisuudet rajoittuvat lohkoeditorin kehykseen.

Hinta: Ilmainen. Pro, 49 $/vuosi yhdelle sivustolle.

🔗 Ultimate Blocks WordPress.orgissa

7. Simple Side Tab

Yhden tehtävän niche-työkalu: lisää pystysuoran välilehden selainikkunan vasemmalle tai oikealle puolelle. Välilehti on kiinteä ja pysyy näkyvissä vieritettäessä, ihanteellinen toimintakehotteille: "Ota yhteyttä", "Portfolio", "Ilmoittaudu".

Ei grafiikkaa, vain CSS. Seitsemän vakiofonttia, rajaton väripaletti. Suodatus välilehden ehdolliseen näyttämiseen tietyillä sivuilla ja tekstin muuttamiseen koodilla. Lisäosa testattu WordPress 6.9.4:ään asti, päivitetty kuusi kuukautta sitten.

Hyvää:

• Lataa vain CSS:n, nollavaikutus nopeuteen.
• Toimii mobiilissa ilman ongelmia.
• Suodattimet mukautettua näyttölogiikkaa varten.

Huonoa:

• Yksi välilehti, ei pysty käsittelemään useampaa.
• Edistynyt mukauttaminen vaatii CSS:ää.

Hinta: Ilmainen.

🔗 Simple Side Tab WordPress.orgissa

Vertailu: shortcode, lohko vai widget?

Kolme lähestymistapaa välilehtien lisäämiseen ratkaisee eri ongelmia. Shortcode-lisäosat ovat universaaleja ja toimivat missä tahansa editorissa ja missä tahansa sivunrakentajassa: Tabs Responsive / Responsive Tabs / WP Tabs / Tabby. Lohkopohjainen Ultimate Blocks on räätälöity Gutenbergille visuaalisella konfiguroinnilla editorista poistumatta. Sivuvälilehti Simple Side Tab ei ole edes sisältövälilehtiä varten, vaan navigaatioon liittyvä toimintakehote, aina näkyvissä.

Custom Product Tabs on erillinen tapaus, se ei koske sivuja vaan WooCommerce-tuotteita. Tämä ei ole kilpailija kuudelle muulle lisäosalle, vaan täydennys mille tahansa niistä.

⁉️🤔 Usein kysytyt kysymykset

Voiko useita välilehtilisäosia käyttää samanaikaisesti?

Kyllä, mutta yhdellä varauksella. Eri lisäosat eivät yleensä ole ristiriidassa, jos ne eivät yritä hallita samoja välilehtiä. Käytännössä asennamme Custom Product Tabs -lisäosan WooCommerce-tuotteille ja WP Tabs -lisäosan blogisivuille, ne toimivat rinnakkain ongelmitta. Tarkista käyttöliittymä aktivoinnin jälkeen: jos välilehdet menevät päällekkäin tai asettelu hajoaa, poista toinen lisäosista käytöstä.

Miten välilehdet vaikuttavat hakukoneoptimointiin?

Google indeksoi välilehtien sisällön, jos se ladataan HTML:ään sivua renderöitäessä, ei AJAXilla klikkauksesta. Useimmat koosteen lisäosat: Tabs Responsive, WP Tabs ja Tabby renderöivät sisällön palvelinpuolella, se päätyy lähdekoodiin ja indeksoidaan. AJAX-lataus (WP Tab Widget, joka jätettiin koosteesta pois juuri tästä syystä) ei anna sisältöä indeksoijalle. Jos olet epävarma, avaa sivu JavaScript pois päältä ja tarkista, näkyvätkö välilehdet.

Millä korvata suljetut lisäosat, Easy Side Tab ja Oxilabin Tabs Plugin?

Easy Side Tab poistettiin WordPress.orgin luettelosta maaliskuussa 2023 sääntörikkomuksen vuoksi. Suora korvaaja, Simple Side Tab: sama sivuvälilehti, mutta aktiivisesti tuettu eikä riko ohjeita. Oxilabin Tabs Plugin suljettiin maaliskuussa 2024 haavoittuvuuden vuoksi. Sen sijaan Responsive Tabs WP Darkolta: ilmainen ilman rajoituksia, shortcode-pohjainen, automaattisella haitarilla mobiilissa.

Toimivatko välilehdet mobiililaitteilla?

Kyllä, kaikki koosteen lisäosat ovat responsiivisia. Tabby Responsive Tabs ja Responsive Tabs muuttavat vaakasuuntaiset välilehdet automaattisesti haitariksi kapeilla näytöillä. Simple Side Tab muuttaa sivuvälilehden kokoa ja marginaaleja mobiilinäyttöä varten. Tarkista oikeilla laitteilla: mikä näyttää kauniilta 1920 pikselillä, saattaa hajota 375 pikselillä.

Miten lisätä välilehtiä ilman lisäosaa, puhtaalla HTML/CSS/JS:llä?

Kirjoita HTML-merkintä, jossa on ul-lista otsikoille ja div-säiliöt sisällölle, liitä CSS :target- tai radio-temppua käyttäen ja minimaalinen JS luokkien vaihtamiseen. Koodi teeman functions.php-tiedostoon tai koodinpätkä-lisäosaan (Code Snippets). Vaihtoehto niille, jotka tarvitsevat täyden hallinnan merkinnästä ja nollariippuvuuden kolmannen osapuolen koodista.

Mikä välilehtilisäosa asentaa vuonna 2026?

Jos kyseessä on WooCommerce-verkkokauppa, Custom Product Tabs on vertaansa vailla. Se ei tee mitään ylimääräistä eikä varasta nopeutta.

Jos kyseessä on blogi Gutenbergilla, Ultimate Blocks: välilehdet plus kaksi tusinaa muuta hyödyllistä lohkoa, ilmainen ja visuaalisella konfiguroinnilla.

Jos sivusto on klassisella editorilla tai sivunrakentajalla, Tabs Responsive tai WP Tabs. Ensimmäinen on hyvä runsaan ilmaisen toiminnallisuuden vuoksi, toinen puhtaan käyttöliittymän ja shortcode-generaattorin ansiosta.

Jos tarvitset sivun toimintokehote-välilehden, Simple Side Tab. Markkinoilla ei ole mitään nopeampaa ja kevyempää.

Kokeile yhtä lisäosaa, asennus ja ensimmäinen välilehti vievät alle viisi minuuttia. Ei sopinut, poista ja asenna seuraava. Näin löydät työkalun, joka juurtuu projektiin.