This document is pu#lished under the =pen 5ontent 1icense a3aila#le from http:;;$$$.opencontent.or!;opl.shtml. It should ena#les you to extend the Quick Shop $ith your o$n fields and ta#les.
This document is pu#lished under the =pen 5ontent 1icense a3aila#le from http:;;$$$.opencontent.or!;opl.shtml. It should ena#les you to extend the Quick Shop $ith your o$n fields and ta#les.
This document is pu#lished under the =pen 5ontent 1icense a3aila#le from http:;;$$$.opencontent.or!;opl.shtml. It should ena#les you to extend the Quick Shop $ith your o$n fields and ta#les.
This is the Tutorial for the Quick Shop. It should minimie lacks of understandin!. "nd it should ena#les you to extend the Quick Shop $ith your o$n fields and ta#les. "fter eadin! you should #e a#le to #uild your o$n shop like the Quick Shop. %"&'I'(: This document isn)t complete. *ersion: +.,.+ - -,+,-,.-,+ /xtension 0ey: quick_shop 1an!ua!e: en 0ey$ords: for2e3elopers4 for"d3anced4 quick shop 5opyri!ht -,+,4 678rn 9aco# (Tritum)4 2irk %ildt (2ie 'etmacher)4 :http:;;$ildt.at.die-netmacher.de< This document is pu#lished under the =pen 5ontent 1icense a3aila#le from http:;;$$$.opencontent.or!;opl.shtml The content of this document is related to T>?=@ - a ('A;(?1 5BS;Crame$ork a3aila#le from $$$.typo@.or! + Quick Shop - Tutorial Quick Shop - Tutorial (extkey: quick_shop) Ta#le of 5ontents Quick Shop - Tutorial .............................................. + Introduction ........................................................... @ %hat should it doD ................................................................. @ %hat does it doD .................................................................... @ %hat do you needD ................................................................. @ "udience ............................................................................... @ Tutorial I;II ........................................................... E The Idea ................................................................................ E 'e$ /xtension $ith the 0ickstarter .......................................... F Insert some records .............................................................. +@ 6ackend ............................................................................... +E Crontend .............................................................................. +F Tutorial II;II ........................................................ +. GTB1 Templatin! ................................................................. +. 5onnection to $t_cart and po$ermail .................................... -, Gelpful su!!estions .............................................. -E To-2o 1ist ............................................................ -H Curther Information .............................................. -F "#out the plu!in icon ............................................................ -F "#out the "uthors ................................................................ -F Tutorial in ?2C ..................................................................... -. =ther extensions pu#lished #y 2ie 'etmacher ....................... -. 5han!e 1o! .......................................................... -I Illustration Index .................................................. -J - Introduction Quick Shop - Tutorial (extkey: quick_shop) Introduction %hat should it doD Quick Shop - Tutorial should explain a#out ho$ to de3elop your o$n $e# shop $ithout any line ?G?. Quick Shop - Tutorial should play #ack the de3elopin! of Quick Shop from the idea to the product (the extension). %hat does it doD %e are sorry. %e !uess4 that only ad3anced de3elopers are a#le to follo$ our instructions. "nd $e suspect4 that there are some parts and snippets missin!. Try it out and !i3e us a feed #ackK In case of lacks of understanding There is another tutorial4 $hich plays #ack the de3elopin! of a complex data#ase $ith the #ro$ser. This tutorial should ans$er a lot of questions. The tutorial is in (erman lan!ua!e only. If you ha3e any lack of understandin!4 please take a look to (reen 5ars http:;;typo@.or!;extensions;repository;3ie$;!reen_cars;current; (reen 5ars Tutorial (?2C) L in (erman lan!ua!e http:;;typo@.or!;extensions;repository;3ie$;!reen_cars;current;info;Dtx_terfe_pi+MH6do$nloadCileMH2Ndoc M-H-Cfall_studie.pdfOcGashNIHJIa#@e.E %hat do you needD The extension 0ickstarter (kickstarter). >ou need experience in TypoScript and you should kno$ the T5" L the T>?=@ 5onfi!uration "rray. "udience T>?=@ de3elopers @ Tutorial I;II Quick Shop - Tutorial (extkey: quick_shop) Tutorial I;II >ou can #uild your o$n shop - $ithout any ?G? code. This tutorial plays #ack the de3elopin! of Quick Shop from the idea to the product (the extension). The Idea Cirst $e need the idea: Go$ should the list 3ie$ and the sin!le 3ie$ look likeD List and Single View Illustration +: =ur small shop in the list 3ie$.
Illustration -: =ur small shop in the sin!le 3ie$. See our drafts for a small shop for T>?=@ merchandisin!: list 3ie$ and sin!le 3ie$. %e like to ha3e a filter for cate!ories4 a search field and an index-#ro$ser or a so called "-P-#ro$ser. %e ha3e only to care a#out the filters. See the next steps. The sin!le 3ie$ offers to order one or more of the selected product: $e need a cart. Database Model Illustration @: 1ist 3ie$ $ith (+) cate!ory filter and (-) products list.
Illustration E: 2ata#ase $ith (-) products and (+) cate!ories %e need t$o ta#les. +. %e like to display each product. %e need a ta#le products . ?roducts $ill #e our local ta#le. It is the ta#le $ith the main information. 2ata#ase queries $ill need the local ta#le in principle #ut not a forei!n ta#le. -. %e like to filter the products #y their cate!ory. %e need a ta#le cate!ories. 5ate!ories is our forei!n ta#le. If you like to filter products #y their colour or sie4 you $ould need ta#les for sies and colours too. E Tutorial I;II Quick Shop - Tutorial (extkey: quick_shop) Tables Illustration H: The ta#le product $ith its fields.
Illustration F: The ta#le cate!ories $ith its fields. The product ta#les contains a lot of fields. The cate!ory ta#le is more simple. T>?=@ $ill add some more fields to #oth ta#les. %e $ill create the data#ase $ith the T>?=@ kickstarter. See the next steps. H Tutorial I;II Quick Shop - Tutorial (extkey: quick_shop) 'e$ /xtension $ith the 0ickstarter If you don)t ha3e installed the kickstarter4 please install it first. Bore a#out the kickstarter: http:;;typo@.or!;extensions;repository;3ie$;kickstarter;current; Create a new Etension Illustration .: 5reate a ne$ extension. +. Bodul: "dmin tools -. /xt Bana!er @. 5reate ne$ /xtension F Tutorial I;II Quick Shop - Tutorial (extkey: quick_shop) !eneral Info 5lick on the plus icon of (eneral info. Illustration I: (eneral Info +. >our extension key. If you don)t $ant to pu#lish your extension4 please take the prefix my_. If you like to pu#lish the extension4 please reser3e the extension key on typo@.or! first. -. Title of your extension. @. 2escription of your extension. E. 5ate!ory should #e QCrontend ?lu!inR H. State: The state is sta#le #ecause of the missin! ?G? code. The extension $on)t ha3e any error or #u!. F. 2ependencies: >ou need the extension #ro$ser and the extension $t_cart. .. "uthor 'ame: >our name. I. "uthor email: 6e a$are of spamK If you pu#lish the extension on typo@.or!4 the code $ill #e pu#lished too. >our e-mail $ill #e pu#lished in clear text in a lot of files. %e recommend to use a link to your $e#site instead of an e- mail address. Setup Language If you like localied #ackend forms and if your lan!ua!e isn)t /n!lish4 please set up the lan!ua!e. %e selected (erman for the Quick Shop. . Tutorial I;II Quick Shop - Tutorial (extkey: quick_shop) "ew Database Tables It is recommended to start $ith all forei!n ta#les first. =ther$ise you ha3e to administrate the local ta#le t$ice. Categories +. 'ame of the ta#le: cate!ories. The kickstarter prefix the name $ith tx_ and the extension key. Gere: tx_quickshop_ ... -. Title of the ta#le. It is recommended to title the ta#le $ith the extension name and than the ta#le name. Gere: Qucik Shop 5ate!ory @. /dit Cields. /na#le QxR "dd S2eletedS field QTR "dd SGiddenS fla! E. "dd your first and o$n field. The title is the field title in the data#ase. If a field is called title4 the #ro$ser extension $ill use this field for headers automatically. 5all it title. H. The name of the filed4 $hich is displayed in #ackend forms. The #ro$ser use this name in the frontend too. F. The name for the second lan!ua!e. The #ro$ser is localied and $ill use this name4 if the deli3ered its content in this lan!ua!e (here: (erman) .. Cield type: Select QStrin! inputR. QApdate ...R the form I. The field must #e required. QApdate ...R the form If SBanual orderin!S is not set4 order the ta#le #y this field: Qtitle: 5ate!oryR 1a#el-field: QtitleR Product Ta#le name: product (-< tx_quickshop_product) Title of the ta#le: Quick Shop ?roduct Q/n!lishR4 Quick Shop ?rodukt Q(ermanR /dit Cields QTR "dd S2eletedS field QTR "dd SGiddenS fla! 'o$ $e $ill add fields. "fter chan!in! the field type you ha3e to update the form. Than you $ill see the properties of the field type. Cield name: title + Cield title: ?roduct Q/n!lishR4 ?rodukt Q(ermanR Cield type: QStrin! inputR QTR &equired Cield name: short Cield title: Short Q/n!lishR4 0ur#eschrei#un! Q(ermanR + If a field is called title4 the extension #ro$ser tries to render it as a header. >ou can administrate it in the #ro$ser plu!in < ta# QT5"R I Illustration J: (eneral Info Tutorial I;II Quick Shop - Tutorial (extkey: quick_shop) Cield type: QText areaR Cield name: description Cield title: 2escription Q/n!lishR4 6eschrei#un! Q(ermanR Cield type: QText area $ith &T/R &ich Text /ditor Bode: QTypical #asic setup (ne$ S6odytextS field #ased on 5SS stylesheets)R QTR Cullscreen link QTR Stora!e of ima!es in separate folder (in uploads;QextfolderR;rte;) Cield name: cate!ory Cield title: 5ate!ory Q/n!lishR4 0ate!orie Q(ermanR Cield type: Q2ata#ase relationR 5reate relation to ta#le: Q/xtension ta#le: Quick Shop 5ate!ory (tx_quickshops_cate!ories)R Type: QSelector#ox (from current pa!e)R Q+,R Bax num#er of relations Q+,R Sie of selector #ox QTR True B-B relations (other$ise commalist of 3alues) QTR "dd S"dd recordS link QTR "dd S1ist recordsS link QTR "dd S/dit recordS link Cield name: price Cield title: ?rice Q/n!lishR4 ?reis Q(ermanR Cield type: QStrin! input4 ad3ancedR QTR &equired /3aluate 3alue to: Qfloatin! point4 x.xxR QTR Strip space (T) 'ot unique (default) Cield name: tax Cield title: Tax included Q/n!lishR4 inkl. B$St. Q(ermanR Cield type: QStrin! input4 ad3ancedR QTR &equired /3aluate 3alue to: Qinte!erR QTR Strip space (T) 'ot unique (default) Cield name: in_stock Cield title: In Stock Q/n!lishR4 "uf 1a!er Q(ermanR Cield type: Q5heck#ox4 sin!leR QTR 5hecked #y default Cield name: ima!e + Cield title: Ima!e Q/n!lishR4 6ild Q(ermanR Cield type: QfilesR /xtensions: QIma!efilesR Q+,R Bax num#er of files + If a field is called ima!e4 the extension #ro$ser tries to render it as an ima!e. >ou can administrate it in the #ro$ser plu!in < ta# QT5"R J Tutorial I;II Quick Shop - Tutorial (extkey: quick_shop) Q+,,,R Bax filesie allo$ed (k#) Q+,R Sie of selector #ox QTR Sho$ thum#nails Cield name: caption + Cield title: 5aption Q/n!lishR4 6ildunterschrift Q(ermanR Cield type: Qtext areaR Cield name: ima!ealttext - Cield title: "lternate Text for Search /n!ines Q/n!lishR4 6ild: alternati3er Text fUr Suchmaschinen Q(ermanR Cield type: Qtext areaR Cield name: ima!etitletext @ Cield title: Title Text for Search /n!ines Q/n!lishR4 6ild: Titel Text fUr Suchmaschinen Q(ermanR Cield type: Qtext areaR QApdate ...R the form If SBanual orderin!S is not set4 order the ta#le #y this field: Qtitle: ?roductR 1a#el-field: QtitleR Frontend Plugins /nter a title for the plu!in: Quick Shop Q/n!lishR4 Quick Shop Q(ermanR (T) "dd to )Insert ?lu!in) list in 5ontent /lements) + If a field is called caption4 the extension #ro$ser tries to render it as the ima!e caption. >ou can administrate it in the #ro$ser plu!in < ta# QT5"R - If a field is called ima!ealttext4 the extension #ro$ser tries to render it as the ima!e alt text. >ou can administrate it in the #ro$ser plu!in < ta# QT5"R @ If a field is called ima!etitletext4 the extension #ro$ser tries to render it as the ima!e title text. >ou can administrate it in the #ro$ser plu!in < ta# QT5"R +, Tutorial I;II Quick Shop - Tutorial (extkey: quick_shop) Static TypoScript code /nter a title for the static extension template: quick_shop Setup + : 1. plugin.tx_browser_pi1 { 2. views { 3. list { 4. 1 { 5. select ( 6. tx_quickshop_products.title !. tx_quickshop_products.short ". tx_quickshop_products.i#$ge %. tx_quickshop_products.i#$ge$lttext 1&. tx_quickshop_products.i#$getitletext 11. tx_quickshop_products.price 12. ' 13. ( 14. ( 15. single { 16. 1 { 1!. select ( 1". tx_quickshop_products.title 1%. tx_quickshop_products.description 2&. tx_quickshop_products.i#$ge 21. tx_quickshop_products.i#$ge$lttext 22. tx_quickshop_products.i#$getitletext 23. tx_quickshop_products.c$ption 24. tx_quickshop_products.t$x 25. tx_quickshop_products.price 26. tx_quickshop_c$tegories.title 2!. ' 2". ( 2%. ( 3&. ( 31. ( 5omment This setup creates t$o 3ie$s: a list 3ie$ (E) and a sin!le 3ie$ (+F). The list 3ie$ $ill display the title of the product (F)4 the product note (.)4 the ima!e (I) and the price (++). The ima!e $ill !et an ima!e alt text (J) and an ima!e title text (+,). The sin!le 3ie$ $ill display some more information: description (+J)4 tax (-E) and the cate!ory title (-F). >ou don)t ha3e to care a#out the data#ase relation4 #ecause the #ro$ser plu!in $ill care a#out it. >ou don)t ha3e to #e care a#out la#ellin!4 #ecause the #ro$ser plu!in $ill la#el all 3alues in the frontend like T>?=@ in the #ackend forms. %e $ill enhance the TypoScript in a second step later. + This is the minimum TypoScript code for displayin! products in the frontend. ++ Tutorial I;II Quick Shop - Tutorial (extkey: quick_shop) #ublish $our Etension Illustration ++: Q%&IT/R Illustration +-: Install the extension +. 5lick Q*ie$ resultR -. 5lick Q%&IT/R @. /xtension Bana!er QInformationR E. 5lick on the phrase Q5lick here to install the extensionR +- Illustration +,: Q*ie$ resultR Tutorial I;II Quick Shop - Tutorial (extkey: quick_shop) Insert some records /3erythin! is ready for insertin! some records. Illustration +@: Sysfolder Quick Shop
Illustration +E: "dd your first record +. Bodul: %e# < 1ist -. ?a!e tree: Insert a sysfolder for storin! your products. 5all it SQuick Shop -?roductsS. It has the uid +, in our example a#o3e. @. /dit area:click on the Sadd recordS icon. E. 5lick on a Quick Shop 5ate!ory Categories In our example $e $ill add this cate!ories: 5lothes 2ishes 6ooks #roducts In our example $e $ill add this products: + cap (!reen) + cap (#lue) + cap (red) + cup + pullo3er + #ook %esult +. Ta#le 5ate!ories $ith three records. -. Ta#le ?roducts $ith six records. +@ Illustration +H: (eneral Info Tutorial I;II Quick Shop - Tutorial (extkey: quick_shop) 6ackend It)s time to see the result in the frontend. >ou need a pa!e SQuick ShopS $ith the #ro$ser plu!in and a TypoScript template If you don)t ha3e installed the extension #ro$ser4 please install it no$. See more a#out the #ro$ser: http:;;typo@.or!;extensions;repository;3ie$;#ro$ser;current; #age +. Bodul: %e# < ?a!e -. ?a!e tree: "dd a pa!e SQuick ShopS - in our example a#o3e $e ha3e added the pa!e as the first pa!e of the pro7ect (uid +). @. /dit area: "dd a ne$ content element #y clickin! the #utton Q'e$ contentR or the Sadd contentS icon. &rowser #lugin Illustration +.: 6ro$ser plu!in - title
Illustration +I: ?lu!in - Startin!point
Illustration +J: ?lu!in - title +. Ta# Q(eneralR < field header: 5all the plu!in Q6ro$ser for Quick ShopR -. Ta# Q(eneralR < field header type: QhiddenR @. Ta# Q?lu!inR < ta# Q(eneralR < field startin!point: sysfolder SQuick Shop - ?roductsS E. Ta# Q?lu!inR < ta# Q1istsR < field title: Quick Shop +E Illustration +F: ?a!e SQuick ShopS for the 6ro$serplu!in Tutorial I;II Quick Shop - Tutorial (extkey: quick_shop) Te'plate The pa!e $ith the 6ro$ser plu!in needs to templates included for a proper $orkflo$: the 6ro$ser template ($ith 6ro$ser default confi!uration) the Template from your extension ($ith your confi!uration) Illustration -,: "ddin! an extension template
Illustration -+: Include static templates from extensions +. If you don)t ha3e any template on the pa!e $ith the 6ro$ser plu!in4 please add a ne$ extension template. 5all it in the format type V name of the current pa!e V id of the typoscript template. Gere: Vpa!e_quickshop_,,@ -. Include static templates in the existin! template of your pa!e or in the ne$ template4 $hich you ha3e added in (+). Cield Include static (from extensions): 6ro$ser (#ro$ser) quick_shop (quick_shop) :- the template of your extension ?lease clear all T>?=@ cache. +H Tutorial I;II Quick Shop - Tutorial (extkey: quick_shop) Crontend List View and Single View Illustration --: 1ist 3ie$
Illustration -@: Sin!le 3ie$ The result depends on the records 4 you ha3e inserted4 and of your 5SS style sheets. 6e a$are4 $hat you ha3e doin! for this result: >ou ha3e re!istered your data#ase in T>?=@ - supported #y the kickstarter. >ou ha3e $rote t$o lines TypoScript T$poScript This is the code from a#o3e. Select property is in one line (H) and (+,). 1. plugin.tx_browser_pi1 { 2. views { 3. list { 4. 1 { 5. select ) tx_quickshop_products.title tx_quickshop_products.short ... 6. ( !. ( ". single { %. 1 { 1&. select ) tx_quickshop_products.title tx_quickshop_products.description ... 11. ( 12. ( 13. ( 14. ( +F Tutorial II;II Quick Shop - Tutorial (extkey: quick_shop) Tutorial II;II 'o$ $e like to ha3e our o$n GTB1 template and a filter for cate!ories. GTB1 Templatin! In this tutorial $e explain all you need4 #ut not all4 $hich is possi#le. If you $ant to kno$ more a#out GTB1 Templatin! $ith the 6ro$ser plu!in4 please read the Tutorial 6ro$ser Tutorial 6asics http:;;typo@.or!;extensions;repository;3ie$;#ro$ser_tut_#asics_en;current; There is a section STutorial TII: GTB1 Templatin!S. Edit the default Te'plate Ci3e steps: +. 2o$nload the sample_ttne$s template from the 6ro$ser extension -. /dit the list 3ie$4 add the marker for the filter @. /dit the sin!le 3ie$ E. Apload the template supported #y the 6ro$ser plu!in. Download the default template Illustration -E: /xtension Bana!er $ith /xtension 6ro$ser
Illustration -H: The 6ro$ser files +. Bodul: "dmin tools < /xt Bana!er -. Select: QInstall extensionsR @. Select: 6ro$ser extension E. Select: Q/dit filesR H. 5lick on Sres;sample_ttne$s.tmplS or on S/dit fileS in the same line. Edit the list view, add the marker for the filter The list 3ie$ is #e!innin! and endin! $ith the su#part marker WWWT/B?1"T/_1ISTWWW. 1. *+,, ---./0123./_245.--- begin ,,6 2. ---07_.4.2/--- 3. *+,, ---5/389:;<80--- begin ,,6 4. *div cl$ss)=se$rchbox se$rchbox,--->4/?---,---0<@/---=6 5. *Aor# $ction)=---39.4<B---= #ethod)=post= 6 6. *input tCpe)=hidden= n$#e)=no_c$che= v$lue)=1= D6 !. *input cl$ss)=sword= tCpe)=text= n$#e)=tx_browser_pi1EswordF= ... ". *input cl$ss)=button= tCpe)=sub#it= v$lue)=---GH..<B---= D6 %. *input cl$ss)=button= tCpe)=button= onclick)=loc$tion)I---07_H82---I= ... 1&. *+,, 3dd Ailter with the ---.3G2/.;4/2@--- sCnt$x $nd conAigure Cour ... 11. *DAor#6 +. Tutorial II;II Quick Shop - Tutorial (extkey: quick_shop) The form contains the comment S:K-- "dd filter $ith the WWWT"61/.CI/12WWW ...S. See line (+,) a#o3e. >ou ha3e to insert a ta#le.field marker + for your filter. %e like to !et a filter for the ta#le cate!ories and the field title. %e ha3e to add WWWTT_QAI50SG=?_5"T/(=&I/S.TIT1/WWW 1. *+,, ---./0123./_245.--- begin ,,6 2. ---07_.4.2/--- 3. *+,, ---5/389:;<80--- begin ,,6 4. *div cl$ss)=se$rchbox se$rchbox,--->4/?---,---0<@/---=6 5. *Aor# $ction)=---39.4<B---= #ethod)=post= 6 6. ###TX_QUICKSHOP_CATEGORIES.TITLE### !. *input tCpe)=hidden= n$#e)=no_c$che= v$lue)=1= D6 ". *input cl$ss)=sword= tCpe)=text= n$#e)=tx_browser_pi1EswordF= ... %. *input cl$ss)=button= tCpe)=sub#it= v$lue)=---GH..<B---= D6 1&. *input cl$ss)=button= tCpe)=button= onclick)=loc$tion)I---07_H82---I= ... 11. *+,, 3dd Ailter with the ---.3G2/.;4/2@--- sCnt$x $nd conAigure Cour ... 12. *DAor#6 %e add the marker in line (F). See the red line a#o3e. 'o$ $e replace the tt_ne$s marker $ith our markers in the #ody part. See section WWW1IST6=2>WWW 5ode #efore editin! 1. *+,, ---245.G<@7--- begin ,,6*+,, ---245.G<@74./0--- begin ,,6 2. *div6 3. *div stCle)=Alo$tJleAtK=6 4. ---.._B/?5.403L/--- 5. *Ddiv6 6. *div stCle)=p$dding,leAtJ%e#K=6 !. *h26---.._B/?5..4.2/---*Dh26 ". *ul6 %. *li6 1&. ---.._B/?5_93...4.2/--- 11. *Dli6 12. *li6 13. ---.._B/?5.5:<8.--- 14. *Dli6 15. *Dul6 16. *Ddiv6 1!. *div stCle)=cle$rJboth=6*Ddiv6 1". *Ddiv6*+,, ---245.G<@74./0--- end ,,6*+,, ---245.G<@7--- end ,,6 5ode after editin! 1. *+,, ---245.G<@7--- begin ,,6*+,, ---245.G<@74./0--- begin ,,6 2. *div6 3. *div stCle)=Alo$tJleAtK=6 4. ###TX_QUICKSHOP_PRODUCTS.IMAGE### 5. *Ddiv6 6. *div stCle)=p$dding,leAtJ%e#K=6 7. <h2>###TX_QUICKSHOP_PRODUCTS.TITLE###</h2> ". *ul6 %. *li6 1. ###TX_QUICKSHOP_PRODUCTS.SHORT### 11. *Dli6 12. <!"> 1#. ###TX_QUICKSHOP_PRODUCTS.PRICE### 14. </!"> 15. *Dul6 16. *Ddiv6 1!. *div stCle)=cle$rJboth=6*Ddiv6 1". *Ddiv6*+,, ---245.G<@74./0--- end ,,6*+,, ---245.G<@7--- end ,,6 + The extension 6ro$ser can handle ta#le.field markers. In GTB1 template you ha3e to $rite it in upper case and $rapped $ith WWW. I.e WWWTT_'/%S.TIT1/WWW. /3ery ta#le.field marker can ha3e a correspondin! marker in TypoScript in lo$ercase like tt_ne$s.title. See more in the manual of the extension 6ro$ser. +I Tutorial II;II Quick Shop - Tutorial (extkey: quick_shop) Edit the single view The sin!le 3ie$ is $rapped #y the su#part marker WWWT/B?1"T/_SI'(1/WWW. %e replace the tt_ne$s marker $ith our markers in the #ody part. See section WWW1IST6=2>WWW 5ode #efore editin! 1. *+,, ---54BL2/G<@7--- begin ,,6*+,, ---54BL2/G<@78<?--- begin ,,6 2. *div6 3. *div stCle)=Alo$tJleAtK=6 4. ---.._B/?5.403L/--- 5. *Ddiv6 6. *div stCle)=p$dding,leAtJ%e#K=6 !. *h26---.._B/?5..4.2/---*Dh26 ". *ul6 %. *li6 1&. ---.._B/?5_93...4.2/--- 11. *Dli6 12. *li6 13. ---.._B/?5.5:<8.--- 14. *Dli6 15. *Dul6 16. *Ddiv6 1!. *div stCle)=cle$rJboth=6*Ddiv6 1". *Ddiv6*+,, ---54BL2/G<@78<?--- end ,,6*+,, ---54BL2/G<@7--- end ,,6 5ode after editin! 1. *+,, ---54BL2/G<@7--- begin ,,6*+,, ---54BL2/G<@78<?--- begin ,,6 2. *div6 3. *div stCle)=Alo$tJleAtK=6 4. ###TX_QUICKSHOP_PRODUCTS.IMAGE### 5. *Ddiv6 6. *div stCle)=p$dding,leAtJ%e#K=6 !. *h26---.M_NH49O5:<1_18<@H9.5..4.2/---*Dh26 ". *ul6 %. *li6 1. ###TX_QUICKSHOP_CATEGORIES.TITLE### 11. *Dli6 12. *li6 1#. ###TX_QUICKSHOP_PRODUCTS.DESCRIPTIO$### 14. *Dli6 15. *Dul6 16. *Ddiv6 1!. *div stCle)=cle$rJboth=6*Ddiv6 1". *Ddiv6 1%. *+,, ---54BL2/G<@78<?--- end ,,6*+,, ---54BL2/G<@7--- end ,,6 +J Tutorial II;II Quick Shop - Tutorial (extkey: quick_shop) 5onnection to $t_cart and po$ermail (hat does wt)cart do* $t_cart is a small #ut po$erful extension $hich pro3ides the shoppin! cart for quick shop. $t_cart itself neither allo$s you to create products4 articles or cate!ories nor includes a checkout functionality. The extension depends on po$ermail $hich helps you to inte!rate the checkout process. Curthermore po$ermail is utilied for sendin! the order confirmation. $t_cart comes $ith a 3ery po$erful dynamic marker functionality. %ith the help of TypoScript you can create indi3idual markers. "s soon as you)3e added a ne$ marker it)s a3aila#le in your GTB1 template. &e!ardin! quick_shop $t_cart and po$ermail are confi!ured for an optimal usa!e $ith a proper set of markers ; information. Technically $t_cart is an extension $hich utilies the T>?=@ session. 6uild your o$n add-to-cart form and send information like color4 sie and quantity as post parameters. These post parameters $ill #e added to the T>?=@ session. $t_cart handles the session data and L #ased on your setup L looks up a specific T>?=@ data#ase ta#le to present the product title and any other additional information. In the case of quick_shop $t_cart uses the quick_shop data#ase ta#les. &i!ht no$ there are no fields for color and sie. 6ut such fields $ill #e added soon. +d'inistration Install wtcart with E!tension "anager =pen the extension mana!er4 do$nload the extension X$t_cartY and install it. If you ha3en)t already installed po$ermail you)ll #e asked to do it durin! the installation process of $t_cart. There are no additional settin!s you can chan!e $ithin the extension mana!er re!ardin! $t_cart. Include Static Template 5reate a ne$ extension template (TypoScript) or edit an existin! one and include the static template of $t_cart. Illustration -F: Include static template of $t_cart -, Tutorial II;II Quick Shop - Tutorial (extkey: quick_shop) TypoScript Constants Illustration -.: Illustration -I: /ditin! TypoScript 5onstants $ith 5onstant /ditor In order to sho$ products $ithin $t_cart you ha3e to confi!ure some constants $ith the help of the 5onstants /ditor. ?lease check the next section X5onfi!urationY for more details a#out the specific settin!s. -+ Tutorial II;II Quick Shop - Tutorial (extkey: quick_shop) %eference TypoScript Constants ?ossi#le su#sections: &eference (TypoScript) #ropert$, Data t$pe, Description, Default, main.template Cile Template Cile: GTB1-template file C/ output (see /TT:$t_cart;files;templates;cart.html for an example) >ou can specify the path to your o$n GTB1 template. /TT:$t_cart;files;templa tes;cart.html !p3ar.qty Text (et or post param: /nter the correct parameter name for the amount field in your order form (e.!. tx_tr#ooks_qty) tx_tr#ooks_qty !p3ar.puid Text (et or post param: /nter the correct parameter name for your products (e.!. tx_#ro$ser_pi+Zsho$Aid) tx_#ro$ser_pi+Zsho$Aid tax.reduced Text Tax rate: /nter the tax rate for reduced items (e.!. .) . tax.normal Text Tax rate: /nter the tax rate for normal items (e.!. +J) +J d#.ta#le Text Ta#le name: /nter the correct ta#le name $here the products are stored (e.!. tx_data#ase) tx_tr#ooks_#ook d#.title Text Title column: /nter the correct column name of the ta#le $here the product titles are stored (e.!. title) title d#.price Text ?rice column: /nter the correct column name of the ta#le $here the prices are stored (e.!. price) price d#.tax Text Tax column: /nter the correct column name of the ta#le $here the tax cate!ories are stored (e.!. tax) tax po$ermail5ontent.uid IntV ?o$ermail content uid: /nter the uid of the po$ermail content element to hide this element if the cart is empty "'2 to clear cart if this form $as su#mitted. de#u! 6oolean 2e#u! Bode: /na#le or disa#le some de#u! output , -- Tutorial II;II Quick Shop - Tutorial (extkey: quick_shop) Configuration Create page with wtcart plugin 5reate a ne$ pa!e called X5artY or X=rderY or $hate3er you $ant and add a ne$ content element. In order to add the $t_cart plu!in choose as type XInsert plu!inY. =n the ta# X?lu!inY select as plu!in X5art to po$ermailY. That)s it. 'o addiotional settin!s are a3aila#le. 'ice [) =n the same pa!e add after the $t_cart plu!in a ne$ po$ermail plu!in and confi!ure it. 5reate all the required fields and lo!ic you need. Configure powermail to work with wtcart /dit your po$ermail plu!in and edit the email $hich is sent to the sender or recipient respecti3ely. "dd the follo$in! marker: WWW?=%/&B"I1_T>?=S5&I?T_5"&TWWW This marker includes the $hole shoppin! cart information pro3ided #y $t_cart. "fter includin! the marker your po$ermail emails $ill contain the shoppin! cart data. -@ Gelpful su!!estions Quick Shop - Tutorial (extkey: quick_shop) Gelpful su!!estions If you ha3e helpful su!!estions4 feel free to contact me: 2irk %ildt http:;;$ildt.at.die-netmacher.de. -E To-2o 1ist Quick Shop - Tutorial (extkey: quick_shop) To-2o 1ist 5omplete the tutorial for de3elopers4 $hich aren)t ad3anced. -H Curther Information Quick Shop - Tutorial (extkey: quick_shop) Curther Information "#out the plu!in icon The concept of the icon: The cylinder is the common sym#ol for a data#ase. The sheet is a sym#ol for the frontend. The colour of the stripe4 oran!e4 is the one of the T>?=@ colours. "#out the "uthors &-.rn /acob 678rn 9aco# (\ +JI+ Ilmenau;(ermany) Counder of T&ITAB (9ena;(r]fenroda) Bem#er of T>?=@ Aser!roup Thurin!ia Bem#er of T>?=@ Aser!roup 1eipi! since -,,.: T&ITAB is #orn and !ro$in! rapidly -,,+ - -,,.: Ani3ersity of applied sciences 9ena L 6usiness "dministration since -,,,: Internet 7unky +leander 0ellner Dirk (ildt 2irk %ildt (\ +JF@ Gam#ur!;(ermany) Counder of 2ie 'etmacher (#& (/rfurt;%eimar) Counder of T>?=@ Aser!roup Thurin!ia Bem#er of T>?=@ Aser!roup 1eipi! -,,@: Coundin! think 3isuallyK It is 2ie 'etmacher since -,,J. -,,, - -,,-: Cinancial 5ontroller4 (./.6.6 +JJJ - -,,,: Cinancial 5ontroller4 (ZBZP - Ta!esspie!el-(ruppe +JJ. - +JJJ: Spokesman4 Senats3er$altun! fUr Cinanen4 6erlin4 6erlin +JIJ - +JJ.: /ditor and Cinancial 5ontroller4 ta4 die ta!eseitun! +JI- - +JIJ: Creelancin! ?ress ?hoto!rapher -F Illustration -J: The lo!o Illustration @-: The "uthor - a little #it #lurred Illustration @,: 678rn 9aco# Illustration @+: "lexander 0ellner Curther Information Quick Shop - Tutorial (extkey: quick_shop) Tutorial in ?2C >ou find this tutorial in ?2C format at doc;tutorial.pdf http:;;typo@.or!;extensions;repository;3ie$;quick_shop;current;info;Dtx_terfe_pi+MH6do$nloadCileMH2Ndoc M-H-Cturorial.pdf =ther extensions pu#lished #y 2ie 'etmacher 6ro$ser for 6P2 Staff 2irectory. 1ist 3ie$ and sin!le 3ie$ for the extension 6P2 Staff 2irectory. It is out of the #ox. >ou can edit the 3ie$s #y TypoScript. >ou can add fields and $hole 3ie$s. http:;;typo@.or!;extensions;repository;3ie$;#ro$ser_#dstaffdirectory;current; 6ro$ser for *irtual 5i3il Ser3ices - 1ist 3ie$s and sin!le 3ie$s for the extension *irtual 5i3il Ser3ices (ci3ser3) . It supersedes smarty and ena#les S/= - search en!ine optimisation -4 &eal A&1 and the T>?=@ cache mana!ement. It is out of the #ox. It >ou can edit the 3ie$s #y TypoScript. >ou can add fields and $hole 3ie$s. http:;;typo@.or!;extensions;repository;3ie$;#ro$ser_ci3ser3;current; (reen 5ars ((rUne "utos) - 2ata#ase optimied for ecolo!ical cars. It is a case study and demonstrates4 ho$ to !et a complex data#ase $ith the 6ro$ser in three hours only. http:;;typo@.or!;extensions;repository;3ie$;!reen_cars;current; 9uridat - 2ata#ase for 9uridical 2ata. 9uridat pro3ides a 7uridical data #ase $ith #ackend functionality. 9uridat is out of the #ox. It is a team$ork $ith the 6ro$ser. http:;;typo@.or!;extensions;repository;3ie$;7uridat;current; lo!ical_form: " frontend plu!in for e3aluatin! forms. I.e you can e3aluate mail addresses. http:;;typo@.or!;extensions;repository;3ie$;lo!ical_form;current; Ba7ordomo: Cor su#cri#in! to and unsu#scri#in! from a ma7ordomo mailin! list. http:;;typo@.or!;extensions;repository;3ie$;ma7ordomo;current; rm_staticfile: Impro3e your performanceK This extension ena#les the delete of static files4 $hich $here !enerated #y nc_staticfilecache. It is a team play $ith the T>?=@ cache mana!ement4 ttne$s4 ttne$scache4 s!_ne$splus and s!_feli#. http:;;typo@.or!;extensions;repository;3ie$;delete_staticfile_#y_@party;current; seo_dynamic_ta!: Search /n!ine =ptimisation. >ou can !enerate 3alues dynamically $ith this extension especially for the :title<-ta!4 for the :meta<-ta! description and the :meta<-ta! key$ords. http:;;typo@.or!;extensions;repository;3ie$;seo_dynamic_ta!;current; tt_ne$s Barker (extkey: ttne$s_marker) ena#les to add any marker to a tt_ne$s GTB1 template includin! links. "ny marker has the std_$rap property. http:;;typo@.or!;extensions;repository;3ie$;ttne$s_marker;current; tt_ne$s select confi!uration (extkey: ttne$s_selectconf) ena#les to select tt_ne$s #y any SQ1 clause. The extension adds an and%here clause to the SQ1 query of the tt_ne$s plu!in. I. e. it is possi#le to display tt_ne$s items in dependence on the o$nership of a fe_user. http:;;typo@.or!;extensions;repository;3ie$;ttne$s_selectconf;current; %ine 5atalo!ue pro3ides a data #ase for $ine $ith re!ions4 $ineries4 styles4 3ariety and a!ein! amon! others. It is localied. /n!lish4 (erman and Spanish ist of the #ox. %ine #ased on the extension 6ro$ser. http:;;typo@.or!;extensions;repository;3ie$;$ine;current; -. 5han!e 1o! Quick Shop - Tutorial (extkey: quick_shop) 5han!e 1o! +.,.+ Initial release -I Illustration Index Quick Shop - Tutorial (extkey: quick_shop) Illustration Index Illustration 1: Our small shop in the list view.............................................................................................................4 Illustration 2: Our small shop in the single view.........................................................................................................4 Illustration 3: List view with (1) category filter an (2) proucts list.............................................................................4 Illustration 4: !ata"ase with (2) proucts an (1) categories.......................................................................................4 Illustration #: $he ta"le prouct with its fiels...........................................................................................................# Illustration %: $he ta"le categories with its fiels........................................................................................................# Illustration &: 'reate a new e(tension......................................................................................................................% Illustration ): *eneral Info......................................................................................................................................& Illustration +: *eneral Info......................................................................................................................................) Illustration 1,: -.iew result/..................................................................................................................................12 Illustration 11: -01I$2/........................................................................................................................................12 Illustration 12: Install the e(tension.......................................................................................................................12 Illustration 13: 3ysfoler 4uic5 3hop......................................................................................................................13 Illustration 14: 6 your first recor.......................................................................................................................13 Illustration 1#: *eneral Info..................................................................................................................................13 Illustration 1%: 7age 84uic5 3hop8 for the 9rowserplugin...........................................................................................14 Illustration 1&: 9rowser plugin : title......................................................................................................................14 Illustration 1): 7lugin : 3tartingpoint.....................................................................................................................14 Illustration 1+: 7lugin : title...................................................................................................................................14 Illustration 2,: 6ing an e(tension template..........................................................................................................1# Illustration 21: Inclue static templates from e(tensions...........................................................................................1# Illustration 22: List view........................................................................................................................................1% Illustration 23: 3ingle view....................................................................................................................................1% Illustration 24: 2(tension ;anager with 2(tension 9rowser .......................................................................................1& Illustration 2#: $he 9rowser files............................................................................................................................1& Illustration 2%: Inclue static template of wt<cart.....................................................................................................2, Illustration 2&: Illustration 2): 2iting $ypo3cript 'onstants with 'onstant 2itor.........................................................21 Illustration 2&: Illustration 2): 2iting $ypo3cript 'onstants with 'onstant 2itor.........................................................21 Illustration 2+: $he logo........................................................................................................................................2% Illustration 3,: 9=>rn ?aco".........................................................................................................................................................2% Illustration 31: 6le(aner @ellner.................................................................................................................................................2% Illustration 32: $he 6uthor : a little "it "lurre.........................................................................................................2% -J