Some topics described in this section may need more advanced skills. It is distinguished by “*” and means level of difficulty.

Needed skills:

* - basics of HTML and CSS

** - basics HTML, CSS and PHP

For that you will need basic knowledge about handling with FTP connection. If you don’t have it, contact with your administrator.

Connect with FTP account, create a file on your disc, for example “phpver.php” and paste to it:

<?php echo phpversion(); ?>

Then copy that file on FTP account and run file using internet browser, for example: your-domain.com/phpver.php

For that you will need basic knowledge about handling with FTP connection. If you don’t have it, contact with your administrator.

Connect with FTP account, create a file on your disc, for example “phpinfo.php” and paste to it:

<?php echo phpinfo(); ?>

Then copy that file on FTP account and run file using internet browser, for example: your-domain.com/phpinfo.php

After opening this page, you should see information about PHP version, PHP configuration, installed addons etc. Find on that page information about GD. You should also find there “GD Version” etc.

Firstly copy logo to “templates/img/” directory and edit file templates/container.tpl. Logo displays in block <div id=”title”>...</div> in BODY block.

If you want to add logo in JPG/PNG/GIF format, you need to change this code:

Quick<span>.</span><strong>Cart</strong>

for:

<img src="$config[dir_templates]img/logo.jpg" alt="$config[title]" />

If you want to add logo in SWF format, you need to delete code below and paste HTML code generated from, for example Adobe Flash

<a href="$config['index']" tabindex="1">Quick<span>.</span><strong>Cart</strong></a>

If you want to change default top banner, you should prepare file (default size: 960px wide and 220px high) and name it for example: “page_header.jpg”. Copy it to “templates/img/” directory. Then edit file “templates/default.css” and in line responsible for block #head2 .container change path to the file of background, for example:

from:

#head2 .container{ ... background:#fbf9e9 url('img/header.png') no-repeat bottom right; ... }

to:

#head2 .container{ ... background:#fbf9e9 url('img/page_header.jpg') no-repeat; ... }

To replace standard banner image with flash animation you should:

• Open file templates/container.tpl,
• Find:

<a href="$config['index']" tabindex="1">Quick<span>.</span><strong>Cart</strong></a>

• Replace that line with code generated in program where you have created your animation.

If you placed your file witch “swf” extension in directory templates/img/, you should paste that path to code which you wrote before. File templates/container.tpl is shown using index.php and path should be relative to that file.

If you want to change width of the left column to 250px (by default is 270px, so we need to decrease it about 20px), you should edit file “templates/default.css” and change values in following lines:

• style to id “column”:

#column{float:left;width:270px;padding:0;}

change “width:270px;” to “width:250px;” - it is width of the left column,

• style to id “content”:

#content{float:left;width:690px;padding:10px 0 5px;text-align:center;}

change “width:690px;” to “width:710px” - it is width of block with content on the right side

change width of background picture (”two_columns.gif” in “templates/img”) also.

When in website we have too many pieces of information, sometimes it is needed to add right column. Actually, application is prepared for this modification, as it already has in “templates/container.tpl” file, block with “column2” id. It is by default hidden in style CSS. In HTML code it looks as following:

<div id="column2">
  <!-- additional column, hidden in styles -->
</div>

Into this place you can put all additional elements for right column.

Style for this column is placed in “templates/default.css” file:

/* ADDITIONAL COLUMN */
#column2{display:none;float:right;width:100px;}

You should delete “display:none;” the code after modyfication will look like:

#column2{float:right;width:100px;}

