Over 46,000+ Business Solution Developers Find answers, ask questions, and connect with our community of business solutions developers, business owners and partners.
Jeremy Brown FileMaker Web Viewer Integration Tutorial +
Sample File Downloads & Resources Included
Jeremy Brown – Soliant Consulting
Session Description
The web viewer object is an extremely versatile object that allows a developer to integrate deeper functionality into a custom app using the languages of the web, HTML/CSS and JavaScript.
In this session, you’ll explore a standard way to integrate common web libraries, including setting up an integration in FileMaker, manipulating it, and gathering data using some of the new functions of FileMaker 16. Discover best practices that are used to make this as easy as possible to set up deeper functionality.
What you should know
Familiarity with scripting in FileMaker. Some web-language knowledge is useful, but not required.
Products & Technologies
- Pro/Advanced
- Go
Session Materials
The demo file is attached here, containing ten integration. This will be used in the session.
Web Viewer Related Resources:
| Name | URL | Notes |
| Soliant Consulting Blog | http://www.soliantconsulting.com/tag/web-integration | Soliant Consulting’s collection of Web Viewer-related articles |
| W3 Schools | http://www.w3schools.com/ | The place to go to learn HTML/CSS/ JS. It explains well the elements of the web’s languages and gives great examples. |
| A Complete List of CSS Properties and Values | https://www.w3schools.com/cssref/ | |
| jQuery | http://jquery.com/ | The standard place to learn about jQuery |
| Hex Color Picker | http://www.w3schools.com/colors/colors_picker.asp | A place to find the color values for any color. I have this tab open all the time while doing work. |
| D3JS | https://d3js.org/ | A library used in many charting and data maps libraries. |
| The FMP Protocol | http://www.twdesigns.com/fmp_url_protocol/ | var theURL = “fmp://$/**FileName**?script=**ScriptName**¶m=“; window.location = theURL; |
| Adobe Color | https://color.adobe.com | |
| CSS Button Generator | http://www.bestcssbuttongenerator.com/#/1 | |
What You Will Learn
- Best practices of web integration into a custom app.
- Implement integration into their own custom apps.
- How the fmp protocol and a library’s callback functions are used.
- The basics of manipulating an integration to fit their own custom app.