Advertisement
  1. Code
  2. WordPress
  3. Plugin Development

Gumawa ng Iyong Sariling T-Shirt Shop Gamit ang Spreadshirt WordPress Plugin

Scroll to top
Read Time: 11 min

() translation by (you can also view the original English article)

Final product imageFinal product imageFinal product image
What You'll Be Creating

Pagbebenta ng Iyong T-Shirts

Nito lamang na taon, nagkaroon ako ng ideya na magbenta ng T-shirts laban sa lumalaking anti-social technology-oriented na lipunan. May naisip akong bagong konsepto, Sociables, at agad na nilagay ang ideya na iyon sa folder na inilarawan ni Jadah Sellner sa World Domination Summit (WDS) na naglalaman ng lahat ng sarili mong domains para sa iyong mga ideya sa negosyo na hindi mo na pinapansin.

Pagkatapos ay may natuklasan akong libreng plugin para sa Spreadshirt.com at napagpasyahan ko na isulat ang pagtuturong  ito ipakita ang buong proseso sa paglunsad ng iyong sariling tindahan ng WordPress-powered T-shirt.

Isa pang dumalo sa WDS, si Benny Hsu, ay sumulat kamakailan tungkol sa pagtayo ng negosyo sa T-shirt, Get Busy Living, para kumita ng $100,000 ng wala pang anim na buwan. Ang hangad ko ay marahil mas para sa tuwa ng pagtaguyod ng mensahe ng komunidad ng Sociables sa lumalaking mundo ng screen-focused kaysa sa kita at impluwensiya sa mundo:

Every Once in a While You Gotta Look Up From Your Phone - SociablesEvery Once in a While You Gotta Look Up From Your Phone - SociablesEvery Once in a While You Gotta Look Up From Your Phone - Sociables

Maraming iba’t ibang paraan para magbenta ng T-shirts online, at pakinabang at kawalan ng bawat isa nito. Si Hsu ay gumamit ng crowdfunding na serbisyo na tinatawag na Teespring na tatalakayin ko mamaya. Ang profit margins ay mas mataas sa serbisyo na katulad ng Teespring. Gayunpaman, gusto kong gumamit ng nakapaloob sa WordPress na tindahan, kung kaya pumunta ako sa Spreadshirt. Katulad ng CafePress, sa Spreadshirt mas madaling gumawa at mag-upload ng mga disenyo at magbenta ng mga kalakal. Kapag naibenta ang produkto, kikita  ka ng maliit na komisyon sa bawat benta.

Ang CafePress ay may taglay na API, subalit ang WordPress plugins (MoneyPress) ay mukhang hindi nasuri ng maayos. Kung kaya gusto ko sa bagong Spreadshirt at sariling Spreadshirt Plugin ng gumawa ng indy na si Thimo Grauerholz.

Spreadplugin the Spreadshirt plugin for WordPressSpreadplugin the Spreadshirt plugin for WordPressSpreadplugin the Spreadshirt plugin for WordPress

Sa pagtuturong ito ay ipapakita sa iyo ang lahat ng hakbang na isinagawa ko para mabuo ang Spreadshirt na tindahan at nailunsad ang WordPress site para sa aking Sociables na tindahan. 

Pagpili ng Iyong Tatak

Mayroong milyun-milyong konsepto ng T-shirt sa web. Hindi kita matutulungan sa iyong pananaw, subalit kapag mayroon ka na nito, kailangan mo ng domain at Twitter, Pinterest at Instagram na account. Isinantabi ko na ang mga pahina ng Facebook (dahil sa Facebook mahirap maabot ang mga tagahanga ng hindi nagbabayad) subalit si Hsu ay aktibong gumagamit ng anunsyo sa Facebook para bumenta.

Gumagamit ako ng Domainr para makahanap ng angalan ng domain para sa mga ideya ko sa negosyo. Nakuha na ang Sociables.com, subalit nariyan pa ang Sociables.io. Ang Domainr ay mayroon ding iOS app.  Napag-alaman ko na ang Gandi.net ang pinaka-matipid at gumaganang .io na domain registrar. Mayroon ng @Sociables sa Twitter, kaya doon ako sa @ SociablesIo.

