How to create a Custom Content Management solution

Here's an example of how to develop a custom content management solution from Spring 2016's Flautas Consulting team. The intended functionality was to allow users to create custom forms with dynamic form content (textboxes, etc.) for the client to record testing of donated goods.

The proposed system will be using PHP (with HTML and CSS to stylize/design) and MySQL to handle the client’s desired functions. Our development environment will consist of WAMP server for testing code/system on the developers’ local machines and a virtual server hosted by a third party (GoDaddy) which will be the permanent system host after deployment. A combination of software will be used to produce the PHP, HTML, CSS, and MySQL code such as text-editors (Notepad++, Sublime, etc.), CodeLobster IDE, and phpMyAdmin.

Creating a Database - MySQL Database

MySQL Database is accessible through cPanel.

  1. Go to cPanel
  2. Type in your credentials 
  3. Click on the MySQL Database located in the “Databases” section of the page.
  4. Enter unique title for new Database in textbox under Create New Database.
  5. Add a new user to have database access unless the users are already created.
  6. Give the user access to the new DB under “Add User to Database” section.
  7. Choose privileges for new user - if this is for the Master user, give them full access.
  8. Now return to cPanel and go to phpMyAdmin under Databases.
  9. The newly created database will be accessible in the left-hand panel now.
  10. Create any tables needed such as tblEmployees to start building the database.

Accessing the Created Database

  1. In cPanel, go to the Databases section and select phpMyAdmin to access the backend of the site.
  2. Open up the target database and there you can access all tables and stored procedures created for the system.
  3. Table information, database relationships, and stored procedures can be seen below.
  4. Any changes on this server will be permanent in nature and affect the entire site. Be careful when modifying tables and check with a supervisor before dropping anything. Deleting certain fields may cause other tables to break.
  5. Use the web interface created by the MIS team for any routine changes.


Installing Apache Web Server -with WAMP server

Since PHP is a server-side language, you need a web server that can interpret PHP in order to use the PHP functionality of your file. The GoDaddy service (cPanel) has a server that supports PHP. So deploying files to the server with PHP embedded will work. The issue is that you do not wish to use the online server to preview your ongoing developing. In order to preview your PHP files you must install a PHP enabled server on your workstation.


We installed a package called WAMP Server to our Windows workstations(laptops).  WAMP stands for Windows, Apache, MySQL, PHP. WAMP allows us to install Apache web server, MySQL, and PHP on our WINDOWS workstations(laptops). This package only works on WINDOWS computers and will not work on other operating systems such as linux or macosx.


  1. To install WAMP server you must go to the following link: http://www.wampserver.com/ (Links to an external site.)
  2. Once on the site you want to select the appropriate download option
    1. Note: There will be different download options available and you should select the appropriate download taking into consideration your version of Windows and the version of PHP that your host server is using to ensure full compatibility.
  3. Once the package is downloaded click on the package and follow the prompts for installation.
    1. Note: The default values in the prompts should suffice for installing to your workstation. It is not necessary to change the default values.
  4. Once WAMP server is installed you will have an icon on your taskbar that will change colors to indicate whether the services (Apache and MySQL) are running or not.
  5. To start/stop the services left click on the icon and select start/stop all services.
  6. If you wish to preview your PHP enabled files you must ensure that all services have been started and the file you wish to preview is in the ‘WWW’ folder in the WAMP directory on your machine
    1. the WAMP directory is in the location specified during the installation process .The default location is the C: drive.
  7. You can then preview that file by using the preview functionality of your IDE or manually by opening a browser and typing http://localhost/ (Links to an external site.) (file in WWW folder)
    1. Example for manually viewing your file in a browser: http://localhost/index.php (Links to an external site.)
  8. In order to successfully view the files you must ensure that services are running. If services are not running expect the functionality of the file to be limited

Web-Interface - CodeLobster for PHP and Web Design

For creating and editing PHP, we have used CodeLobster as our preferred IDE. This free software allows easy-to-use HTML & CSS editing while also supporting PHP functionality behind the interface. Javascript, JSon and other coding languages are also supported.

CodeLobster is available at the following link: http://www.codelobster.com/download.html (Links to an external site.)

  1. Once codelobster is downloaded you must click on the downloaded file and follow the prompts for installation
  2. Once installed select File then new project
  3. When creating a new project a popup will prompt you for information regarding the project such as location, project name, and base url for debug:
  4. You can specify the name of the project and location where the project will be stored on your computer. It is not necessary to change the base url for debug.
    1. Note: you should select the location from which your server is operating on if you wish to use the native preview function that codelobster uses to display your php enabled files. In our scenario you would set the location in a folder within the “www” directory in the “WAMP”/”WAMP64” server folder.
  5. Once in a you created project you can add php, html, css, and other files by selecting File->New-> and the desired file type that you want to add to your project.

Database Overview

ERD Diagram:

Goodwill E-Commerce ERD

  • tblEmployees
    • Stores login information for managers and employees
    • Manager - TRUE if Manager capabilities
    • EmployeeIDs start at 10000
  • tblProducts
    • Stores Products that have been created by managers for testers to select
    • ProductIDs start at 1
  • tblTestingItems
    • Stores Testing items that testers have initialized based on a certain Product type
    • Also records timestamp when the item was created
    • EmployeeID associates with employee that tested this item
    • TestingIDs start at 1
  • tblDescriptions
    • Stores Descriptions created by Managers associated with Product forms
    • Each Description is either classified as either a Spec, Testing, or Includes - this is stored under STIClassification
    • Each Description is also associated with a Category that helps filter the Create Product form
    • DecriptionIDs start at 1
  • tblProductForms
    • Stores Managers choice of checked or unchecked as a bridge between tblProducts and tblDescriptions
    • IfChecked is “checked” when a Manager wants the Tester to see this Description associated with the specific Product (“unchecked” leaves it invisible on the Tester side)
  • tblCategories
    • Stores Categories created by Managers that classify Descriptions as either General or electronic type specific
    • CategoryIDs start at 1
  • tblResponses
    • Stores Responses recorded by testers as a bridge between tblDescriptions and tblTestingItems
    • Also records timestamp when the item was created
  • tblNotes
    • Stores Note responses recorded by testers at the bottom of Testing forms
    • Does not have to exist for each TestingItem
    • Also records timestamp when the item was created
    • NoteIDs start at 1