0 Replies Latest reply on Apr 5, 2015 5:39 PM by Doug Staubach

    Custom Webdirect Home Page

    Doug Staubach

      Title

      Custom Webdirect Home Page

      Your post

      Hi folks:

      My team develops in-house solutions for our company, and we wanted to customize the home page that is displayed to the users, while still providing a dynamic list of databases (like the default home page does).

      Note that this requirement is slightly different from the "Custom Login & Logoff Page" that was solved by Daniel Harlow in this post => Custom WebDirect Logon <= Daniel's solution is better for folks who want to keep users from seeing the list of databases.

      FileMaker has documentation in the FileMaker 13 WebDirect Guide (page 27), and they also provide two sample files on your server (fmwebd_home.html and index.html). -- Unfortunately, I was unable to make any of those solutions work by following the instructions provided.

      The good news is that I found a simple solution, and it seems to work. I combined the two sample files that were provided by FileMaker, and I added a few new lines to allow us to customize the home page for our needs. (I have colored the lines I added in BLUE in the sample code below); all black lines were copied and pasted directly from the FileMaker sample files.

      The URL for your new custom home page is your servername (or server IP address), followed by "/index.html" (like "http://192.168.123.101/index.html" or "https://myserver/index.html")

      I hope this helps other people (like me) who are wanting to customize the home page while still having a dynamic list of databases that have been published in WebDirect.

      UPDATE May 11, 2015 -- also fixes a problem where MS Internet Explorer versions 10 and 11 were displaying blank page or "incompatible browser version".

      Regards,

      Doug Staubach

      Here is how to make it work:

      (1) Find the "web server's root folder" by following the instructions in the WebDirect Guide (page 27)

      (2) Rename the current "index.html" file (I called mine "index.html.original") = do not leave the html extension

      (3) You can ignore (or rename) the file named fmwebd_home.html -- it doesn't seem to do anything

      (4) Create a new file named "index.html" then copy and paste the text that I have provided below

      // ------------------------ Do not copy this line --------------------

      
      <!-- This is a very basic sample file that lists all the hosted FileMaker WebDirect solutions.
      You can customize this page and provide a custom home page for your FileMaker WebDirect users.
      This file was modified (fixed) by Doug Staubach on April 5, 2015 and again on May 11, 2015.
      The fixed lines are released to the public domain -->
      <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 //EN" "http://www.w3.org/TR/html4/loose.dtd">
      <html>
      <head>
      <!-- Following line was added by Doug Staubach to fix MSIE Compatibility Mode problem -->
      <meta http-equiv="X-UA-Compatible" content="IE=EDGE; Chrome=1" />
      <script>
      function loadXMLDoc()
      {
          var xmlhttp;
          if (window.XMLHttpRequest)
            {// code for IE7+, Firefox, Chrome, Opera, Safari
                xmlhttp=new XMLHttpRequest();
            }
              else
            {// code for IE6, IE5
                  xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
              }
              xmlhttp.onreadystatechange=function()
              {
                //alert ("state = " + xmlhttp.readyState);
                //alert ( "content = " + xmlhttp.responseText);
      
              if (xmlhttp.readyState==4 && xmlhttp.status==200)
          {
              document.getElementById("myDiv").innerHTML=xmlhttp.responseText;
              var response = xmlhttp.responseText;
              generateContent (response);
          }
          }
            //Change the IP address to point to your Web Publishing engine in a 2 machine config
          xmlhttp.open("GET","/fmi/webd/dbnames",true);
          xmlhttp.send();
      }
      function generateContent(jsonStr) {
        document.write('<title>Window Title Here</title>');
        document.write('<head><meta http-equiv="X-UA-Compatible" content="IE=EDGE; Chrome=1" /></head>');
        document.write('<h1>FileMaker Database Server Website</h1>');
        document.write('<h1 syle="font-size:120%;">Your Product Name Here</h1>');
        document.write('<p><img src="TestPage.png" alt="FileMaker Inc." /></p>');
        document.write('<h3 style="font-weight:bolder;">Select a Database:</h3>');
        var obj = [];
        obj = JSON.parse(jsonStr);  // convert json string into object
      
          //iterate through and print out links to each of the databases
          for (var prop in obj) {
              var name = prop;
              var url = obj[prop];
              document.write('<a href=' + url + '>' + name + '</a> </br>');
         }
      }
      </script>
      </head>
      <body onload = "loadXMLDoc()">
      <div id="myDiv">
      </div>
      </body>
      </html>

      // ------------------------ Do not copy this line --------------------