This column by default is 100px wide, so rest part of the site - left column (#column) and middle part (#content) should be reduced together about 100px. Otherwise it wouldn’t display properly.

In this example we will reduce only width of the middle part(#content), left column will stay unchanged, so we need to make changes only in following line from “templates\default.css” file:

#content{float:left;width:690px;padding:10px 0 5px;text-align:center;}

change it to:

#content{float:left;width:590px;padding:10px 0 5px;text-align:center;}

In Quick.Cart it is possible to set theme and template for particular page, subpage, page of product (where you can choose theme and template for page you can learn in manual section). There are two ways of changing design for particular subpage. They were described below

You can add top banner for particular page while editing it in administration. To do that, prepare file (by default it has size: 960px width and 220px height) and while editing page choose “View” tab and in “Banner” field upload prepared file.

If you want to change design of middle part of the site, where name, description and photos are displayed, execute following steps:

1. in “templates/” directory create new file. It should begins to “pages_” and has “tpl” extension e.g. “pages_new.tpl”,
2. copy all content or chosen blocks, which are you going to change from “templates/pages_default.tpl” file and paste to the new file,
3. now, you can modify new file, change order of variables, change names of classes and id for CSS style,
4. login to administration and select new template for chosen subpage.

When you need to change whole or most of design on particular subpage, you can use themes for that. You will need some knowledge of PHP programing. Themes are placed in “templates/themes/” directory, default theme is named “default.php”.

1)Create new file in “templates/themes/” directory, with php extension and name it e.g. “new.php”,
2) copy content of “default.php” file to created file,
3) modify “new.php” file and adjust it to your needs,
4) login to administration and select new theme for chosen subpage.

Following example concern situation when design of subpage is completely different to other pages.

1) Create new main template in “templates/” directory and name it e.g. “container_2.tpl”,
2) copy content of “container.tpl” file and paste it to the new one,
3) create new CSS file e.g. “new.css”, copy content of “default.css” file and paste it to the new file,
4) in “container_2.tpl” file, change reference to style file as following:

<style type="text/css">@import "$config[dir_templates]$config[template]";</style>

change it to:

<style type="text/css">@import "$config[dir_templates]new.css";</style>

You can obviously change also HTML code inside this file, but remember that in HEAD block is placed header of the site, in BODY block all content of the site and in FOOT block footer of the site and ending of page’s code.

5) Edit file “templates/themes/new.php” and change code:

echo $oTpl->tbHtml( 'container.tpl', 'HEAD' ).$oTpl->tbHtml( 'container.tpl', 'BODY' ).$content.$oTpl->tbHtml( 'container.tpl', 'FOOT' );

to

echo $oTpl->tbHtml( 'container_2.tpl', 'HEAD' ).$oTpl->tbHtml( 'container_2.tpl', 'BODY' ).$content.$oTpl->tbHtml( 'container_2.tpl', 'FOOT' );

While making skins, if possible, you shouldn’t change HTML code in templates files (*.tpl). In most cases it is enough to change file with “css” extension. Default it is file “default.css” in “templates/” directory. Before you make that few steps read about templates and templates content.

• copy file “default.css” to the same directory and change its name, for example to “newSkin.css”,
• login to administration and go to configuration page, there select template file “newSkin.css”,
• edit file “newSkin.css”, change colours, sizes etc., try not to change files with “tpl” extension,
• additional graphics put into “templates/img/” directory.

If you want to put link to basket from menu above logo to for example manu below logo, you should:

• edit file “templates/menu_1.tpl” and copy code from “LIST_BASKET” block,
• edit file “templates/menu_2.tpl” and paste code you have copied earlier to it,
• edit style “templates/default.css” and change all lines started from #menu1 li#basketMenu to #menu2 li#basketMenu,
• enter administration and edit page, which display basket. Set menu type as “top menu under logo”,
• now edit changed style to display basket link properly in new menu.

If longer side of photo uploaded on server is longer then 900px, it is resized to 900px (longer side). We set this restriction because a lot of people use 1024×768 resolution and photos don’t fit the screen. Although if you need to display bigger photo, edit “config/general.php” file and change following value:

$config['max_dimension_of_image'] = 900;

The tool has possibility to execute PHP code in templates. We don’t recommend this solution, but if it is necessary, please use it with consideration. To enable execution of PHP code in templates:

