✅ WEB ja WordPressi uudised, teemad, pistikprogrammid. Siin jagame näpunäiteid ja parimaid veebisaidi lahendusi.

Kuidas lisada WooCommerce’i tooteandmete metakasti kohandatud välju ja vahekaarte koodi järgi

19

Selles postituses õpime, kuidas lisada kohandatud metavälju WooCommerce’i tooteandmete metakasti; kuidas lisada välju ja kuidas lisada oma kohandatud vahekaart. Me käsitleme üksikasjalikult, kuidas välju lisada, kuhu neid lisada, kuidas neid salvestada ja lõpuks, kuidas neid kasutajaliideses kuvada.

Kohandatud väljade lisamine olemasolevatele paneelidele

Kõigepealt vaatame, kuidas olemasolevatele paneelidele välja lisada. Peame haakima kahte konksu; üks välja väljastamiseks ja teine ​​selle väärtuse salvestamiseks. Esimene konks sõltub sellest, millisel vahekaardil soovite oma välja kuvada.

Kuidas lisada WooCommerce'i tooteandmete metakasti kohandatud välju ja vahekaarte koodi järgi

Tooteandmete metakast

Pidage meeles, et vahekaartide nähtavus erineb olenevalt toote tüübist. Näiteks vahekaart „Üldine" eemaldatakse, kui lülitute rühmitatud tootetüübile. Seega peaksite mitte ainult arvestama, kuhu teie kohandatud väljad loogiliselt sobivad, vaid ka paneeli, mis on nähtav kõigi soovitud tootetüüpide jaoks. on kõige üldisemate saadaolevate konksude loend:

  • woocommerce_product_options_general_product_data("Üldine")
  • woocommerce_product_options_inventory_product_data("Inventar"
  • woocommerce_product_options_shipping("Kohaletoimetamine")
  • woocommerce_product_options_related("Lingitud tooted")
  • woocommerce_product_options_attributes("Atribuudid")
  • woocommerce_product_options_advanced("Täpsem"

Vormi sisendi lisamine

Mis puudutab vormisisendi väljastamist, saate vormisisestuse HTML-i käsitsi väljastada (nt <input type="text"...>), kuid WooCommerce pakub lihtsaid funktsioone mis tahes tüüpi väljade hõlpsaks lisamiseks. Soovitan neid kasutada. Vaata siit WooCommerce’i ülevaadet kõigist võimalikest sisestustüüpidest ja sellest, milliseid argumente saad väljundi juhtimiseks edastada.

Selle õpetuse osas lisan laoseisu vahekaardile lihtsa tekstisisestuse, et kirjutada igas pakendis olevate üksuste arv. Mis puutub võtmesse, millena teie kohandatud väärtus salvestatakse, lisage alati selle ette alakriips "_", minu puhul on see "_number_in_package":

Salvestage ja muutke toodet. Peaksite nägema oma kohandatud välja vahekaardi Varud allosas:

Kuidas lisada WooCommerce'i tooteandmete metakasti kohandatud välju ja vahekaarte koodi järgi

Allossa on lisatud kohandatud väli "Arv pakendis".

Märkus põllu nähtavuse kohta sõltuvalt toote tüübist

WooCommerce’i tooteandmete metakastis on palju Javascripti, mis peidab ja näitab nii välju kui ka vahelehti/paneele. Saate seda hõlpsasti kasutada, kui soovite, et teie väli oleks nähtav ainult teatud tootetüüpide puhul, lisades oma väljale konkreetsed klassinimed.

Oletame, et soovite, et teie välja kuvatakse ainult siis, kui toode on tüüp lihtne toode, või soovite, et see oleks peidetud, kui toode on muutuv toode. WooCommerce kuulab konkreetseid klassinimesid, nagu show_if_<producttype>ja, hide_if_<producttype>ning saate mitut klassi kombineerida, et täpsustada, millal teie väli peaks olema peidetud või nähtav.

Näiteks kui ma tahan, et mu väli oleks nähtav ainult lihtsate toodete puhul; Lisan selle väljale " wrapper_class" oma välja sisendisse:

Võite määrata wrapper_classka näiteks ‘ show_if_simple show_if_grouped‘, et väli oleks nähtav ainult nende toodete puhul, mis on kas lihtsad või grupeeritud. Proovige seda ise!

Kohandatud välja salvestamine

Praeguse seisuga ei salvestata midagi, mille sisestate oma väljale. Teeme seda järgmisena. Haakime PHP globaalse (vormi esitamise) woocommerce_process_product_metaväärtuse ja salvestame selle .$_POST

Lubage mul ülaltoodud koodi kiiresti selgitada. Saate välja lihtsalt salvestada, kasutades update_post_meta(), kuid WooCommerce’i uuemates versioonides on toote käitlemise metat oluliselt täiustatud. Kuni teil on tooteobjekt (selle saame, kui helistate wc_get_product()postituse ID-ga), saate hõlpsalt manipuleerida objekti mis tahes tooteteabega ja lõpuks helistada save()muudatuste värskendamiseks. See on väga kasulik, eriti kui soovite salvestada mitu välja – sellisel juhul ei pea te iga välja jaoks andmebaasitoiminguid käivitama, vaid viimane kord, kui helistate save().

Kasutage update_meta_data()objektil iga metaandmete jaoks, mida soovite salvestada.

Ülaltoodud funktsiooniga peaks teie väli nüüd salvestama, kui värskendate seda toote redigeerimisel! Samuti pange tähele, et kasutades välja väljastamiseks WooCommerce’i funktsioone, ei pea te enne välja väljastamist käsitsi välja väärtust hankima – see on täisautomaatne.

Kohandatud välja väljastamine kasutajaliidesesse

Esimene samm on välja selgitada, millist konksu soovite kohandatud välja väljastamiseks kasutada. WooCommerce pakub palju saadaolevaid konkse, et juhtida konkreetset kohta, kus soovite väljundit. Kui te pole kindel, vaadake plugins/woocommerce/templates/neid faile ja leiate hõlpsalt sobiva konksu. Võite ka malli alistada ja lisada mallisse väljundi, kuid alati soovitan selle asemel kasutada konkse.

Mis puutub minusse, siis ma tahan, et minu kohandatud väli väljastataks ühes tootes meta div sees – seal, kus WooCommerce väljastab SKU ja kategooria. Selleks kasutan konksu woocommerce_product_meta_start. Konksude sees (nagu peaaegu kõigi mallikonksude puhul) pääsete juurde globaalsele postitusobjektile. Järgin sama rusikareeglit nagu oma põllu päästmisel; kasutage get_meta()kohandatud välja saamiseks tooteobjektil:

Kohandatud vahekaardi ja paneeli lisamine tooteandmete metakasti

Kui soovite lisada kohandatud väljade kogu, mis loogiliselt kokku kuuluvad, võiks olla hea mõte rühmitada need kohandatud vahekaardile. Kohandatud vahekaardi lisamiseks tooteandmete metakasti peame haakima vahekaardi enda lisamise filtri ja konksu paneeli sisu väljastamiseks. Lõpuks peame oma põldude päästmiseks siiski lisama sama konksu nagu ülal.

Näiteks lisan ma kohandatud paneeli nimega "Lisainfo", kuhu tahan lisada tekstisisestuse, märkeruudu ja numbrisisestuse.

Esiteks filtreerime woocommerce_product_data_tabsja lisame oma vahekaardi selle massiivi.

Siin on mõned kasulikud argumendid. classSõltuvalt toote tüübist saate vahekaardi nähtavuse juhtimiseks kasutada näiteks klahvi " ". Kui see jäi kahe silma vahele, vaadake ülalmainitud jaotist väljade nähtavuse kohta. Kuid pidage meeles, et vahekaartidel peate esitama klassid massiivina, mitte stringina. Saate sisestada ka märgi priority, et otsustada, kus teie vahekaart peaks ilmuma. Kasutades nt 25, asetatakse vahekaart kohe pärast “Inventar”.

Vaikimisi kuvatakse teie vahekaardil mutrivõti ikoonina. Kahjuks pole (praegu) mingit võimalust seda filtri kaudu juhtida. Kui see on teie jaoks oluline, saate lisada administraatori CSS-i ja lisada vahekaardile teise klassi. Siin on ülevaade WooCommerce’is saadaolevatest ikoonidest.

Paneeli väljund

Järgmine samm on woocommerce_product_data_panelspaneeli sisu külge haakimine ja selle väljastamine. Oluline märkus on siinkohal väljundi alustamine divatribuudiga ida sama nimega atribuudiga, mille sisestasite vahekaartide võtmena (minu puhul ‘ additional_info‘). Sisu osas on see teie otsustada – võite lisada mis tahes HTML-i, kuid soovitan kasutada vormiväljade väljastamiseks WooCommerce’i funktsioone. Samad eelised põldude peitmisel või näitamisel töötavad ka siin.

Pärast salvestamist peaksite nüüd nägema vahekaarti ja selle sisu tooteandmete metakastis (kui toode pole muidugi väline toode).

Kuidas lisada WooCommerce'i tooteandmete metakasti kohandatud välju ja vahekaarte koodi järgi

Jääb üle vaid salvestada kohandatud väljadele sisestatud andmed ja selleks kasutame sama protsessi nagu ülal:

Märkus. WooCommerce’is kehtib üldreegel, mille kohaselt kõik märkeruudud salvestatakse kui " yes", kui need on märgitud, või tühja stringina, kui need on märkimata. Järgides WooCommerce’i reeglit ja salvestades märgitud märkeruudu kui " yes", tagab see, et minu woocommerce_wp_checkbox()välja praeguse väärtuse hankimisel töötab see ettenähtud viisil.

Järeldus

Selles postituses näitan, kuidas lisada oma kohandatud välju WooCommerce’i tooteandmete metakasti, kuidas neid salvestada, kuidas kontrollida nende nähtavust, ja näitan lihtsat näidet oma välja väljundi kohta kasutajaliideses. Näitasin ka, kuidas lisada metakasti kohandatud vahekaarti ja lisada sinna oma väljad. Loodan, et see aitas teil WooCommerce’i ise kohandada!

See veebisait kasutab teie kasutuskogemuse parandamiseks küpsiseid. Eeldame, et olete sellega rahul, kuid saate soovi korral loobuda. Nõustu Loe rohkem