Steps to get FileMaker Pro to serve databases

By: James Reynolds - Revised: 2006-06-08 devin

  • Open your database file.
  • Enable web companion for THAT FILE.
    • Menu: "File:Sharing",

The menu to open the sharing dialog box
    • Click in Web Companion "Sharing" checkbox. The file should be "Single User" (unless you know what "Multi-User" does and want that).

File Sharing dialog box
  • Do a survey of which fields you will want to either edit or extract data from for all web pages.
  • Create a new layout.

The menu to create a new layout
    • Use a standard name like "web" or something. Use a standard layout name so that you can have a bunch of databases with the same name that it is easy to remember.

The menu to open the sharing dialog box
    •   Delete all the undesired fields.

The new layout with the undesired fields deleted
  • Take a snapshot (Command-Shift-3) or write down the field names elsewhere. You will need these field names when creating the web pages, which is the next step.
  • Create HTML pages to search and display records. You can do all of this in Dreamweaver or other wysiwyg editor.
    Examples:
<html>
<head>
<title>Untitled Document</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
</head>
<body bgcolor="#FFFFFF">
<p align="center">Search for a book!</p>
<p>&nbsp;</p>
<form method="post" action="">
<p>title
<input type="text" name="textfield">
</p>
<p>authorNameLookup
<input type="text" name="textfield2">
</p>
<p>CallNumbers
<input type="text" name="textfield3">
</p>
<p>copyrightDate
<input type="text" name="textfield4">
</p>
<p>
<input type="submit" name="Submit" value="Submit">
</p>
</form>
<p>&nbsp;</p>
</body>
</html>

<html>
<head>
<title>Untitled Document</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
</head>
<body bgcolor="#FFFFFF">
<div align="center">
<p>Search Results</p>
<table width="100%" border="1">
<tr>
<td width="41%">
<p align="left">title </p>
</td>
<td width="49%"> authorNameLookup </td>
<td width="10%">&nbsp;</td>
</tr>
<tr>
<td width="41%">field data...</td>
<td width="49%">field data...</td>
<td width="10%">view</td>
</tr>
</table>
<p>&nbsp;</p></div>
</body>
</html>

<html>
<head>
<title>Untitled Document</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
</head>
<body bgcolor="#FFFFFF">
<p align="center">Record Detail</p>
<p>&nbsp;</p>
<p><b>bookId:</b> field data</p>
<p><b>title:</b> field data</p>
<p><b>authorId:</b> field data</p>
<p><b>authorNameLookup: </b>field data</p>
<p><b>CallNumbers: </b>field data</p>
<p><b>copyrightDate: </b>field data</p>
<p><b>bookURL: </b>field data</p>
<p align="center">New Search</p>
</body>
</html>

  • Insert CDML tags into the web pages just created.
    • Anywhere "field data" is typed, replace it with "[FMP-Field:fieldname]"
      Examples:
search_results.html – HTML-File, 755 bytes
<html>
<head>
<title>Untitled Document</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
</head>
<body bgcolor="#FFFFFF">
<div align="center">
<p>Search Results</p>
<table width="100%" border="1">
<tr>
<td width="41%">
<p align="left">title </p>
</td>
<td width="49%"> authorNameLookup </td>
<td width="10%">&nbsp;</td>
</tr>
<tr>
<td width="41%">[FMP-Field:title]</td>
<td width="49%">[FMP-Field:authorNameLookup]</td>
<td width="10%">view</td>
</tr>
</table>
<p>&nbsp;</p></div>
</body>
</html>

record_detail.html – HTML-File, 864 bytes
<html>
<head>
<title>Untitled Document</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
</head>
<body bgcolor="#FFFFFF">
<p align="center">Record Detail</p>
<p>&nbsp;</p>
<p><b>bookId:</b>[FMP-Field:bookId]</p>
<p><b>title: </b>[FMP-Field:title]</p>
<p><b>authorId:</b>[FMP-Field:authorId]</p>
<p><b>authorNameLookup: </b>[FMP-Field:authorNameLookup]</p>
<p><b>CallNumbers: </b>[FMP-Field:CallNumbers]</p>
<p><b>copyrightDate: </b>[FMP-Field:copyrightDate]</p>
<p><b>bookURL: </b>[FMP-Field:bookURL]</p>
<p align="center">New Search</p>
</body>
</html>

    • Anywhere multiple records will appear, surround it with "[FMP-Record]...[/FMP-Record]". To do this properly, you will need to view the source code!
      Examples:
search_results.html – HTML-File, 735 bytes
<html>
<head>
<title>Untitled Document</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
</head>
<body bgcolor="#FFFFFF">
<div align="center">
<p>Search Results</p>
<table width="100%" border="1">
<tr>
<td width="41%">
<p align="left">title </p>
</td>
<td width="49%"> authorNameLookup </td>
<td width="10%">&nbsp;</td>
</tr>
[FMP-Record]
<tr>
<td width="41%">[FMP-Field:title]</td>
<td width="49%">[FMP-Field:authorNameLookup]</td>
<td width="10%">view</td>
</tr>
[/FMP-Record] </table>
<p>&nbsp;</p></div>
</body>
</html>

    • Anywhere there is a form, replace it with:
<form action="FMPro" method="post">
<input type="hidden" name="-DB" value="database_filename">
<input type="hidden" name="-Format" value="target_filename.html">
<input type="hidden" name="-Max" value="all">
...
<input type="text" name="fieldName" value="">
...
<input type="submit" name="-Find" value="text in browser...">
</form>

Examples:
search_begin.html – HTML-File, 889 bytes
<html>
<head>
<title>Untitled Document</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
</head>
<body bgcolor="#FFFFFF">
<p align="center">Search for a book!</p>
<p>&nbsp;</p>
<form method="post" action="FMPro">
<input type="hidden" name="-DB" value="Books">
<input type="hidden" name="-Format" value="search_results.html">
<input type="hidden" name="-Max" value="all">
<p>title
<input type="text" name="title">
</p>
<p>authorNameLookup
<input type="text" name="authorNameLookup">
</p>
<p>CallNumbers
<input type="text" name="CallNumbers">
</p>
<p>copyrightDate
<input type="text" name="copyrightDate">
</p>
<p>
><input type="submit" name="-Find">
</p>
</form>
<p>&nbsp;</p>
</body>
</html>

    • Anywhere there is a link, replace it with:

      For a detail page:
<a href="FMPro?dB=database_filename&-Format=target_format_file&field_name=data&-Max=1&-Find"> ...</a>

or for a detail page that uses a field named "id":
<a href="FMPro?dB=Books&-Format=>record_detail.html&id=[FMP-Field:bookId]&-Max=1&-Find">view</a>

For a page that does not pull any data from FileMaker Pro:
<a href="FMPro?dB=database_filename&-Format=target_format_file&-View">...</a>

Examples:
search_results.html – HTML-File, 826 bytes
<html>
<head>
<title>Untitled Document</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
</head>
<body bgcolor="#FFFFFF">
<div align="center">
<p>Search Results</p>
<table width="100%" border="1">
<tr>
<td width="41%">
<p align="left">title </p>
</td>
<td width="49%"> authorNameLookup </td>
<td width="10%">&nbsp;</td>
</tr>
[FMP-Record]
<tr>
<td width="41%">[FMP-Field:title]</td>
<td width="49%">[FMP-Field:authorNameLookup]</td>
<td width="10%"><a href="FMPro?-DB=Books&-Format=record_detail.html&id=[FMP-Field:bookId]-Max=1&-Find">view</a></td>
</tr>
[/FMP-Record] </table>
<p>&nbsp;</p></div>
</body>
</html>

record_detail.html – HTML-File, 751 bytes
<html>
<head>
<title>Untitled Document</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
</head>
<body bgcolor="#FFFFFF">
<p align="center">Record Detail</p>
<p>&nbsp;</p>
<p><b>bookId:</b> [FMP-Field:bookId]</p>
<p><b>title: </b>[FMP-Field:title]</p>
<p><b>authorId:</b> [FMP-Field:authorId]</p>
<p><b>authorNameLookup: </b>[FMP-Field:authorNameLookup]</p>
<p><b>CallNumbers: </b>[FMP-Field:CallNumbers]</p>
<p><b>copyrightDate: </b>[FMP-Field:copyrightDate]</p>
<p><b>bookURL: </b>[FMP-Field:bookURL]</p>
<p align="center"><a href="FMPro?-DB=Books&-Format=search_begin.html&-View">New Search</a></p>
</body>
</html>

  • Place these files in the Web folder.
  • Open the first page in your browser.
  • Debug! (if you have a good eye, you will notice many mistakes that I made).
  • Make the pages pretty with your favorite WYSIWYG editor and graphics program.