1. edit “config/general.php” file and change value of “$config[’embed_php’]” variable to:

   $config['embed_php'] = true;

2. edit any template from “templates/” directory and insert code e.g.:

   <?php echo phpinfo(); ?>

Templates with extension tpl are viewable by internet browser. We recommend to hide this files when PHP code is included in template files. Create in “templates/” directory “.htaccess” file with content:

Options +Indexes
IndexIgnore *.tpl
<files *.tpl>
order allow,deny
deny from all
</files>

We’ve created freeware plugin to count visits on page. Go to download page and download plugin “simpleCounter”.

By default, 3 types of menu (2 upper and 1 on the left side) are displayed. If you want to add next type of menu for example on the left side, execute following steps:

• edit “config/lang_pl.php” file and change

$aMenuTypes[1] = 'Top menu - first';
$aMenuTypes[2] = 'Top menu - second';
$aMenuTypes[3] = 'Products';
$aMenuTypes[4] = 'Hidden pages';

to

$aMenuTypes[1] = 'Top menu - first';
$aMenuTypes[2] = 'Top menu - second';
$aMenuTypes[3] = 'Products';
$aMenuTypes[4] = 'Hidden pages';
$aMenuTypes[5] = 'enter here name for new menu';

• create new file in “templates/” directory, name it “menu_5.tpl” and copy content of e.g. “menu_3.tpl” file to the new one,
• edit “templates/themes/default.php” file and add code

$sMenu5 = $oPage->throwMenu( 'menu_5.tpl', 5, $iContent, 1 );

• edit “templates/container.tpl” and add $sMenu5 variable behind e.g. $sMenu3 variable in this file,
• log in to administration and add pages to this type of menu.

If you don’t want to display subpages in left menu, edit “templates/themes/default.php” file and change:

$sMenu3 = $oPage->throwMenu( 'menu_3.tpl', 3, $iContent, 1 );

to:

$sMenu3 = $oPage->throwMenu( 'menu_3.tpl', 3, $iContent, 0 );

4th parameter passed to throwMenu() function has been changed. Value “1” is replaced to “0”.

By default, size of thumbnails are set to 100 and 150px. If you want to add other sizes e.g. 50 and 200px, edit file “config/general.php” and change:

$config['pages_images_sizes'] = Array( 0 => 100, 1 => 150 );

to:

$config['pages_images_sizes'] = Array( 0 => 100, 1 => 150, 2 => 50, 3 => 200 );

Remember, that if you change 100 and 150 values for another, all thumbnails already uploaded in this sizes, need to be generated once more in new sizes. You can do that by editing all pages which has thumbnails in this sizes and save it without making any changes. The application will recognize differences in thumbnails’ sizes and will generate it again.

If you want to use external statistic systems for gathering views of your shop, you should place proper script on your site.

You can use any statistics. We recommend free system Google Analytics or great polish system Stat.pl based on Gemius technology.

Here is example code for Google Analytics:

<script src="http://www.google-analytics.com/urchin.js" type="text/javascript">
</script>
<script type="text/javascript">
_uacct = "UA-111592-2";
urchinTracker();
</script>

You will find proper code for your statistics on that system pages after registration.

It will be best to place this piece of code in page footer. Then you will be sure that the content of the page will be fully shown, and any eventual problems with connection may only occur after the page has been fully loaded.

The best place to paste statistic code is in file templates/container.tpl in block FOOT after element </body>

Default price format is 1000.00, to change that format for example to 1,000.00, you should change:

• In file “core/common.php” in function displayPrice( ) change line:

return $mPrice;

to:

return number_format( $mPrice, 2, '.', ',' );

• In file “core/common.js” in function changePriceFormat( ) should be set separator for thousands (separator for decimals won’t be changed in that case), so default config lines in that function:

var sDecimalSeparator = '.';
var sThousandSeparator = '';

should be changed to:

var sDecimalSeparator = '.';
var sThousandSeparator = ',';

