Artikkeli on päivitetty 24.11.2025
Olemme käyttäneet Oxygen Builderia jo useita vuosia aktiivisesti eri asiakasprojekteissa. Jopa nämä sivut, jota luet tällä hetkellä, on rakennettu Oxygen Builderin avulla. Oxygen on sivunrakentaja-lisäosa WordPressiin, joka on selkeästi kehitetty hieman harjaantuneemmille kotisivujen rakentelijoille. Oxygenin vahvuus on siinä, että se antaa muokata sivun PHP:tä, Javascriptiä ja CSS:ää suoraan builderista. Tämä ei ehkä kuulosta heti niin hienolta, mutta lue eteenpäin niin avaamme tätä juttua tarkemmin.
Huom! Oxygen Builder tai kukaan muu ei ole maksanut meille tämän blogiartikkelin kirjoittamisesta.
Historia lyhyesti
Softlyy-yritys julkaisi ensimmäisen version vuonna 2016. Idea oli julkaista sivunrakentaja, joka antaa käyttäjälle mahdollisimman paljon valtaa ja voimaa muokata sivujansa suoraan WordPressin kautta. Projekti on edennyt vuosien varrella vauhdilla ja vakiinnuttanut paikkansa ammattilaisten työkaluna. Nykyään Oxygen Builder on kypsä tuote (versio 4+), joka tukee natiivisti niin Gutenberg-integraatiota, WooCommercea kuin dynaamisia repeater-kenttiäkin.
Oxygen Builder ja teemat
Oxygen Builderin erikoisuus on sen lähestymistapa teemoihin: se poistaa WordPress-teemat kokonaan käytöstä. Oxygen ei ole myöskään itsessään teema, vaan lisäosa. Tämän sivunrakentajan avulla rakennat siis koko sivustosi ulkoasun alusta asti itse, ilman teeman tuomia rajoitteita tai turhaa koodia.
Sivun luominen Oxygen Builderilla
Havainnollistaaksemme Oxygenin toimintaa, käymme läpi tyypillisen workflow'n.
Normaali työnkulku sisältää ensin sivun ylätunnisteen (header) ja alatunnisteen (footer) templaatin rakentamisen ja sitten itse sivun sisällön rakentamisen. Oxygen Builderissa voit rakentaa templaatteja, jotka periytyvät automaattisesti sivuston eri osiin. Näiden templaattien päälle on helppo rakentaa varsinainen sisältö.
Kun header on rakennettu, alle lisätään "Inner Content" -elementti, joka renderöi dynaamisesti WordPressin sivulle syötetyn sisällön. Näin voimme asettaa Headerin näkymään joka sivulla samassa kohtaa ja sivuston sisällön asettumaan sen sisään oikein.
Oxygen Builderissa on itsessään mukana suuri valikoima valmiita elementtejä, joiden avulla sivujen rakentaminen nopeutuu. Pystyt tallentamaan omia luomuksiasi "Reusable parts" -osioon. Näin voit rakentaa useasti toistuvia elementtejä (kuten Call-to-Action -lohkot) ja nopeuttaa työtäsi.
Rakentelu on perusteiltaan yksinkertaista, mutta vaatii ymmärrystä web-kehityksestä, kun halutaan monimutkaisempia efektejä. HTML-, Javascript- ja PHP-osaaminen on erittäin hyödyllistä tätä builderia käytettäessä.
10 Syytä miksi suosimme Oxygen Builderia
- Puhdas koodi: Sivuston koodi pysyy puhtaana, eikä ylimääräistä koodia ladata turhaan. Esimerkiksi Divi ja Elementor saattavat ladata vakiona paljon koodia, jota ei käytetä. Oxygenin kanssa sivustot latautuvat nopeasti, mikä on elintärkeää nykyaikaiselle SEO:lle.
- Kustomoitavuus: Globaalit värit, tyylit ja class-luokat helpottavat sivuston hallintaa. Jos huomaat projektin lopussa, että brändiväri muuttuu, voit päivittää sen yhdestä paikasta koko sivustolle.
- Koodin lisääminen: Oxygenissä on "Code Block" -elementti, joka antaa käyttäjän lisätä omaa PHP-, CSS- tai JS-koodia suoraan builderin sisällä ilman erillisiä lisäosia.
- Flexbox ja CSS Grid: Oxygen tukee natiivisti Flexboxia ja CSS Gridiä, mikä tekee responsiivisten ja modernien leiskojen rakentamisesta vaivatonta.
- CPT ja ACF yhteensopivuus: Voit rakentaa jokaiselle Custom Post Typelle oman templaatin ja tuoda Advanced Custom Fields (ACF) -dataa natiivisti builderin avulla.
- Repeater-elementti: Oxygenin repeater on loistava työkalu dynaamisten listauksien, kuten blogiarkistojen tai tuoteluetteloiden, rakentamiseen täysin kustomoidulla ulkoasulla.
- Uniikki ulkoasu: Sivut eivät näytä samalta kuin geneeriset teemapohjat. Koska rakennat kaiken itse, lopputulos on täysin uniikki.
- WooCommerce ja Gutenberg: Syvä integraatio näihin molempiin mahdollistaa verkkokauppojen ja asiakasystävällisten hallintapaneelien rakentamisen.
- Yhteisö: Oxygenin käyttäjäkunta koostuu pitkälti ammattilaisista. Facebook-ryhmissä ja foorumeilla keskustelu on teknistä ja ratkaisukeskeistä.
- Opetusmateriaalit: Oxygenin tiimi ja yhteisö tuottavat laadukkaita videoita, jotka auttavat monimutkaistenkin toteutusten tekemisessä.
WooCommerce-integraatio
Oxygen Builderin WooCommerce-integraatio mahdollistaa täysin kustomoitujen verkkokauppojen luomisen. Voit unohtaa standardit WooCommercen ulkoasut ja rakentaa tuotesivut, kassasivut ja arkistot visuaalisesti juuri sellaisiksi kuin haluat, hyödyntäen Oxygenin joustavia elementtejä.
Gutenberg-integraatio
Gutenberg-integraatio tuo Oxygen Builderilla rakennetut lohkot suoraan WordPressin lohkoeditoriin. Tämä on "game changer" asiakasprojekteissa: voit rakentaa sivuston rakenteen Oxygenilla, mutta antaa asiakkaan muokata tekstejä ja kuvia helpossa Gutenberg-näkymässä ilman, että heidän tarvitsee koskea monimutkaisempaan Oxygen-käyttöliittymään.
Oxygen vs Elementor
Miten Oxygen pärjää markkinajohtaja Elementoria vastaan? Tässä tiivistetty vertailu:
Oxygen Builderin vahvuudet
- Laaja muokattavuus ja täysi kontrolli koodiin.
- Puhdas koodi ja erittäin nopeat latausajat (Google Core Web Vitals tykkää).
- Parempi dynaamisen datan käsittely (Repeaterit, ACF).
- Elinkaarikustannukset usein edullisemmat pitkässä juoksussa (lisenssimallista riippuen).
Elementorin vahvuudet
- Matalampi aloituskynnys aloittelijoille.
- Valtava määrä valmiita lisäosia ja templateja.
- Sivujen rakentaminen on nopeampaa, jos ei vaadita pikselintarkkaa kustomointia.
Oxygenin heikkoudet
- Jyrkempi oppimiskäyrä.
- Vaatii enemmän ymmärrystä HTML/CSS-tekniikoista.
- Vähemmän "plug-and-play" -lisäosia kuin Elementorilla.
Päivitys: Aiemmissa versioissa puuttunut Undo/Redo -ominaisuus on nykyään vakiona Oxygenissä, joten virheiden korjaaminen on helppoa.
Lisenssi ja hinta
Oxygen Builder on tunnettu "Lifetime"-lisenssistään, eli maksat kerran ja saat päivitykset ja tuen ikuisesti (tarkista ajantasainen hinnoittelu aina virallisilta sivuilta, sillä ehdot voivat muuttua). Tämä poikkeaa useimmista kilpailijoista, kuten Elementorista, jotka veloittavat vuosittaista maksua.
Oxygen 6 (Beta) – Täydellinen uudistus
Kirjoitushetkellä (marraskuu 2025) Oxygen Builderista on saatavilla täysin uudenlainen versio 6, joka on parhaillaan julkisessa beta-testauksessa. Kyseessä ei ole vain tavallinen päivitys, vaan koko ohjelmisto on koodattu uudelleen alusta asti suorituskyvyn ja modernien web-standardien ehdoilla. Tämä "uusi Oxygen" tuo mukanaan valtavan harppauksen ominaisuuksissa: mukana on täysin uusi Webflow-tyylinen käyttöliittymä, natiivi tuki CSS-muuttujille, edistyneet interaktiot sekä tehokas komponenttijärjestelmä. On tärkeää huomioida, että täydellisen uudistuksen vuoksi versio 6 ei ole suoraan taaksepäin yhteensopiva vanhojen versioiden (ns. Oxygen Classic) kanssa, mutta se tarjotaan ilmaisena päivityksenä kaikille nykyisille lisenssinhaltijoille. Lue lisää tästä merkittävästä julkaisusta Oxygenin virallisesta tiedotteesta.
Yhteenveto
Suosimme selkeästi Oxygen Builderia vaativissa projekteissa. Elementor on edelleen hyvä valinta, jos olet aloittelija tai tarvitset perussivut erittäin nopeasti. Oxygenia suosittelemme sinulle, joka haluat täyden kontrollin sivuston koodiin, suorituskykyyn ja ulkoasuun, ja sinulla on jo kokemusta verkkosivujen tekniikasta.