Order pages in HostBill are divided in two groups:

  1. Wizard – multi step checkout
  2. One-step – ajax based, all in one page

1. Wizard cart templates

It’s the easiest type to create, it has five additional steps that will be used to help in the order process, we only need to create the first step.
To create a new cart template you will have to:

  1. Create a template file with a unique name
    • /templates/orderpages/cart_yourorderpage.tpl
  2. Add metadata with name and desctiption
  3. Define each step template.

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

With this type of cart template you can create pages that will immediately create new order after submission, without the need for additional step for configuration.
You can create pre-set options for each product or use ajax to allow configuration from within that page.
To create a new one-step cart template you will have to:

  1. Create a template file with a unique name
    • /templates/orderpages/onestep_yourorderpage.tpl
  2. Add metadata with name and description

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 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

When dealing with prices you should use 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 currency
  • format – boolean, default true, print currency code and sign