Default PHP sessions are stored in “/tmp/” directory. If you want them to be stored in shop directory, for example files/sessions/ you should:

• Create directory, for example “files/sessions/”
• Edit file “config/general.php” and in penultimate line paste code:

ini_set( 'session.save_path', 'files/sessions/' );

If you want to display in basket link together with quatity of products also value of ordered products, execute following steps:

• edit file “templates/menu_1.tpl” and find code:

<strong>$iOrderProducts</strong></span>

• after this code add the following:

<span class="summary"><strong>$fOrderSummary</strong>$config[currency_symbol]</span>

• edit file “templates/default.css” and set how value should display adding code:

#menu1 li#basketMenu .summary{}

Execute following steps:

1) Download CKEditor → http://www.ckeditor.com (about 2.3 MB)

2) Unpack file on you disc and copy folder to server - to main directory - where you have files “index.php” and “admin.php”

3) Edit file “admin.php” and add following line (best will be beside other functions require_once() )

require_once 'ckeditor/ckeditor.php';

4) Edit file “plugins/edit/htmleditor.php”, in htmlEditor() function change following code:

if( !defined( 'WYSIWYG_START' ) ){
  define( 'WYSIWYG_START', true );
  return $oTpl->tbHtml( 'edit.tpl', 'TINY_HEAD' ).$oTpl->tbHtml( 'edit.tpl', 'TINY' );
}
else{
  return $oTpl->tbHtml( 'edit.tpl', 'TINY' );
}

for this:

  $oCKEditor = new CKEditor() ;
  $oCKEditor->returnOutput = true;
  $oCKEditor->basePath = 'ckeditor/';
  $oCKEditor->config['width'] = $iW;
  $oCKEditor->config['height'] = $iH;
  return $oCKEditor->editor($sName, $sContent);

5) CKEditor editor has very developed tool bar, so it leave little place for short description. You can enlarge this place changing in file actions_admin/p.php second parameter in line:

