shopping cart, shopping cart software, shopping cart system, ecommerce shopping cart, agora shopping cart, free shopping carts, agoracart
The Official Website of AgoraCart and Agora.cgi
Home Free Downloads Online Manuals Support Forum Help & Support Join Now! Members Only

AgoraCart

> About
> Features
> Talking Guide
> Supported Gateways
> Free Download

In Action

> Online Cart Demos
> Shop Live Agora Sites

Cart Add-ons

> Add-ons & Downloads
> DBwizz Database Mgr.
> Security Updates
> Buy it @ Pro Shop

Help & Support

> Online Documentation
> Installation Guide
> User Support Forum
> Become a Member
> Customizations
> Help & TechSupport
> ASP Service Providers

Members Only

> Info & Benefits
> Join Today!
> AgoraCartPro.com
> Members Home Page
> Members Only Forum
> Member Downloads

Merchants Corner

> Merchant Accounts
> Payment Gateways
> Web Hosting Search
> Cool Resources
> Advertise in AgoraCart
> "Powered by" Logos

ASPP Program

> Authorized Providers
> Get ASPP Authorized

AgoraCart Project

> Project Team
> Make a Donation
> Founders Club
> Investment Opps

How to Integrate AgoraCart into an Existing Design

How do I use my own website template with AgoraCart?

Tutorial by CJ Marley - The HTML Doctor & The CGI Doctor (edited by Mister Ed)

Most shop owners want to make the AgoraCart match the rest of their website. If you're new to AgoraCart this may look like a daunting task, but it's not. First thing to do is to have a template page to use. If you don't have a tempate you've been using to make webpages for your site, then you can make a quick template from one of your other pages like your index page. (Please keep in mind that that following instructions are written for those who are new at html so that all levels of understanding can work on their carts).


Save a separate copy of your index page and name it template.html. Now open your index page on the website in your browser. Take note of where your headers and navigation are. Take a look at where the main content of your page reside. The main content is what you will replace with the cart contents. Note where the footer is on the page. I suggest that you leave the browser open to compare to while you are working on the template so that you know where to cut things. Even as a professional web designer... I use this method to help me cut up pages into templates for the agoracart.


Here is some sample page code. It's very basic. Your code can be drastically different but I think this will help you visualize what I am telling you:

<html>
<head>
</head>
<body>
<table><tr><td colspan=2>Header contents</td></tr>
<tr><td>navigation contents</td>
<td>main contents</td></tr>
<tr><td colspan=2>footer contents</td></tr></table>
</body>
</html>


Compare what you see in the browser to the code you see in the page you saved as template.html. Now find where that main content is in the template file. Basically what you will do for the agora cart is copy everything under the body tag to just before the main contents and put it into your header files...this would include the <td> tag that you see before "main contents". You would then copy everything you see after main contents including </td> until right before the </body> and paste it into the footer files.

Example:
This would go into the header files -
<table><tr><td colspan=2>Header contents</td></tr>
<tr><td>navigation contents</td>
<td>

This would go into the footer files -
</td></tr>
<tr><td colspan=2>footer contents</td></tr></table>


However, take note before pasting into the header template files in agora that there is some existing code there that you have to decide whether or not if you want to keep. For one, there is a search box already in place for the agora cart. If you do not wish to offer a search box to your customers that you can overwrite this. Secondly, there there is what is called "agorascript". The first agorascript on the page displays category links automatically for you. The second set displays some preset links such as "Home", "Return Policy", "About Us", and "Contact Us". The third set displays the customers current cart amount and the checkout and view cart links. This is something you may definitely want to leave in for your customers convenience. You can decide what if you which to leave any of this any there or remove any of them. I recommend that at the very least leave in the third agorascript on the page for the convenience of your customers. It will take a little work to get the existing agorascript worked into your own template.

Remember, any tags that you open at the end of the header file, you need to close in the footer file.


Site Meter