Pagpili ng WordPress Theme

Nagtingin ako sa google at naghanap ng ThemeForest para sa t-shirt shop  na mga disenyo at sa huli ay pinili ang Armonico sa halagang $58. Samantalang habang hindi ko gagamitin ang WooCommerce features (dahil gusto kong ang Spreashirt ang bahala sa kaganapan ng aking produkto), gusto ko ang disenyo at linis  na handog ng Amonico. Mabilis din silang sumagot sa aking mga tanong sa pre-sale support at nagbigay ng siguradong 30 araw na maibabalik ang pera.

Armonico Theme for WordPress on Theme ForestArmonico Theme for WordPress on Theme ForestArmonico Theme for WordPress on Theme Forest

Pagkuha ng Magdi-disenyo

Hindi ako graphic designer kung kaya pumunta ako sa lokal na Pacific Northwest na tao na nakatrabaho ko dati.  Tinatawag niya ang kanyang sarili na Pope, a isa siya sa mga tao na naglalaan ng isang buwan sa Burning Man at pumapasok at mamalagi pansamantala sa lungsod. Siya din ay mabilis at mahusay na graphic designer na dalubhasa sa WordPress, at sa totoo lang ay nagpapatakbo din ng sariling niyang tindahan ng T-shirt. Kumuha siya ng ilan sa aking conceptual na mga ideya at tinulungan akong isakatuparan ang mga ito:

Looking for me on Tinder t-shirt concept for SociablesLooking for me on Tinder t-shirt concept for SociablesLooking for me on Tinder t-shirt concept for Sociables

Paalala: Kasalanan ito ng limitado kong badyet sa disenyo na hindi ko nahingi sa kanya ang hindi pamputi, hindi panlalaking modelo ng T-shirt.

Mag-sign up sa Spreadshirt

Una, kailangan mong mag-sign up sa Spreadshirt.com:

Register at SpreadshirtRegister at SpreadshirtRegister at Spreadshirt

Pagkatapos, bisitahin ang create a shop wizard:

Create a shop at SpreadshirtCreate a shop at SpreadshirtCreate a shop at Spreadshirt

Pumili ng kulay at layout para sa  Spreadshirt-hosted na tindahan. Hindi naman ito ganoon ka-importante dahil igigiya mo ang iyong site visitors sa iyong WordPress-powered na tindahan:

Choose Color and Layout of Shop at SpreadshirtChoose Color and Layout of Shop at SpreadshirtChoose Color and Layout of Shop at Spreadshirt

Pangalanan at Ilarawan ang iyong tindahan:

Set Name Language and Currency at SpreadshirtSet Name Language and Currency at SpreadshirtSet Name Language and Currency at Spreadshirt
Kailangan mong gumawa ng sample na produkto. Gumawa ako ng pansamantalang disenyo ng placeholder:
Create Design Sample at SpreadshirtCreate Design Sample at SpreadshirtCreate Design Sample at Spreadshirt

Kailangan  mo itong makita kapag tapos ka na:

Create a Shop at Spreadshirt FinishedCreate a Shop at Spreadshirt FinishedCreate a Shop at Spreadshirt Finished

Mayroon ding API ang Spreadshirt kung saan kailangan mo ng access para sa plugin. Mag-sign up mula sa kanilang blog:

Spreadshirt API KeysSpreadshirt API KeysSpreadshirt API Keys

Tandaan ang iyong API Keys, na gagamitin mo sa mga susunod para i-configure ang plugin:

Get Your API Keys - SpreadshirtGet Your API Keys - SpreadshirtGet Your API Keys - Spreadshirt

Pag-set up ng Iyong Hosting

Pinapagana ko ang Sociables sa Digital Ocean dahil mura ito at naghahatid ng mabilis na SSD drives para sa hosting. Makikita mo ang aking visual guide sa pagi-install ng WordPress sa Digital Ocean dito. Kahit anong Vanilla WordPress na installation ay maaari. Habang maaari mong i-integrate ang WP-Spreadplugin sa iyong dati ng WordPress site,ang pagtuturong ito ay nakatuon sa paggawa ng standalone na WordPress-powered na tindahan ng T-shirt mula sa wala.

Pag-install ng Iyong Tema

