Resources

This page clarifies the difference between Internal, External and Web resources that may be used in a template, and explains how to refer to them in HTML and in scripts.

All resources that a template uses are displayed in the Resources pane.

The Text Filter box at the top of the Resources pane allows to look for text in the name of resources and in the source of any text-based files: HTML (including sections, master pages, and snippets), JSON, JS and CSS.

Internal resources

Internal resources are files that are added to and saved with the template.

To add images, fonts, style sheets, and snippets to your template, you can drag or copy/paste them into the Resources Pane. See also: Images, Snippets, Styling templates with CSS files and Fonts.
Resource files can also be dragged or copy/pasted out of the the application to save them on a local hard drive.

Alternatively you could import resources and scripts from another template; click File > Import Resources... in the menu and select a template to import resources from (see ).

Once added or imported, internal resources are accessed using a relative path, depending where they're called from. Resources can be located in the following folders:

  • images/ contains the files in the Images folder.
  • fonts/ contains the files in the Fonts folder.
  • css/ contains the files in the Stylesheets folder.
  • js/ contains the files in the JavaScripts folder.
  • snippets/ contains the files in the Snippets folder.

When refering to them, normally you would simply use the path directly with the file name. The structure within those folders is maintained, so if you create a "signatures" folder within the "Images" folder, you need to use that structure, for example in HTML: <img src="images/signatures/johnsmith.gif">. In scripts, you can refer to them in the same way, for example:

results.loadhtml("snippets/en/navbar.html");

See also: Loading a snippet via a script and Writing your own scripts.

When referring to images or fonts from a CSS file, you need to remember that the current path is css/, meaning you can't just call images/image.jpg. Use a relative path, for example: #header { background-image: url('../images/image.jpg'); }

External resources

External resources are not stored in the template, but on the local hard drive or on a network drive. They are accessed using a path. The path must have forward slashes, for example <img src="file:///c:/resources/images/signatures/johnsmith.gif"> or var json_variables = loadjson("file:///d:/jsondata/variables.json");. The complete syntax is: file://<host>/<path>. If the host is "localhost", it can be omitted, as it is in the example, resulting in file:///<path>. The empty string is interpreted as `the machine from which the URL is being interpreted'.

Network paths are similar: results.loadhtml("file://servername/sharename/folder/snippet.html"); (note that in this case file is followed by 2 slashes only).

Some limitations

  • Style sheets cannot refer to external resources.
  • The Connect Server user needs access to whichever network path is used. If the network path is on a domain, the Connect Server must be identified with domain credentials that have access to the domain resources.

For more information on network paths, please see this Wikipedia entry: file URI scheme.

Web resources

Web resources are simply accessed using a full URL. This URL needs to be publicly accessible: if you type in that URL in a browser on the server, it needs to be visible. Authentication is possible only through URL Parameters (http://www.example.com/data.json?user=username&password=password) or through HTTP Basic Auth (http://username:password@www.example.com/data.json).

Resources can also be called from a PlanetPress Workflow instance:

  • "Static Resources", as set in the preferences, are accessed using the resource path, by default something like http://servername:8080/_iRes/images/image.jpg. (For guidance on setting the preferences, search for 'HTTP Server Input 2' in the PlanetPress Workflow help files on: OL Help).
  • Resources can also be served by processes: http://servername:8080/my_process?filename=image.jpg (assuming "my_process" is the action in the HTTP Server Input).