You are on page 1of 29

Quick Shop - Tutorial Quick Shop - Tutorial (extkey: quick_shop)

Quick Shop - Tutorial


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