Una, kailangan mo ng tema. Pinili kong bilhin ang Armonico sa ThemeForest, sa halagang $58:

Install the Armonico ThemeInstall the Armonico ThemeInstall the Armonico Theme

Bilang bahagi ng pagi-install ng Armonico theme, hihingan ka na mag-insall ng ilang ibang plugins:MP Isotopes at MP Core. Magbibigay ito sa iyo ng links sa mga ito sa loob ng administrative dashboard. Nalaman ko din na may nakita akong ilang bugs maliban na lang kung i-install ko ang WooCommerce.  Subalit hindi ko kailangang gamitin ang kahit na anong features ng WooCommerce.

Tandaan: Kung mapagpasyahan mo na gamitin ang WooCommerce, kung ganoon ikaw ang responsable sa pagbabayad at paghatid ng produkto. Ang maganda dito sa serbisyo ng tindahan ng T-shirt ay kaya nitong ayusin lahat ng ito.

Pagkatapos, nag-install ako ng ibang plugins na madalas kong irekomenda: Yoast SEO, Google Analytics, Contact Form 7, at Mailgun.  Ang dalawang huli ay ginamit ko para palakasin ko ang aking contact form emails—ang Tuts+ na pagtuturo ay malapit ng gumamit nito, kung kaya tingnan sa aking instructor page; ito ay nakatakdang lumabas sa December 16th, 2014.

Idagdag ang Spreadshirt Plugin sa WordPress

Ngayon, ii-install natin ang Spreadshirt Plugin para sa WordPress. Ginawa ito ni Thimo Grauerholz. Nagpapatakbo siya ng T-shirt site na may custom na bersyon nito sa Lovetee. Si Thimo ay mapagbigay din at mabilis sumagot sa tanong ko sa email.

Lovette - Sample Spreadshirt ShopLovette - Sample Spreadshirt ShopLovette - Sample Spreadshirt Shop

Mula sa dashboard, magdagdag ng bagong plugin at hanapin ang WP-Spreadplugin:

Install the Spreadplugin for SpreadshirtInstall the Spreadplugin for SpreadshirtInstall the Spreadplugin for Spreadshirt

Pindutin ang Install Now at i-activate ito:

Activate the Spreadplugin for SpreadshirtActivate the Spreadplugin for SpreadshirtActivate the Spreadplugin for Spreadshirt

Pag-upload ng Iyong Mga Disenyo sa Spreadshirt

Bago natin magamit ang Spreadplugin, kailangan nating i-upload ang mga disenyo sa Spreadshirt at create products:

Upload art for your design at SpreadshirtUpload art for your design at SpreadshirtUpload art for your design at Spreadshirt

Pumuli ng disenyo na gusto mong i-upload:

Confirm trademark at SpreadshirtConfirm trademark at SpreadshirtConfirm trademark at Spreadshirt

Pangalanan at lagyan ng tag ang disenyo:

Describe the design for SpreadshirtDescribe the design for SpreadshirtDescribe the design for Spreadshirt

Kailangan mo itong makita pagkatapos ma-upload ng bawat disenyo:

Design complete at SpreadshirtDesign complete at SpreadshirtDesign complete at Spreadshirt

Gumawa ng Mga Kategorya

Kailangan din nating gumawa ng mga kategorya sa Spreadshirt. Gumawa ako ng kategorya para sa bawat disenyo para kapag ang tao ay nagpindot sa home page ng Sociables, makikita nila ang panlalaki at pambabaeng T-shirts para sa disenyo, halimba tinder, talks to strangers, at iba pa.

Create Categories at SpreadshirtCreate Categories at SpreadshirtCreate Categories at Spreadshirt

Tandaan ang bawat numero ng ID ng bawat kategorya, dahil gagamitin  mo ang mga ito pag nilagay mo ang Spreadshirt plugin shortcode sa mga post ng WordPress para sa bawat disenyo. 

Gumawa ng mga Produkto sa Spreadshirt

Sumunod, gumawa tayo ng mga produkto ng isahan para sa lalaki at isahan para sa babae. Piliin ang uri ng t-shirt, kasarian at kulay sa Spreadshirt product designer:

