When designing a store page, it is often necessary to display lists of information; such as a list of the orders placed by a customer in the Customer Account Area. However, when designing the template that displays the customer’s order history, the template’s designer has no idea how many orders will be listed for any given customer.
Customer A may have three orders associated with their account that need to be displayed, but Customer B may have fifteen thousand*.
Since the same template will be used to display the order history for all customers, the designer will need a method to dynamically build and display the order history list, no matter how many entries it may have for a specific customer. Displaying a list with an ever-changing number of entries is achieved by using a special type of QuickCode Tag called Block Tags.
reference
A listing of all the QuickCode Block Tags that are available can be found in the online QuickCode Tag Glossary.
QuickCode Block Tags always come in pairs, with a “block begin” tag and a “block end” tag. Block Tags wrap around HTML content in your templates that may vary in length, depending on the number of items to be listed. The HTML content within the block tags will be repeated for each item on the list when the page is viewed in a web browser.
Continuing with the example of a template for displaying the customer’s order history, the following QuickCode Block Tags could be used in the template’s HTML source code to display a dynamic list, varying in length for each customer:
example: quickcode tag block source code
<!--- BEGINNING OF BLOCK TAG CODE SAMPLE -->
{ORDER-HISTORY-BLOCK-BEGIN}
<p><b>{ORDER-HISTORY-ORDER-ID}</b>: Placed on {ORDER-HISTORY-ORDER-DATE}</p>
{ORDER-HISTORY-BLOCK-END}
<!--- ENDING OF BLOCK TAG CODE SAMPLE -->
A customer with an order history containing three orders would see something like this when they viewed this page:
example: quickcode tag block when viewed in web browser
10012: Placed on 01/27/2011
10107: Placed on 02/19/2011
10255: Placed on 4/13/2011
By using the Block Tags, the web designer only needs to create the source code to display an item in the order history list once. When that storefront page is viewed in a web browser, the system will automatically repeat the source code found between the block's BEGIN and END tags over and over for each item to be listed.
Any HTML, PHP, JavaScript, CSS or QuickCode Tags can be included between a set of Block Tags. The Block Tags will simply repeat what’s between them as many times as necessary. With this in mind, be sure that any HTML, PHP, JavaScript, CSS or QuickCode tags that you open within a set of blocks are also closed within that set of blocks.
For example, if you start bolding some text using the HTML <b> tag within a block, be sure to also close the bold tag with </b> within the same block… or you’ll end up lots and lots of bold text on your page with no tags to give the command to stop bolding**!
*Give or take twelve.
**Chaos ensues.
|