ModularMerchant
MMv4 Knowledge Base
Shopping Cart Software Knowledge Base
If it can be known about the shopping cart software, it is here.
Require service agreement when a specific product is purchased Untranslated Red QuickCode Tags
Home > Shopping Cart Software Components > Administration Area > Design > FAQs & Tutorials > The difference between templates and web pages

The difference between templates and web pages

templates vs. web pages
I'm trying to add an "About Us" page to our store. I've created a new template in my Template Package named about_us.template.php. I would like to view this new page and add a link to it. But, when I go to www.mywebsite.com/about_us.template.php, I get a "Page Not Found" error. What is the URL of the new webpage I've added by creating this template?

This is an excellent question. In order to answer it, we must first clarify the difference between templates and web pages. Each serves a specific purpose in the shopping cart software, and they do not function the same as each other.

key concept: web page
For the purpose of this tutorial, a web page is any page in the shopping cart software that is publicly viewable when you visit its URL.

For example, the web address of a storefront's home page may be something like this:
http://www.mystore.com/storefront.php

The shopping cart software includes roughly three-dozen web pages, which are the pages one sees when viewing the storefront: the storefront's product pages, category pages, search results, checkout pages, the customer account area, etc.


The source code of these web pages is not available for editing. This is because these pages are full of scripting code that's busy making database queries, formatting variables and error-checking data. There's no HTML code present in the source code of any of the cart's web pages!


Huh? If the cart's web pages don't contain any HTML code, then what controls their design? The design of a web page's content is controlled by a template.
 

key concept: template
The design (the layout, color scheme, images, etc.) of each of the shopping cart's roughly 36 pages is controlled by a template. Each page of the cart has a corresponding template associated with it.

A set of templates, one for each of the store's webpages, is called a Template Package. (Click here for a list of available templates for use in Template Packages.)

Templates contain the HTML and CSS code that is applied to its corresponding web page. These templates are what's editable within the Design section of the store's Administration Area.

Templates are never viewed directly by a user. The template's corresponding web page is viewed instead. A web page's template is applied to it when the page viewed in the storefront.


Another way to think of it is that there's several steps that take place when a store page is viewed in a web browser. First, before any content is displayed to the user, the web page retrieves information from the store's database. Then, the template for that store web page is loaded by the shopping cart software. Finally, the database information is inserted into the template's HTML code and the page is rendered in the user's web browser.

example
For example, a store's home page is http://www.mystore.com/storefront.php

When the storefront.php web page is loaded, the shopping cart software first runs the series of commands that the storefront.php file contains, such as connecting to the store's database to obtain the information for the products that need to be displayed on that page.

After the storefront.php page runs all its commands and loads all of its data into memory, it then says to itself, "Okay, now that I've obtained all my data. Now I'm ready to render this page in the user's web browser."

The software then goes and looks up the storefront.template.php file from the live Template Package. (If the Template Package does not contain that page's template file, it defaults to using the universal.template.php file in its place.)

The server then uses a series of complex algorithms and hand gestures to mash all of the product data it has stored in memory into the appropriate locations in the storefront template.

After the page's data has been spliced into its template, the completed amalgam is then rendered in the user's web browser. The result: the content obtained by the web page is displayed in the design established by that page's template.
 
So, how do I add more web pages to my store?

There are several tools available to add more custom-made pages to a store. It's recommended that additional pages be added to the store by using one of these two methods:

1) Use the Custom Web Page Editor
The Custom Web Page editor is located in the store's administration area at [Design > Add a Custom Web Page]. This this tool allows additional pages to be added to the store's website. The pages created with this tool will have SEO-friendly URLs, and they have the option to either have custom-made templates applied to them, or stand on their own with no template applied to them. See the Custom Webpage Editor article for more details.

-OR-

2) Upload additional pages to the site via FTP
Silver and higher account plans provide the option to set up a hosting account for a store. This provides a means for a user to create as many web pages as they like using a web design program, such as Dreamweaver, and then upload those pages directly to the website using FTP. See the
connecting to a website using SFTP article for more details.

— Last Edited - 12/23/2011 3:18pm PST
Rank and add a comment to this article
Only logged in users may leave comments and rank articles. Log in to have your say!
  Knowledge Base Home

  QuickCode™ Tag Glossary

  Modular Merchant.com Homepage

Not Logged in.
Either Log in or create a User Account.

Other articles in this category...

Add a "Terms of Service" agreement to a store page

Can QuickCode Tags Be Used in PHP Statements?

Can QuickCode Tags be used on non-store webpages?

Create a custom version of any QuickCode Tag

Create reusable headers/footer with Custom QuickCode Tags

Display sale prices in red text

Have your store match a website that links to it

List of available Templates for use in Template Packages

Playing Flash video instead of downloading it

Require service agreement when a specific product is purchased

The difference between templates and web pages

Untranslated Red QuickCode Tags

Using "Add to Basket" links on your website.

Using comments in Custom QuickCode Tags

Your storefront on smartphones & mobile devices

Creating Template Packages: Part 1 of 4

Creating Template Packages: Part 2 of 4

Creating Template Packages: Part 3 of 4

Creating Template Packages: Part 4 of 4