November 11, 2015 
This idea has been documented before, (Using a Web Viewer as a Field) but I rediscovered it myself recently and thought I might have something to add. As was pointed out in The Support Group article, sometimes as a developer, you want to display a long chunk of text (anything that requires scrolling within a field) to the user, but not allow them to edit that text. Some examples might include displaying a block of help text, or a long software agreement. It is obviously possible to format your text using HTML to achieve this effect, but that can become complicated especially if you are not that good at HTML. Fortunately FileMaker offers a much simpler way to display formatted text this using the GetAsCSS function.
I have prepared a FileMaker Pro file that demonstrates these three ideas:
- Use FileMaker formatted text instead of HTML with the GetAsCSS function
- Display a graphic in the Web Viewer using the Base64Encode function
- Display both text and graphic from layout objects (offscreen) without the need to create additional global fields
1. Web Viewer Displays Formatted Text
The obvious benefit from using a Web Viewer is that you get flowing text (note the scroll bar), without the ability for users to edit the text. Users can even select and copy and paste the text out of the Web Viewer.
Global Text Field stores the text to display
Use all FileMaker’s text editing options from the Formatting Bar
A script toggles the Formatting Bar on and off when the user clicks into the global text field, using a script trigger, OnObjectEnter and OnObjectExit.
FileMaker’s Format menu
It is possible to format the text using either FileMaker’s Format menu or from the Formatting Bar.
These formatting items work:
- Font
- Size
- Style
- Color
These ones don’t:
- Align Text
- Line Spacing
If you require alignment and line spacing, it might be time to switch to HTML to display your text.
The Magic: GetAsCSS Function in a Web Viewer
Ingredients:
- A Global Field (or a regular text field if you have the need)
- A Web Viewer
- GetAsCSS function
The Web Viewer is referencing a field using a data url.
Paste the text below into your Web Viewer, replace the field as required.
“data:text/html,” & GetAsCSS (Globals::gHelpText)
2. Add a graphic using Base64Encode function
In the second example in the demo file, some HTML formatting is used to display a global container field and the Base64Encode function (it could be a regular field). Note that in the HTML, the container width and height are obtained by using the GetContainerAttribute function and divide the results by a multiple to keep the image size smaller but still maintain the aspect ratio.
“data:text/html,”
& “<center><img style=’display:block; width:”&
GetContainerAttribute ( Globals::gImage ; “width” )/1.5&”px;height:”
&GetContainerAttribute ( Globals::gImage ; “height” )/1.5&”px;’
id=’base64image’ src=’data:image/png;base64, ”
& Base64Encode ( Globals::gImage)
&”‘ /></center>”
& GetAsCSS (Globals::gHelpText)
3. Offscreen Named Objects
Placing objects off screen, giving them a name, and the use of the GetLayoutObjectAttribute function, allows the display of these objects in a Web Viewer without the need to create any more global fields. The Base64Encode function displays the image in the Web Viewer.
This technique can be useful when you don’t want to create extra global fields in your database, or more significantly, populate those global fields on a live server database.
Challenges of this approach:
- More annoying to edit the text block (it keeps resizing)
- Remember to name it.
- Don’t delete the objects off the layout when you are cleaning up your database.
“data:text/html,”
& “<center><img style=’display:block; width:”
&GetLayoutObjectAttribute ( “HelpScreenShot”; “width” )&”px;height:”
&GetLayoutObjectAttribute ( “HelpScreenShot”; “height” )&”px;’
id=’base64image’ src=’data:image/jpeg;base64, ”
& Base64Encode ( GetLayoutObjectAttribute ( “HelpScreenShot” ; “source” ))&”‘ /></center>”
& GetAsCSS (GetLayoutObjectAttribute ( “HelpNotes” ; “content” ))
Totally Unrelated Note: If you liked this post, check out my son’s new app GifTV for the Apple TV.
HomeBase Software 
It’s always nice to read your posts and want to thank you that you share your work and insights with me and others.
Only one thing that I find annoying: that I can’t download your posts easily. I have to select the contents, copy it and paste into a text editor.
Thanks Michael. I just tested hbase.net page posts with Readability plugin (Versions for Safari, Firefox and Chrome – https://www.readability.com/) and it seems to work very well.
Their slogan reads: “Read Comfortably—Anytime, Anywhere. Readability turns any web page into a clean view for reading now or later on your computer, smartphone, or tablet.”
Readability requires you to sign up for a free account, but then when you save pages to it, it strips out all the sidebars, menus etc and leaves just the blog posting. There is a share button where you can save the page to Kindle or ePub. Also a print button, which you could use to Print to PDF.
Hope that will help you.