Create more Products at SpreadshirtCreate more Products at SpreadshirtCreate more Products at Spreadshirt

Mula sa pahina ng mga Produkto sa Spreadshirt, ilagay ang mga pares ng produkto sa naaayong katergorya. Halimbawa, para sa "Looking for Me on Tinder", nilagay ko yung mga produkto ng panlalaki at pambabae sa kategorya ng tinder na ginawa ko.

Add Your Products to CategoriesAdd Your Products to CategoriesAdd Your Products to Categories

Paggawa ng Iyong Tindahan sa WordPress Armonico 

Ngayon maaari tayong bumalik sa paggawa ng ating tindahan sa WordPress. Ang home page ng Armonico ay iniikot ang slider at pinipili ang mga produkto na nasa parisukat sa ibaba mula sa mga posts na nasa ginawa mong kategorya.

Gumawa ng Kategorya mula sa Iyong Mga Produkto

Una, gumawa ako ng kategorya ng mga produkto:

Add a category to WordPressAdd a category to WordPressAdd a category to WordPress

Paggawa ng Pahina Para Sa Mga Produkto

Pagkatapos ay gumawa ako ng mga posts para sa produkto para sa aking bawat disenyo. Inilagay ko ang mga ito sa kategorya ng mga produkto. At nilagay  ko ang Spreadplugin shortcode na nakasaad ang kategorya ng ID mula sa tindahan ko sa Spreadshirt.com kung saan ay tinukoy natin sa itaas:

Create Product Pages in WordPressCreate Product Pages in WordPressCreate Product Pages in WordPress

Narito ang shortcode:

1
[spreadplugin shop_category="yourid"]

Mas maraming dokumentasyon para sa WP-SpreadPlugin dito.

Kailagan mo ding i-set ang featured image na gusto mong makita sa home page slider:

Set the Featured Image for Your PostSet the Featured Image for Your PostSet the Featured Image for Your Post

At ang panghuli, kailangan mong bumalik sa pahina ng Spreadplugin Options at gawin uli ang cache. Maaari mong ring hintaying gawin ito kapag ang mga post ng iyong produkto ay kumpleto na. Medyo mabagal ang proseso—tatalakayin ko ang performance ng Spreadshirt.com mamaya.

Rebuild the Cache for the Spreadshirt PluginRebuild the Cache for the Spreadshirt PluginRebuild the Cache for the Spreadshirt Plugin

Pag-configure ng Slider

Bisitahin ang pahinang Armonico Theme Options at piliin ang kategorya o mga kategorya na gusto mong gamitin para sa slider at para sa product squares sa ibaba ng slider:

Set the Slider to Point to the Category of PostsSet the Slider to Point to the Category of PostsSet the Slider to Point to the Category of Posts

Narito kung ano ang magiging hitsura ng aking slider:

The Armonico Home Page SliderThe Armonico Home Page SliderThe Armonico Home Page Slider

Para i-set up ang Armonico widgets sa tabi ng Slider, pumunta sa menu ng Appearance > Widgets. Piliin ang Action Boxes > Sidebar > Add Widget.

Configure the Action Boxes Configure the Action Boxes Configure the Action Boxes

Idetalye ang links, images at text para sa bawat lugar ng action box:

Settings for Action BoxesSettings for Action BoxesSettings for Action Boxes

Narito ang magiging hitsura ng aking action boxes pagkatapos ng configuration:

Home Page Action Boxes in Armonico ThemeHome Page Action Boxes in Armonico ThemeHome Page Action Boxes in Armonico Theme

Nag-download ako ng Armonico icons para sa action boxes mula sa kanilang demo, dahil hindi ko mahanap ang mga ito sa loob ng theme download.

Paglunsad ng Iyong Site

At ang panghuli, maaari mong ilunsad ang iyong site. Maaari mong tingnan ang hitsura ng ginawa ko sa Sociables.io:

The Completed Armonico ShopThe Completed Armonico ShopThe Completed Armonico Shop

Inirerekomenda ko na simulan sa pagi-email sa iyong mga kaibigan at pagbahagi ng iyong site sa loob ng iyong social network. Ipunin ang mga komento mula sa mga tao at timbangin ang kanilang mga tugon. Gamitin ang mga komentong iyon para mas mapaganda ang mga disenyo, pagpili ng produkto at pagpepresyo, at ang site mismo.