$sDescriptionShort  = htmlEditor ( 'sDescriptionShort', '120', '100%', ...

for example it can look like following line:

$sDescriptionShort  = htmlEditor ( 'sDescriptionShort', '200', '100%', ...

If language has in alphabet any diacritical mark, they must be replaced while displaying in url address, especially it concerns pages’ names and products’ names. To change such marks to another, function change2Latin()has been written. By default it contain some the most popular diacritical marks and their counterparts. While adding new language which has diacritical marks, you should check if they are replaced by change2Latin() function and if it is needed, add them.

To do this, execute following steps:

• open file “libraries/Trash.php” and find change2Latin() function. It contains two arrays - Array(), in the first one are placed diacritical marks and in the second one - counterpart of this marks. If you won’t be able to find in first array diacritical marks from language you want to add, you have to execute next step;

• to add some marks to the array, you should add them at the end of first array and in the second one add their counterpart in the same place.

For French language it will be as following:

First array before adding marks:

 Array( 'ś', 'ą', 'ź', 'ż', 'ę', 'ł', 'ó', 'ć', 'ń', 'Ś', 'Ą', 'Ź', 'Ż', 'Ę', 'Ł', 'Ó', 'Ć', 'Ń', 'á', 'č', 'ď', 'é', 'ě', 'í', 'ň', 'ř', 'š', 'ť', 'ú', 'ů', 'ý', 'ž', 'Á', 'Č', 'Ď', 'É', 'Ě', 'Í', 'Ň', 'Ř', 'Š', 'Ť', 'Ú', 'Ů', 'Ý', 'Ž', 'ä', 'ľ', 'ĺ', 'ŕ', 'Ä', 'Ľ', 'Ĺ', 'Ŕ', 'ö', 'ü', 'ß', 'Ö', 'Ü' ),

The same array after adding diacritical marks for French:

Array( 'ś', 'ą', 'ź', 'ż', 'ę', 'ł', 'ó', 'ć', 'ń', 'Ś', 'Ą', 'Ź', 'Ż', 'Ę', 'Ł', 'Ó', 'Ć', 'Ń', 'á', 'č', 'ď', 'é', 'ě', 'í', 'ň', 'ř', 'š', 'ť', 'ú', 'ů', 'ý', 'ž', 'Á', 'Č', 'Ď', 'É', 'Ě', 'Í', 'Ň', 'Ř', 'Š', 'Ť', 'Ú', 'Ů', 'Ý', 'Ž', 'ä', 'ľ', 'ĺ', 'ŕ', 'Ä', 'Ľ', 'Ĺ', 'Ŕ', 'ö', 'ü', 'ß', 'Ö', 'Ü', 'œ', 'æ', 'à', 'â', 'ç', 'è', 'ê', 'ë', 'î', 'ï', 'ô', 'û', 'ù', 'ÿ', 'Œ', 'Æ', 'À', 'Â', 'Ç', 'È', 'Ê', 'Ë', 'Î', 'Ï', 'Ô', 'Û', 'Ù', 'Ÿ' ),

Second array before adding marks:

Array( 's', 'a', 'z', 'z', 'e', 'l', 'o', 'c', 'n', 'S', 'A', 'Z', 'Z', 'E', 'L', 'O', 'C', 'N', 'a', 'c', 'd', 'e', 'e', 'i', 'n', 'r', 's', 't', 'u', 'u', 'y', 'z', 'A', 'C', 'D', 'E', 'E', 'I', 'N', 'R', 'S', 'T', 'U', 'U', 'Y', 'Z', 'a', 'l', 'l', 'r', 'A', 'L', 'L', 'R', 'o', 'u', 'S', 'O', 'U' ),

The same array after adding counterpart marks for French:

Array( 's', 'a', 'z', 'z', 'e', 'l', 'o', 'c', 'n', 'S', 'A', 'Z', 'Z', 'E', 'L', 'O', 'C', 'N', 'a', 'c', 'd', 'e', 'e', 'i', 'n', 'r', 's', 't', 'u', 'u', 'y', 'z', 'A', 'C', 'D', 'E', 'E', 'I', 'N', 'R', 'S', 'T', 'U', 'U', 'Y', 'Z', 'a', 'l', 'l', 'r', 'A', 'L', 'L', 'R', 'o', 'u', 'S', 'O', 'U', 'oe', 'ae', 'a', 'a', 'c', 'e', 'e', 'e', 'i', 'i', 'o', 'u', 'u', 'y', 'OE', 'AE', 'A', 'A', 'C', 'E', 'E', 'E', 'I', 'I', 'O', 'U', 'U', 'Y' ),

Attention: you should add only marks, you really need, because function will work slower while adding many marks. It can translate into differences in generating of whole script.

Sometimes mail() function integrated in PHP is disabled on your server. To make replacement, you should know basics about FTP connection and a little about PHP. Example below is based on Quick.Cart version 1.2 (or newer) and PEAR MAIL package version 1.1.9.

What should you do?

• You should download package MAIL and packages related with it (dependies) like: PEAR, Net_SMTP, NET_Socket.

• Packages should be placed in directories like:
  • PEAR (tested version 1.4.9) - file PEAR.php in the shop main directory,
  • MAIL (tested version 1.1.9) - file Mail.php in the shop main directory, Mail directory (from package) place in main directory of the shop,
  • Net_SMTP (tested version 1.2.8) - file SMTP.php place in Net directory in the shop (create it, if it does not exist),
  • NET_Socket (tested version 1.0.6) - file Socket.php place in Net directory of the shop.

• After installation of MAIL package and related files, you should replace code in Quick.Cart in file core/common.php function sendEmail(). Content of that function for replacement you will find here: mail-alternative.php.

Google Analytics tool gives you great possibility to track websites and also e-commerce transactions. Makeing an analysis of this data will help you to create more user-friendly shops according to usability.

What should be done to add tracking code to websites and transactions?

• Create Google Analytics account on http://www.google.com/analytics/indexu.html site. (From field placed at the top of the site, you can choose language).
• Log in to the new account and add there website profile - use Add Website Profile » link, (website which profile you want to add have to be on-line available).
• After adding new profile, you will see tracking code displayed in the text box. Copy this code. If you didn’t copy this code just after adding profile, you can do this later by clicking in ‘Website Profiles’ table next to the profile in ‘status’ column link ‘check status’.
• Open file templates/container.tpl and paste copied earlier code into two blocks: BODY and ORDER_BODY just before ending tag of blocks. After executing this, you should see in ‘Website Profiles’ table in ‘status’ column that checking started. It can take 24h. After this time, you should be able to see there information ‘Receiving Data’.

Following steps show how to add e-commerce transaction tracking code to Quick.Cart.

• In ‘Website Profiles’ table, next to the name of profile, click ‘edit’ link.
• On the Profile Settings page, click edit next to header Main Website Profile Information.
• Change the E-Commerce Website radio button from ‘Not an E-Commerce Site’ to ‘Yes, an E-Commerce Site’.
• Open file templates/orders_print.tpl.
• Find code: <!– BEGIN ORDER_PRINT –> and add after it following code:

<script src="http://www.google-analytics.com/ga.js" type="text/javascript"></script>
<script type="text/javascript">
  var pageTracker = _gat._getTracker("UA-xxxxxxx-x");
  pageTracker._initData();
pageTracker._addTrans(
    "$aOrder[iOrder]",                      // Order ID
    "",																			// Affiliation
    "$aData[sOrderSummary]",                // Total
    "",                                     // Tax
    "$aOrder[sPaymentCarrierPrice]",        // Shipping
    "$aOrder[sCity]",                       // City
    "",																			// State
    ""                                      // Country
  );
</script>

ATTENTION: Code UA-xxxxxxx-x should be replaced by your own id. You can find it in code which you have added earlier to file templates/container.tpl. Copy it and paste to this file also.

• Also in file templates/orders_print.tpl just below code<!– BEGIN ORDER_PRINT_LIST –> paste:

<script type="text/javascript">
pageTracker._addItem(
    "$aOrder[iOrder]",                      // Order ID
    "",                                     // SKU
    "$aData[sName]",                        // Product Name 
    "",																			// Category
    "$aData[sPrice]",                       // Price
    "$aData[iQuantity]"                     // Quantity
  );

  pageTracker._trackTrans();
</script>

• Click link ‘View Reports’ next to the profile name in ‘Website Profiles’ table. You should be able after a while, see raports for sites and transactions (if there were visits and transactions after adding tracking code).

We developed a range of additional script security protections, which should efficently prevent assailants from intercepting classified data. It’s worth underlining the script has no gaps or errors which could be utilized by the assailants but there are couple of issues to be analyzed and maybe enhanced:

• You should not write login data on FTP clients (e.g. Total Commander). There are programs of the sort of trojan horses, which allow the assailants to intercept this data and access to Your data.
• It’s worth coming up with an uncommon login and password to the admin panel, including letters, digits and of considerable length. Often the default login ‘admin’ is being adapted by the user - this makes a brake in easier.
• You may hinder access to the admin panel from the browser level. To do so You have to change the filename of admin.php file which you can find in the main folder for another, for example: panel.php. After this change the admin panel will be called up at the browser with www.my-page.pl/panel.php address.
• The last possibility is to move the ‘db’ folder outside ‘public_html’ folder. An extra operation that has to be done after such a modification is to change a line in config/general.php:

$config['dir_db'] = 'db/';

to:

$config['dir_db'] = '../db/';

• Be carefull if you want to install some scripts or addons you don’t know. Hackers commonly use such popular scripts vulnerability to hack your site. So we advise you to not install for example any file maganers for WYSIWYG, because it is usually not secure enough and vulnerable.