✅ WEB- ja WordPress -uutiset, -teemat, -laajennukset. Täällä jaamme vinkkejä ja parhaita verkkosivustoratkaisuja.

WooCommercen koodaus: Johdanto

13

Tämä on aloittelijan kehittäjän johdanto WordPress WooCommerce -laajennukseen. Tässä viestissä tarkastellaan WooCommercen toiminnan perusteita ja kuinka voimme muokata sitä teemassamme tai laajennuksessamme koukkujen ja mallien avulla.

Ensinnäkin WooCommerce tarjoaa suurta joustavuutta teema- ja laajennuskehittäjille toimintojensa säätämisessä. Yksinkertaisia ​​muutoksia varten sinulla on yleensä vähintään kaksi vaihtoehtoa. Muokkaustavan valinta riippuu siitä, miten haluat työskennellä, kuinka joustavaa ja luettavaa koodisi tulee olla ja kuinka haluat jatkaa sivustosi tulevaa ylläpitoa, kun kyse on laajennusten (ja WordPressin) päivityksistä.

Ennen kuin alat tutkia WooCommercen toimivuuden muokkaamista koodin avulla, sinun tulee tarkistaa, onko se, mitä haluat saavuttaa, mahdollista muuttamalla asetuksia. WooCommerce sisältää valtavan asetussivun, jonka avulla voit muuttaa melko vähän. Uudemmissa versioissa WooCommerce on myös lisännyt ja siirtänyt lisäasetuksia WordPress Customizeriin. Täällä voit esimerkiksi säätää sarakkeiden määrää ja säätää joitain kassakenttiä.

WooCommerce-mallit

WooCommerce tarjoaa suuren joukon mallitiedostoja, jotka voit ohittaa teeman kehittäjänä. Voit tehdä tämän kopioimalla alkuperäisen WooCommerce-mallin teemakansioosi. Ja sitten teet muutokset teemasi tiedostoon.

Siirry WooCommerce-laajennuskansioosi kohteessa /wp-content/plugins/woocommerce/. Täältä löydät alikansion templates. Tiedostojen koko sisältö (niitä on paljon!), /wp-content/plugins/woocommerce/templates/mukaan lukien sen alikansiot, ovat kaikki mallitiedostoja, jotka voit ohittaa teemassasi.

Jotta WooCommerce löytää muokatut mallit, tarvitset teemasi juurihakemistoon alikansion nimeltä woocommerce. Jos teemasi slug on "awhitepixel", kansiosi pitäisi sijaita osoitteessa /wp-content/themes/awhitepixel/woocommerce/. Tämän kansion sisään voit sijoittaa muokatut kopiot WooCommercen mallitiedostoista. Muista, että alikansioissa olevat mallitiedostot on sijoitettava vastaaviin woocommerce-kansiosi alikansioihin. Esimerkiksi; WooCommercen ohittaminen /templates/single-product/add-to-cart/simple.phpedellyttää, että asetat kopiosi simple.phpteemasi /woocommerce/single-product/add-to-cart/kansioon.

Olet ehkä myös huomannut, että malleissa on paljon toimintoja ja suodattimia. Suurin osa niistä on täynnä do_action()s. WooCommercen optimaalisen käytön vuoksi sinun ei pitäisi poistaa mitään koukkuja malleista. Useimmissa tapauksissa voit harkita toimintojen muuttamista käyttämällä toimintoja ja suodattimia ohittaen mallien sijaan. Selitän miksi!

Tärkeä huomautus mallien ja laajennuspäivitysten ohittamisesta

Aloittelijalle mallin ohittaminen saattaa tuntua helpoimmalta ja intuitiivisimmalta korjaukselta. Miksi pelleillä koukkujen kanssa, jos voit muuttaa suoraan mallia, joka tulostaa muutettavan asian? Vastaus: Koska tämä strategia tuottaa enemmän työtä verkkokauppasi ylläpidon ylläpitämiseen.

WooCommerce päivittää usein, ja joskus ne päivittävät mallitiedoston. Jotta verkkokauppasi pysyisi ajan tasalla, sinun on päivitettävä myös teemasi ohitusmallitiedostot. Sinun on yleensä korvattava koko mallitiedosto uusimmalla päivitetyllä tiedostolla ja lisättävä sitten muutokset uudelleen. Tästä tulee nopeasti paljon vaikeampaa, jos et muista kaikkia tekemiäsi muutoksia. Ota se minulta, jolla on vuosien kokemus muiden kehittäjien WooCommerce-mallitiedostojen korjaamisesta laajennuspäivitysten aikana. Luota minuun, se ei ole hauskaa työtä!

