Nilalaman
- Inaayos
- Mga patok na produkto
- Ginagawa ang trabaho
- Pagtatanong sa database
- Pagpapabuti ng paghahanap sa WordPress para sa mga produkto
Ang artikulong ito ay unang lumitaw sa isyu ng 232 ng .net magazine - ang pinakamabentang magazine sa buong mundo para sa mga web designer at developer.
Parami nang parami ang mga website na bumabaling sa WordPress bilang kanilang CMS, na sabay na nagdaragdag ng bilang ng mga tindahan at mga negosyong online na ginagamit ito para sa kanilang mga pangangailangan sa ecommerce. Gamit ang isang pagsasama-sama ng mga plug-in ng ecommerce na magagamit para sa WordPress, ang WP e-Commerce ay nakatayo bilang isang istandardistadong solusyon - ito ay hindi kapani-paniwala malakas at napapalawak, at gumagana sa halos bawat tema na maaari mong maiisip.
Ang WP e-Commerce ay patuloy na lumalaki at, na may higit sa 1.3 milyong mga pag-download, ay may isang mabigat na pagsunod sa mga developer at masigasig na taga-disenyo na nagbibigay ng mga solusyon sa tunog na may mababang pag-unlad na bakas ng paa sa mga kliyente ng lahat ng mga uri at laki. Ang tutorial na ito ay napupunta sa kung paano i-set up ang WP e-Commerce at makamit ang karaniwang pag-andar nang hindi na magbabayad ng isang sentimo.
Inaayos
Masigasig ka, nasasabik at nakahanda para sa WordPress. Naka-install ka, nakabukas at tumatakbo at hindi makapaghintay upang makuha ang iyong shop sa web - ngunit hindi sigurado kung saan magsisimula. Kung nagamit mo na ang WordPress bago ka pa sanay sa admin area; kung hindi, ihahanda ka namin upang magbenta nang mas mabilis kaysa sa iniisip mo.
Upang mai-install ang ulo ng e-Commerce ng WP sa plug-in manager sa admin ng WordPress at hanapin WP e-Commerce. Hit i-install; ngayon ang kailangan mo lang gawin ay mag-click buhayin.
Kapag na-install mo na makikita mo ang isang bagong item sa menu na may label Mga produkto; ang pag-click dito ay magpapakita sa iyo ng isang walang laman na katalogo ng mga produkto. Maaari kang magdagdag ng mga produkto dito at ngayon, na para sa natitirang tutorial na ito ay isang magandang ideya dahil tatakbo kami sa pamamagitan ng kung paano makuha ang mga pinakatanyag na produkto at magdagdag ng paghahanap ng produkto nang hindi nagbabayad para sa mga e-Commerce na gintong cart ng Ekstra.
Mga patok na produkto
Maaaring mukhang halata na magkaroon ng pagpapaandar na 'tanyag na mga produkto', ngunit ang WP e-Commerce ay hindi kasama nito bilang default - sa kabutihang-palad ito ay isang simpleng piraso ng pag-andar upang likhain. Para sa kapakanan ng iyong negosyo ang cross-selling ay mahalaga; mahalaga din sa iyong mga customer na mayroon silang kaaya-ayang karanasan sa pagbili, at ang pagpapakita ng mga tanyag na produkto ay mahusay na paraan upang mas mahusay ang mga benta at pagbutihin ang karanasan ng gumagamit.
Kailangan naming i-edit ang mga tema pagpapaandar.php upang isama ang aming pasadyang pagpapaandar. Magsusulat kami ng isang pagpapaandar na nagdaragdag ng pag-andar ng 'tanyag na mga produkto' at isang shortcode upang matawagan ang pagpapaandar na mid-post / pahina.
Ginagawa ang trabaho
Gumagamit ako ng napakatalino na tema ng Sticks & Stones ni Tipsy & Tumbler - napaka-tumutugon at mahusay na gumagana sa WP e-Commerce diretso sa labas ng kahon. Dahil ang tema's pagpapaandar.php ay malaki na ngunit lilikha kami ng isang bagong file na tinawag mga function-addons.php, na i-save namin sa parehong direktoryo tulad ng functions.php. Mahahanap mo ang mga file na ito sa wp-nilalaman / tema / sticksandstones.
Bago kami makarating sa code, ang paraan ng mga mas bagong bersyon ng WP e-Commerce na trabaho ay kapag ang isang gumagamit ay nagdagdag ng isa sa iyong mga item sa kanilang cart at dumaan sa pag-checkout, isinusulat ng plug-in ang mga item sa talahanayanp_wpsc_cart_contents - samantalang ang mga mas nakatandang pag-ulit ay sumulat sa database sa pagdaragdag sa cart.
Pagtatanong sa database
Upang makuha ang mga tanyag na produkto mula sa database kailangan nating gumawa ng dalawang bagay: ilantad ang pagpapaandar ng WordPress sa pagpapaandar, at pagkatapos ay sumulat ng isang query sa MySQL upang tipunin ang mga produkto at mag-order sa kanila ayon sa dalas ng pagbili:
// Ilantad ang databaseglobal $ wpdb; // Kunin ang mga resulta na $ popular_products = $ wpdb-> get_results ("SELECT 'prodid', SUM (dami) MULA sa '{$ wpdb-> preview} wpsc_cart_contents' GROUP BY 'prodid' ORDER BY 'dami' DESC LIMIT {$ atts ['limit']} ", ARRAY_A);
Inilalantad namin ang karaniwang WordPress database adapter sa pagpapaandar, na nagbibigay sa amin ng kakayahang magtanong sa database at i-format ang mga resulta. Maaari na nating baguhin ang data sa paraang komportable kami. Alang-alang sa kadalian ay iniwan ko ang format bilang isang associate ng array.
Ang pangalawang bagay na ginagawa namin ay gamitin ang MySQL na built in na pag-andar ng SUM, na binibilang ang kabuuang bilang ng mga halaga ng isang patlang - at ang aming pangatlong aksyon ay ang pag-pangkatin ang mga item nang magkasama sa pamamagitan ng mga ID ng produkto upang hindi kami makakuha ng mga duplicate sa mga resulta at hindi mapatunayan ang mga resulta.
Ngayon ay maaaring mukhang nagawa na natin ang halos lahat ng gawain - at sa paraang mayroon tayo; ang masakit na bahagi ay wala sa paraan - ngunit ang pag-andar ay hindi natapos. Kailangan naming iproseso ang data na mayroon kami sa isang format na parehong semantiko at nababaluktot upang magamit sa buong aming bagong shop.
Ang pamamaraan na ginagamit namin upang magawa ito ay sa pamamagitan ng pagsulat ng isang loop na pupunta sa data at ilalabas ang aming pinakatanyag na mga produkto. Upang maipatupad ang aming loop ay ginagamit namin ang code sa ibaba, na kung saan ay isinasapersonal ang produkto mula sa hanay ng data na nakuha namin mula sa aming query - nangangahulugang maaari naming isulat ang bawat isa nang mabilis, madali at mahusay.
// Loop through the results? Phpforeach ($ popular_productions as $ item) {$ product = get_post ($ item [’prodid’]); $ the_title = $ product-> post_title; $ the_image = get_the_post_thumbnail ($ item [’prodid’]); $ the_price = the_product_price ($ item [’prodid’]); $ the_link = get_permalink ($ item [’prodid’]);}?>
Titingnan namin ang loop ngayon kasama ang ilang HTML at ipaliwanag ko ang mga pagpapaandar ng WordPress sa paggamit ko sa kanila. Maraming mga tagabuo na gumagamit ng WordPress ang hindi nakakaalam ng mga pagpapaandar na ito at sumulat ng kakila-kilabot na code bilang isang polyfill, na nagpapabagal sa buong site. Manatili lamang ako sa isang layout ng dalawang haligi para sa HTML: ito ay medyo pamantayan para sa karamihan ng mga pahina ng produkto. Ang code na ito ay napupunta sa loob ng loop:
div> a>? php echo $ the_title?> / a> a href = "? php echo $ the_link?>"> span>? php echo $ the_image?> / span> span> span> From only / span>? php echo $ the_price?> / span> / a> / div>
Maaaring napansin mo ang isang pagpapaandar na tinawag sa isang nakaraang code block na pinangalanan ang_product_price. Ang pagpapaandar na ito ay napaka-simple: ibabalik lamang nito ang presyo ng produkto. Tumatagal ito ng dalawang argumento, at kung pumasa ka sa pangalawa makakakuha ka ng special_price. Sa WP e-Commerce ito ay simpleng presyo ng pagbebenta, na maaari mong makita sa pahina ng admin ng produkto. Ang unang argumento ay ang ID ng produkto, na isang natatanging numero na ibinigay sa bawat produkto.
i-andar ang_product_price ($ id, $ special_price = false) {kung ($ special_price) {return wpsc_currency_display (get_post_meta ($ id, ’_ wpsc_spesyal_price ', true)); } iba pa {return wpsc_currency_display (get_post_meta ($ id, ’_wpsc_price’, true)); }}
Ngayon upang magamit ito bilang isang shortcode sa loob ng iyong mga pahina (ang mga shortcode ay hindi gumagana sa mga post para sa ilang kadahilanan) kailangan mo lamang ng isang linya ng code - ito ay isa pa sa mga mahiwagang pag-andar ng WordPress. Ang unang pagtatalo ng add_shortcode Ang pagpapaandar ay isang string na gagamitin mo sa loob ng iyong pahina; ang pangalawang argumento ay ang pangalan ng pag-andar na natapos lamang nating magsulat.
// Idagdag ang shortcodeadd_shortcode ('popular_productions', popular_productions);
Pagpapabuti ng paghahanap sa WordPress para sa mga produkto
Ang pagkuha ng paghahanap sa WordPress upang i-rock ang iyong mga medyas sa halip na pagsuso ng mas mahirap kaysa sa isang vacuum ay maaaring maging isang malaking gawain na gawain kung kailangan mo ng isang bagay na detalyado ngunit may mga mas madaling paraan upang magawa ito. (Palaging isang mas madaling paraan upang gumawa ng isang bagay!)
Ang mga susunod na bersyon ng WordPress at WP e-Commerce ay nagbibigay-daan sa iyo upang maghanap ng mga produkto dahil idinagdag sila bilang mga pahina, samantalang sa mas matandang bersyon ng WP e-Commerce sila ay isang hiwalay na mesa at magkakahiwalay na uri ng post - kabuuan, isang bangungot. Sa ngayon, sa kabutihang palad, ang paghahanap ay 'gumagana lamang' - ngunit lamang, kaya't palalawakin namin ang paghahanap upang isama ang mga kategorya at mga tag upang mabigyan ang iyong mga mamimili ng pinakamahusay na karanasan na posible kapag nagba-browse sa iyong online shop.
Ipagpalagay na nagdaragdag ka ng mga produkto sa iyong shop at natagpuan mo na ang pahina ng mga kategorya sa loob ng lugar ng admin (sa ilalim ng Mga produkto menu na tiningnan namin nang mas maaga sa tutorial), at naidagdag mo ang iyong mga kategorya at iyong mga produkto sa kanila, maaari kaming magpatuloy at simulang ipasadya ang aming form sa paghahanap at pahina ng mga resulta. Gagawin nitong madali hangga't maaari para makakuha ang iyong mga mamimili mula sa bisita hanggang sa paglalagay ng pera sa iyong bulsa.
Ang WordPress ay may ilang mga kakatwang terminolohiya pagdating sa paghahanap ng mga tukoy na larangan, tulad ng mga kategorya na hindi talaga kategorya - tinatawag silang taxonomy at dahil dito kailangan naming gumawa ng isang espesyal na query upang mailabas sila! Kaya upang makilala ang aming mga layunin ay ipasadya namin ang form sa paghahanap upang magsama ng isang bagong larangan.
Una kailangan naming buksan ang aming template ng form sa paghahanap sa aming tema: tinatawag ito searchform.php (kung wala kang isa sa iyong folder ng tema, lumikha ng isa). Ipapasadya namin ang form - magbubukas ng form ng form na tulad nito:
form id = "searchform" action = "/">
Ang aksyon ay nakatakda sa root dahil awtomatiko na matutukoy ng WordPress ang query sa paghahanap at ilalagay ang template para dito. Idaragdag namin ngayon ang aming mga patlang ng paghahanap sa katawan ng form:
uri ng pag-input = "text" name = "s" placeholder = "Keywords" />
Ito ang default na patlang ng paghahanap sa WordPress. Ang pangalang s ay ang parameter ng paghahanap na ginagamit ng WordPress upang maghanap sa nilalaman at pamagat ng bawat post. Bagaman pinapasadya namin ang paghahanap ang parameter na ito ay maghahanap pa rin sa katawan at pamagat ng mga pahina ng produkto.
Ang placeholder ang katangian ay ang default na teksto na, sa pagsisimula mong mag-type, ay mawawala at awtomatikong lilitaw muli kung wala kang naipasok; kakailanganin itong kontrolin ng JavaScript ng iyong tema. Ginagawa na ito ng tema ng Sticks & Stones para sa mga browser na hindi sumusuporta sa mga cool na katangian. (Tumingin ako sa iyo, Internet Explorer.)
Magdagdag tayo ng isa pang larangan upang maaari nating hanapin ang mga kategorya na naidagdag namin:
uri ng pag-input = "text" name = "term" placeholder = "Mga Kategorya" />
Gagamitin namin ang patlang sa itaas upang maghanap sa aming mga taxonomiya ng produkto. Ang termino ng pangalan ay ang katangian ng default na paghahanap sa WordPress para sa mga taxonomiya; ang iyong mga produktong WP e-Commerce ay nasa ilalim ng isang uri ng post at ang kanilang mga kategorya ay isang pasadyang taxonomy.
Sa wakas, idagdag natin ang aming ipasa pindutan at isara ang form tag na sinimulan namin sa itaas. Ito ang lahat ng hindi kapani-paniwalang karaniwang mga bagay - ngunit huwag mag-alala: papalapit kami sa talagang cool na piraso na binabago ang paraan ng paghahanap ng WordPress at makuha ang nais namin mula rito.
uri ng pag-input = "isumite" pangalan = "isumite" id = "searchsubmit" halaga = "Paghahanap" /> / form>
Tama, iyon ang form namin na alagaan. I-save ito at i-upload ito - makikita mo ang iyong bagong form na lilitaw kung saan ang mga form sa paghahanap ay dating.Tingnan natin ngayon ang pag-andar sa paghahanap ng WordPress - ang gagawin namin ay pagdaragdag ng isang filter sa pagpapaandar ng paghahanap na kumukuha ng mga resulta na tumutugma sa aming pasadyang mga taxonomiya. Tila talagang mahirap gawin, ngunit talagang tumatagal lamang ng limang mga linya ng code; masasabi mong mas madali ito kaysa sa pag-set up ng WordPress.
Buksan mo ang iyong pagpapaandar.php at idagdag ang sumusunod na bloke ng code sa ilalim nito - Ipaliwanag ko ang code pagkatapos:
function search_by_tax_filter (& $ query) {if ($ query-> is_search) $ query-> itakda ('taxonomy', 'wpsc_product_category');} // Idagdag ang filteradd_action ('parse_query', 'search_by_tax_filter');
Maaaring hindi ito magmukhang magkano, ngunit talagang marami itong ginagawa - tulad ng sinasabi nila, ang magagandang bagay ay nagmumula sa maliliit na mga pakete.
Ang ginagawa namin dito ay upang magtrabaho mula sa ibaba pataas. Nagdagdag kami ng isang filter hook sa system ng hook ng WordPress. Nangangahulugan ito na mabisang inilagay namin ang isang tagapakinig sa system at nakikinig kami tuwing bumubuo kami ng isang query (iyon ang bawat pag-load ng pahina sa pagkakataong ito).
Ngayon, palagi akong nag-opt para sa ganitong uri ng pamamaraan mula nang gumamit ng bago WP_Query pinipinsala ang natitirang mga query ng pahina, nangangahulugang lahat ng uri ng mga nakatutuwang bagay ay mangyayari. (Iyon ay, kung tao ka tulad ng aking sarili at bawat iba pang developer - at nakalimutan mong idagdag ang wp_reset_query () tumawag sa pagtatapos ng pagpapaandar na lumilikha ng bago WP_Query.)
Ito ang lahat ng mga uri ng kasiyahan - ngunit dahil gumagamit kami ng isang function ng WordPress upang mabago ang pag-uugali ng WordPress, iniiwasan namin ang paggawa ng anuman sa back-broken labor. Inaalagaan nito ang sarili.
Ang pagpapaandar sa itaas, kung saan nagdaragdag kami ng hook, sinusuri kung ang query na aming pinapatakbo ay isang query sa paghahanap (hindi isang pangkaraniwang query). Pagkatapos ay nagdagdag kami ng isang bagong sugnay sa paghahanap sa query na kasalukuyang ginagawa nito - nais lamang namin ang kategorya ng produkto ng e-Commerce (ang termino para sa paghahanap ay nagmula sa aming form form) na lilitaw sa mga resulta.
Ngayon ay gumagana na ang aming paghahanap kailangan naming gumawa ng ilang mga bagay dito upang gawin itong tunay na kapaki-pakinabang, dahil kung susubukan mo ito sa pamamagitan ng pagpunan lamang ng kategorya makakakuha ka ng isang listahan ng lahat ng iyong mga post ngunit walang mga produkto. Dahil hindi kami nakapasok ng isang termino para sa paghahanap - at hindi ito binibilang ng WordPress bilang isang wastong paghahanap kaya itinatakda ang variable na is_search sa hindi totoo, nangangahulugang ang aming query ay hindi kailanman nabago at ang mga resulta ay hindi wasto.
Ito ay mas mababa sa kapaki-pakinabang, kaya ang kailangan nating gawin ay ang pag-redirect ng aming paghahanap sa pahina ng mga kategorya at ilista ang mga produkto sa loob doon kaysa baguhin ang pandaigdigang pag-uugali ng WordPress. Ang kadahilanang nais namin ng pag-redirect ay hindi namin nais na i-edit ang pangunahing pag-uugali ng WordPress, dahil hindi namin mai-update at sa gayon ay maaaring magpakilala ng mga isyu sa seguridad (din ang kakulangan ng mga pag-update ay nangangahulugang nawawala namin ang mahalagang seguridad mga pag-aayos at pag-update ng tampok).
Kaya't tingnan natin kung paano makuha ang kategorya bilang isang tiyak na go-to para sa pag-redirect at patakbuhin ang mga paghahanap na ito nang maayos para sa lahat ng iyong mga mamimili.
Una kailangan nating malaman kung mayroon tayong wastong paghahanap o wala. Kung wala kaming wastong kategorya dapat namin itong itakda bilang aming query sa paghahanap at magsagawa ng isang paghahanap doon. Ito ay sa pamamagitan ng default ay walang babalik at ang iyong na-format na 'walang mga resulta' na pahina, o kung nakakahanap ito ng isang bagay ipapakita nito na: lahat ng mga anggulo ay pinangangalagaan.
Tingnan natin kung paano natin susuriin ang string ng query, muling gumagamit ng mga kawit. Alam ng WordPress kung paano alagaan ang WordPress kaya't panatilihin natin ito. Magsimula sa pamamagitan ng pagbubukas ng isang function na katawan sa pagpapaandar.php at idaragdag ang code na ito dito:
function fix_empty_search ($ query) {global $ wp_query; kung (mag-isyu ($ _ GET [’s’]) && walang laman ($ _ GET [’s’])) {
Ang code sa itaas ay gumagawa ng tatlong bagay: una, susuriin nito ang isang parameter ng paghahanap sa URL at pagkatapos ay susuriin kung mayroon itong halaga. Kung naipasa nito ang antas ng pagpapatunay mayroon kaming isang kandidato para sa pag-check sa loob ng WP e-Commerce kung ito ay isang wastong kategorya upang mag-redirect.
Upang suriin kung mayroon kaming wastong kategorya ginagamit namin ang sumusunod na bloke ng code:
if (get_term_by ('slug', $ wp_query-> query_vars ['term'], 'wpsc_product_category')) wp_redirect ("/? wpsc_product_category = {$ _ GET ['term']}"); else $ query-> set ( 's', $ _GET ['term']);
Gumagamit ito ng pagpapaandar ng WordPress get_term_by upang suriin kung mayroon ang kategorya. Kung gagawin ito, ibabalik ng pagpapaandar ang isang bagay na naglalaman ng mga detalye ng kategorya, at kung wala ito babalik ito hindi totoo, na kung saan ay perpekto para sa aming maliit na tseke. Kung ang function ay hindi bumalik hindi totoo wastong kategorya ito, at ginagamit namin ang wp_redirect pagpapaandar upang mai-redirect ang gumagamit sa pahina ng kategorya - at kung hindi ito wastong kategorya, isasagawa muli nito ang paghahanap gamit ang kategorya bilang termino para sa paghahanap sa pag-asang makahanap ang gumagamit ng isang bagay na malapit sa hinahanap nila.
Tuklasin ang pinakamahusay na libreng mga tema ng WordPress para sa mga tagadisenyo sa aming kapatid na site, ang Creative Bloq.
