You have been redirected from an outdated version of the article.
Below is the content available on this topic. To view the old article click here.
Widgets#
Widgets are static content nodes containing source code which is transformed into a part of a page on import of a Widget.
There are local and remote widgets, the latter are served from a central Widget server, the former are only available on your local instance.
When dragging a Widget into a page, a new set of DOM elements is created as child nodes of the node the Widget was dropped onto, including metadata defined in the Widget source like data binding and queries. The textual information contained in the Widget is transformed into database elements (nodes, relationships and properties) as well.
Once created, the new DOM elements have no connection to the Widget they originated from. Later changes made to the Widget code don’t effect on the page’s elements. Widgets in Structr are more or less containers to exchange reusable code between Structr instances.
Widgets can also contain Cypher statements to create or modify graph objects on database level.

Search results for "Widgets"
Local Widgets
The Widgets in the Widgets flyout are arranged in a tree-like fashion based on the value of a special property called treePath
. The tree path of a Widget is composed of names separated by the /
character. For example, if you want to sort you local Widgets into two different groups, say “User Widgets” and “General Widgets”, you can do so by setting the value of the treePath
property of each widget to either “/User Widgets” or “/General Widgets”.
Widgets
The Widgets flyout is the place where local and remote widgets can be managed and accessed. It is divided into two sections, one for local widgets and one for remote widgets.
Local Widgets
The Local Widgets sections allows you to manage the Widgets that are stored on the local Structr instance. You can browse the list of existing Widgets, add new Widgets, and edit them using the Edit Widget dialog.
Remote Widgets
Remote Widgets can be inserted into a page just like local widgets. The only difference is that you can not edit the source code or the tree path, and you see a View button (
) instead of an Edit button when hovering over the Widget element.
The Remote Widgets section allows you to select a Widget server from a list of servers, and shows all Widgets that are available on the selected server. Clicking on the Edit button (
) next to the select box opens the Widget Servers dialog where you can manage the list of remote widget servers.
Widgets
A Widget is a reusable piece of HTML code that can be inserted into a page. You can make Widgets configurable by inserting config expressions in the widget source and adding the expression into the configuration. Widget config expressions look like this [configSwitch]
and can contain any characters (except the closing bracket). If a corresponding entry is found in the configuration, a dialog is displayed when adding the widget to a page.
Widgets can also contain Cypher statements to create or modify graph objects on database level.
Local Widgets
You can make local widgets available to other Structr instances by making them visible to public users, and enter your Widget server’s URL in the Widget Servers dialog on that instance.
Widgets
Once created, the new DOM elements have no connection to the Widget they originated from. Later changes made to the Widget code don’t effect on the page’s elements. Widgets in Structr are more or less containers to exchange reusable code between Structr instances.
You can insert a Widget into a page by dragging the Widget element from the Widgets flyout over the desired position in the page tree, and drop it there. If the Widget has configuration options, the Configure Widget Dialog will pop up, otherwise it will be inserted into the page immediately.
Edit Widget Dialog
The Edit Widget Dialog is the main editing and configuration interface for Widgets. The dialog consists of several tabs that allow you to configure the different aspects of the Widget.
Deployment Format
folder / file | description |
components | Contains the shared components of the pages editor of Structr. |
files | Contains all files out of Sturctr’s virtual filesystem. Folders and files in the virtual filesystem are not being exported by default. If you want to include a folder or file into the export you have to set the flag includeInFrontendExport on each file or folder. Each file or folder will inherit this flag from its parent folder. |
mail-templates | Contains the mail-templates. |
modules | Contains the application configuration and definition of additional modules of Structr e.g. the flow engine. |
pages | Contains the created pages in the pages editor of Structr. |
schema | Contains the schema definition and code entered in the schema and code section of the Structr UI. |
security | Contains the resource access grants defined in the security section of the Structr UI. |
templates | Contains all template elements of the pages editor of Structr. |
application-configuration-data.json | Contains the configured schema layouts of Structr’s schema editor. |
components.json | Contains the settings e.g. visiblity flags, contentType or uuid for each file in the components folder of the export. |
deploy.conf | Contains information about the Structr system that created the export of the application. |
files.json | Contains the settings e.g. visiblity flags, contentType or uuid for each file in the files folder of the export. |
localizations.json | Contains the localizations that where created in the localizations section of the Structr UI and that can be used in server side scripting with the localize() function of Structr. |
mail-templates.json | Contains the settings e.g. visiblity flags, locale or uuid for each file in the mail-templates folder of the export. |
pages.json | Contains the settings e.g. visiblity flags, contentType or uuid for each file in the pages folder of the export. |
pre-deploy.conf | Script that is run before deployment import. Use this to create users who are granted access to nodes in the export files. |
post-deploy.conf | Script that is run after deployment import. Can be used to start any tasks which are necessary after import. |
sites.json | Contains sites that are configured in the pages section of the Structr UI. |
templates.json | Contains the settings e.g. visiblity flags, contentType or uuid for each file in the templates folder of the export. |
widget.json | Contains the widgets that were created in the pages section of the Structr UI. |
Local Widgets
Widgets