Nyt kun tiedämme, että koukut ovat parempi strategia, katsotaanpa kuinka edetä siinä.

WooCommerce-koukut

WooCommerce tarjoaa valtavan määrän koukkuja, sekä toimintoja että suodattimia. Koukkujen käyttö on todella yksinkertaista!

Koukkujen avulla voit myös muuttaa paljon muutakin kuin vain mallien tulosta. Voit muokata tuotteiden hintoja, kassakenttiä tai saada verkkokauppasi tekemään jotain, kun tuote lisätään ostoskoriin.

Jos olet kehittämässä laajennusta, koukut ovat myös ainoa tapa edetä. Voit ohittaa vain teeman malleja, et laajennuksia. (Okei, on olemassa tapoja voittaa tämä, mutta se on hyvin harvinaista eikä sitä suositella).

Jos olet katsonut joitain WooCommerce-mallitiedostoja, sinun olisi pitänyt nähdä paljon do_action(). Nämä ovat koukkuja; tarkistuspisteitä, joihin voit liittyä ja lisätä koodisi tai muokata muuttujaa. Jos olet epävarma koukkujen toiminnasta, minulla on viesti, joka selittää tämän perusteellisesti.

Jos haluat tulostaa jotain, esimerkiksi tekstiä tai jotain vastaavaa, etsi toimintoja (do_action()). Jos esimerkiksi tulostat jotain ostoskorimalliin, voit valita, haluatko liittää sen woocommerce_before_cart, woocommerce_before_cart_table, woocommerce_before_cart_contents, woocommerce_cart_contents, woocommerce_cart_actions, woocommerce_after_cart_contents, woocommerce_after_cart_table, woocommerce_cart_collaterals, tai woocommerce_after_cart. Valitse vain se, joka on sijoitettu sinne, missä haluat tulostaa. Tämä on esimerkki tekstin näyttämisestä ennen taulukkoa ja lomaketta ostoskorisivulla:

add_action('woocommerce_before_cart', function() { _e('Here are the products you have added in the cart so far', 'textdomain'); });

Suodattimet (etsi apply_filters()) ovat tulosteen tai muuttujan muokkaamiseen. Yleinen suodattimien käyttö WooCommercessa on "Lisää ostoskoriin" -tekstin muokkaaminen ostopainikkeissa. WooCommerce tarjoaa tähän useita suodattimia, joiden avulla voit hallita tekstiä eri sivuilla. Voit esimerkiksi muokata tekstiä kauppasilmukassa tai yksittäisessä tuotenäkymässä. Suodattimet tarjoavat usein useita argumentteja lisähallintaa varten, esimerkiksi tuoteobjektin. Tässä on yksinkertainen esimerkki "Lisää ostoskoriin" -tekstien muuttamisesta yksittäisessä tuotenäkymässä:

add_filter('woocommerce_product_single_add_to_cart_text', function($original_text, $product) { return __('Buy this', 'textdomain'); }, 10, 2);

Tietäen koukkujen toiminnasta ja yksinkertaisesti katsomalla mallitiedostojen sisään voit löytää melko paljon helposti vaihdettavia toimintoja. Ilmeisesti WooCommerce tarjoaa paljon edistyneempiä muokkauksia, hintojen, maksutapojen, tuotteiden muunnoksia tai tuontia, kaikki mahdollista koukkujen avulla.

Johtopäätös

Tämän postauksen tarkoitus on antaa aloittelijalle perustiedot WooCommerceen muutosten tekemisestä ja muutosten tekemisen seuraukset. Suosittelen aina käyttämään koukkuja mallitiedostojen päällekirjoittamiseen, ellei se ole ehdottoman välttämätöntä.

Seuraava askel on sukeltaa edistyneisiin modifikaatioihin tutustumalla WooCommercen koukkuihin, prosesseihin ja objekteihin. Koska WooCommerce on suosituin verkkokauppaalusta, verkosta löytyy runsaasti resursseja ja koodiesimerkkejä. Katso myös luokka Woocommerce täällä tällä sivustolla saadaksesi lisää.

Tämä verkkosivusto käyttää evästeitä parantaakseen käyttökokemustasi. Oletamme, että olet kunnossa, mutta voit halutessasi kieltäytyä. Hyväksyä Lisätietoja