In this exercise, we are going to start creating the application framework for our Beelze-Bubba site. We will start by creating a root-level Application.cfm file and adding some global variables to the file. Because we will eventually be securing our Admin directory (it's the next step as a matter of fact), we are going to include an Application.cfm file in this directory as well. -
Open your text editor and type the code in Listing 8.3. Listing 8.3 Application.cfm <!--- File: Application.cfm Description: Beelze-Bubba application settings Author: Created: ---> <!--- Use the cfapplication tag to create an application and enable session management ---> <CFAPPLICATION NAME="BBWebApp" SESSIONMANAGEMENT="Yes" SESSIONTIMEOUT="#CreateTimeSpan(0,0,20,0)#"> <!--- settings to make our application more portable ---> <!--- set the name of our database DSN ---> <CFSET BBWebAppDSN="BBData"> <!--- create a variable that maps to our images ---> <CFSET AppImagePath="http://CGI.Server_Name#/NewSite/Images"> <!--- set webmaster email ---> <CFSET WebmasterEmail="info@beelze-bubba.com"> -
Save this file in the NewSite (root) folder. This file uses the <CFAPPLICATION> tag to create the application, give it a name, enable session variables, and give them a timeout of 20 minutes. The file also sets the value of some global variables. Using these values in our code will make the application more portable. For example, do you remember from Step 2 all the fuss we had to go through to make sure the image paths we used in our includes would work correctly? Well, if we set one variable in our Application.cfm file that maps out the path to our Images directory, we can then use that variable whenever we need to add an image. In addition, if we ever move the application or change the name or path of the Images directory, we can update all our image paths by changing this one line of code. We also create a variable to represent our DATASOURCE name and webmaster's email address. -
Let's retrofit our web site to use these variables. Open the Header.cfm file from the NewSite\_includes folder. Change the SRC attribute of all the <IMG> tags to use the AppImagePath variable we created in our Application.cfm file. Also change the mailto: link to use the new WebmasterEmail variable. The changes are highlighted in bold in Listing 8.4. Listing 8.4 Changes to Header.cfm [View full width] <!--- File: Header.cfm Description: File header table for all files Author: Created: ---> <!--- start header table ---> <!--- add variable set in the Application.cfm template Don't forget to 'escape' the # symbols in the Hex color Codes that appear between CFOUTPUT tags---> <CFOUTPUT> <TABLE WIDTH="735" BORDER="0" CELLPADDING="0" CELLSPACING="0" ALIGN="center"> <TR BGCOLOR="##CC0000"> <TD WIDTH="559" HEIGHT="79" VALIGN="middle" BGCOLOR="##FFFFFF"> <IMG SRC="#AppImagePath#/logo.gif" WIDTH="266" HEIGHT="100" VSPACE="2"> </TD> <TD VALIGN="bottom" WIDTH="202" ALIGN="right" BGCOLOR="##FFFFFF"> <A HREF="mailto:#WebmasterEmail#"> <IMG SRC="#AppImagePath#/email.gif" WIDTH="150" HEIGHT="27" BORDER="0" ALT="send us some email"></A> <A HREF="http://CGI.Server_Name#/NewSite/Feedback/FeedbackForm.cfm"> <IMG SRC="#AppImagePath#/feedback.gif" WIDTH="150" HEIGHT="24" VSPACE="3" BORDER="0" ALT="please let us know what you think"></A> </TD> </TR> <TR BGCOLOR="##333333"> <TD HEIGHT="8" VALIGN="top" BGCOLOR="##FF6600" background="#AppImagePath#/bar.gif"> </TD> <TD VALIGN="top" BGCOLOR="##FF6600" ALIGN="right" background="#AppImagePath#/bar.gif" height="8">#DateFormat(Now(),"MMMM DD, YYYY")# </TD> </TR> <TR BGCOLOR="##333333"> <TD HEIGHT="16" VALIGN="top" BGCOLOR="##FFFFFF"> </TD> <TD VALIGN="top" BGCOLOR="##FFFFFF"> </TD> </TR> </TABLE> </CFOUTPUT> <!--- end header table ---> -
Save the file and browse to the home page to make sure all your image links work correctly. Click the Email Us link to make sure the email link functions properly. -
Let's quickly update one of our queries with the BBWebAppDSN variable. Open the ProductList.cfm template from the NewSite\Products folder. Find the query at the top of the page and update the DATASOURCE attribute to use the BBWebAppDSN variable, as follows: <CFQUERY NAME="qProducts" DATASOURCE="#BBWebAppDSN#"> SELECT ProductNo, Name, Description, Category, Price, ImageFile, OnSpecial, SpecialPrice FROM Products WHERE Category = '#URL.Category#' </CFQUERY> -
Save the file. Browse to one of the product category listings to make sure the query still works. -
Continue to retrofit all queries and images to use the Application.cfm variables. In the next step, we are going to learn how to secure the Admin directory so that only authorized users can access the administration functionality. To do this, the Admin directory is going to need some additional application settings that the rest of the site does not need, so we are going to create a second Application.cfm file in that directory. -
Open your text editor and type the code in Listing 8.5. Listing 8.5 Admin Application.cfm <!--- File: Application.cfm Description: Application settings for the Admin subdirectory Author: Created: ---> <!--- include all setting from the root level Application.cfm file ---> <CFINCLUDE TEMPLATE="../Application.cfm"> <!--- additional security code will go here ---> -
Save this file as Application.cfm in NewSite\Admin. Because the templates in the Admin subdirectory will still need to use the variables from the root level Application.cfm file, we have used <CFINCLUDE> to include them in the Admin\Application.cfm file. In the next step, we will add the code to secure the Admin directory. |