Kapag handa ka na na palawakin ang kaalaman, isaalang-alang ang Facebook at Twitter advertising para ipaalam ito sa mga tao. Higit na magbasa tungkol sa pamamaraan ni Benny Hsu pagdating sa advertising.  Gumagamit sia ng maraming trial and error sa kanyang advertising para malaman kung ano ang uubra.

Pag-eksperimento Sa Ibang Nagbebenta

Gumagamit din si Hsu ng Teespring, ang mabilis gamitin na crowdfunded drop-shipping na kumpanya ng T-shirt. Maaari mong basahin ng mabuti ang tungkol sa development practice ng Teespring dito.

Ang malaking lamang ng Teespring ay nagbibigay ito ng mas magandang commission structure kaysa sa CafePress at Spreadshirt. Isa sa limitasyon ng pahina ng time-limited crowdfunding ng Teespring ay kapag hindi mo nakumpleto ang minimum na order hindi mabebenta ang mga produkto.

Itinuro ako ni Pope sa TeeChip, na walang limitasyon, subalit gumagana din na halos pareho ng Teespring.

Ganito ang magiging hitsura ng set up ng TeeChip campaign. I-upload ang iyong disenyo at pumili ng produkto at mga kulay:

TeeChip Design WizardTeeChip Design WizardTeeChip Design Wizard

I-set ang presyuhan at profit goals:

Teechip PricingTeechip PricingTeechip Pricing

Narito ang pahina na  makikita ng titingin:

Teechip PreviewTeechip PreviewTeechip Preview

Pansinin na ang handog ng mga produktong ito ay limitado sa oras, kung kaya kailangan mong regular na baguhin ang mga ito. Kaya lang, walang minimum na fulfillment threshold. Lahat ng orders ng customer ay naipadala.

Pagninilay sa Spreadshirt

Sa aking sariling pananaw, habang mas tumatagal ako sa pagtuturo ng paggamit ang Spreadshirt, mas lalo akong nawawalan ng gana  sa pagpipilian ng mga produkto at shop configuration nito. Ang performance ng site ay hindi gaanong maganda, at dahil dito mas masakit sa ulo kapag may gagawing pagbabago. Hinahangad ko na maaari lang akong mag-upload ng disenyo at papiliin ang mamimili ng panglalaki o pambabae na T-shirt at kalidad ng T-shirt o tanging produkto, subalit nais ng Spreadshirt na piliin lahat ng ito ng mas maaga.

Nakita ko na mas simple ang TeeChip, at nagbibigay ito ng higit na flexibility sa product configuration scenarios.  Maaari ka ring kumita ng mataas na profit margins sa crowdfunding product sites.

Sa kasalukuyan, walang anumang WordPress plugins para sa Teespring o TeeChip. Marahil ay maaari kang mag embed ng iFrame subalit hindi ko pa ito nasubukan. Isa pang alternatibo ay maglagay ng static graphic sa iyong site at ikonekta ito sa bawat isang campaigns, subalit kailangan mong regular na baguhin ang campaigns kapag ito ay tapos na. Umaasa ako na ang campaign sites na ito ay magbibigay ng mas maraming WordPress integration sa hinaharap.

Kung kaya, sa ibang araw, marahil ay ia-update ko ang aking site at gamitin ang TeeChip at alisin ang Spreadshirt. Iba-iba ang magiging kapakinabangan nito sayo.

Malinaw na maraming paraan para makagawa ng tindahan ng T-shirt gamit ang WordPress; mag post ng kahit na anong kumento, pagwawasto o karagdagang ideya sa ibaba. Gusto kong marinig ang iyong mga karanasan.

Maaari mo ring tingnan ang aking ibang Tuts+ na pagtuturo sa aking instructor page o kaya sundan ako sa Twitter @reifman.

Kaugnay na Links

Advertisement
Did you find this post useful?
Want a weekly email summary?
Subscribe below and we’ll send you a weekly email summary of all new Code tutorials. Never miss out on learning about the next big thing.
Advertisement
Looking for something to help kick start your next project?
Envato Market has a range of items for sale to help get you started.