When developing web applications, if you are using a database, designing it first is essential. The database used in this tutorial has a very simple and clear structure. It uses only two tables:
Note: The database diagram in the image above was built with MX Query Builder (an InterAKT product, also referred as QuB) to better illustrate the database structure. You do not need to build it in order to complete this tutorial.
The menu_mnu table stores data about menu items:
Note: Click here to check out the required database table structure when creating database-driven menus with the Database-driven CSS Menu component. Consult this tutorial if you want to learn how to generate menus using another table structure.
id_mnu - menu item ID.
idmnu_mnu - ID of the parent menu item (NULL for the first-level items).
label_mnu - menu item name.
tooltip_mnu - menu item tooltip (alternative text).
order_mnu - menu item order.
visible_mnu - it specifies if a menu item is visible or not (1/0 values).
url_link_mnu - complete URL link to which the item points (it includes the passed URL parameters and their value).
Note: The URL element column can also store only the URL parameter value, that helps building the link. Click here to see an example for this situation.
target_mnu - target type of the page that opens.
The product_prd table stores data about software products:
id_prd - product ID.
name_prd - product name.
logo_prd - product logo filename.
tagline_prd - product slogan.
shdesc_prd - product short description.
desc_prd - product description (presentation).
There is no relation between the two tables.
To quickly create the database structure, use the scripts provided in the .zip package (either .sql or .mdb) corresponding to your database server. You can find the scripts in the \tutorials\InterAKT table structure\db folder.
Note: The available .sql or .mdb scripts can be used for the PHP server model. If you are an ASP VBScript or ColdFusion user, edit the provided script first: change the values in the url_link_mnu column from the menu_mnu table, by replacing the .php extension (included in the URL links) with .asp/.cfm.
Before you start building the actual application, there are a few things that you should do/know:
Create a new site in Dreamweaver and make sure it is correctly configured: set the Local Info, Remote Info, and Testing Server options (since you are using a database, a server model is required).
Your site will have four pages, but right now only create one of them, in the site root, and name it home. You will create the other three based on this one (you will be told when and what to name them).
Open the home page and define a Dreamweaver database connection: conn_InterAKT_table. Configure it to connect to your database server and make it point to the database containing the tables described above.
From the \tutorials\Another table structure folder in the package, copy the logos folder in the local site root. It contains all the image files (product logos) used in this tutorial - the image names are stored in the database table provided.
Note: For more instructions on how to configure your site and how to create the database connection, consult the Getting started help file. It can be accessed in Dreamweaver from the Help menu, InterAKT -> Getting Started.
Continue with the next topic to build the CSS layout and generate the database-driven menu in the home page.