Orderpages
-
- Wizard – multi step checkout
- One-step – ajax based, all in one page
1. Wizard cart templates
-
- Create a template file with a unique name
/templates/orderpages/cart_yourorderpage.tpl
- Add metadata with name and description
- Define each step template.
- Create a template file with a unique name
The example on the right is a basic working wizard template, it lets you progress to the next step that will handle things like domain and product configuration.
Most HostBill wizard order pages reuse the same templates for steps other than the first one, but you are free to create your own templates for them.
cart_yourorderpage.tpl
{*
@@author:: Your name here
@@name:: Example name
@@description:: Orderpage example description
@@thumb:: url/to/thumbnail.png
@@img:: url/to/preview.png
*}
<script type="text/javascript" src="{$orderpage_dir}common
/cart.js?step={$step}"></script>
{include file='cart.progress.tpl'}
{if $step==0}
{* Your orderpage html here*}
{foreach from=$products item=product}
<strong>{$product.name}</strong>
{$lang.price}: {include file='common/price.tpl'}
<a href="{$ca_url}cart&action=add&id={$product.id}
&cat_id={$current_cat}">{$lang.order}</a><br/>
{/foreach}
{elseif $step==1}{include file='cart1.tpl'}
{elseif $step==2}{include file='cart2.tpl'}
{elseif $step==3}{include file='cart3.tpl'}
{elseif $step==4}{include file='cart4.tpl'}
{elseif $step==5}{include file='cart5.tpl'}
{/if}
2. One-step cart templates
You can create pre-set options for each product or use ajax to allow configuration from within that page.
-
- Create a template file with a unique name
/templates/orderpages/onestep_yourorderpage.tpl
- Add metadata with name and description
- Create a template file with a unique name
Example on the right shows minimum required for a one-step template to work.
If you wish to use ajax for your page, you will have to create another template file with ajax
prefix, in case of our example it would be ajax.onestep_yourorderpage.tpl
. Ajax request can be made to ?cmd=cart
, all data related to order are stored in a session and can later be accessed in templates under $cart_contents
variable.
Additional configuration for addons, subproducts, forms or domains need to be handled from within this page. On how to pass different parameters for those items please refer to current one-step templates or use specially prepared template bits located in /templates/ordepages/common/
-
/common/onestep_forms.tpl
/common/onestep_addons.tpl
/common/onestep_subproducts.tpl
/common/onestep_domains.tpl
onestep_yourorderpage.tpl
{* @@author:: Your name here @@name:: Example name @@description:: Orderpage example description @@thumb:: url/to/thumbnail.png @@img:: url/to/preview.png *} <form action="?cmd=cart&cat_id={$current_cat}" method="post"> <input type="hidden" name="make" value="order" /> <input type="hidden" name="cycle" value="a"/> {foreach from=$products item=product} <strong>{$product.name}</strong> {$lang.price}: {include file='common/price.tpl'} <input type="radio" name="id" value="{$product.id}" /> <br /> {/foreach} {foreach from=$gateways item=module key=mid} <input type="radio" name="gateway" value="{$mid}" /> {$module} {/foreach} {if $tos} <input type="checkbox" value="1" name="tos"/> {$lang.tos1} <a href="{$tos}" target="_blank">{$lang.tos2}</a> {/if} <input type="submit" value="Checkout"/> </form>
Usefull smarty variables
-
$template_dir
– url to your current client area template directory$orderpage_dir
– url to your orderpages template directory$currency
– Array with currently selected currency information.$currencies
– list of additional currencies$cart_contents
– array with selected products, addons etc. end their configuration.$categories
– list with other orderpages information
You can find more variables by switching Smarty to debug mode, more about that here
Prices & multi currency
price
smarty modifier together with $currency
variable, this will add currency code, sign and will show recalculated price for that currency.You can use it on any numerical value or variable, for example:
{$product.price|price:$currency}
|price:currency:format
modifier options:
-
currency
– currency id or array with currency information, if omitted uses default currencyformat
– boolean, default true, print currency code and sign