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.

page

The page keyword returns the page currently being rendered.

Note: This keyword is only available in a page context.

Search results for "page"

page

The page keyword returns the page object currently being rendered.

Create the Page

To create a new page in Structr, we navigate to the Pages area by clicking on the (Pages tab) in the main menu and click on “Create Page” in the dropdown menu in the top-right corner of the Page Tree. This creates a fresh page with a minimal hierarchical structure, the so-called DOM tree, which can be navigated in the Page Tree in the navigation pane on the left-hand side. Clicking on the page element will display a set of basic attributes in the main area.

Deployment Format

folder / filedescription
componentsContains the shared components of the pages editor of Structr.
filesContains 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-templatesContains the mail-templates.
modulesContains the application configuration and definition of additional modules of Structr e.g. the flow engine.
pagesContains the created pages in the pages editor of Structr.
schemaContains the schema definition and code entered in the schema and code section of the Structr UI.
securityContains the resource access grants defined in the security section of the Structr UI.
templatesContains all template elements of the pages editor of Structr.
application-configuration-data.jsonContains the configured schema layouts of Structr’s schema editor.
components.jsonContains the settings e.g. visiblity flags, contentType or uuid for each file in the components folder of the export.
deploy.confContains information about the Structr system that created the export of the application.
files.jsonContains the settings e.g. visiblity flags, contentType or uuid for each file in the files folder of the export.
localizations.jsonContains 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.jsonContains the settings e.g. visiblity flags, locale or uuid for each file in the mail-templates folder of the export.
pages.jsonContains the settings e.g. visiblity flags, contentType or uuid for each file in the pages folder of the export.
pre-deploy.confScript that is run before deployment import. Use this to create users who are granted access to nodes in the export files.
post-deploy.confScript that is run after deployment import. Can be used to start any tasks which are necessary after import.
sites.jsonContains sites that are configured in the pages section of the Structr UI.
templates.jsonContains the settings e.g. visiblity flags, contentType or uuid for each file in the templates folder of the export.
widget.jsonContains the widgets that were created in the pages section of the Structr UI.

Pages Tree View

The Pages Tree View is the main interface for editing Structr pages. It shows a filterable, pageable list of all pages in the database and allows browsing and editing of the underlying node structure. At the root level, a page is represented by the page icon (Page icon) and the name of the page next to it. The name can be changed by clicking on it.

User self-registration

Instead of creating users in the Structr backend manually in the Users and Groups section of Structr’s admin UI, you can allow users to sign-up/self-register. The registration process uses double-opt in by default. All you need is a simple page where new users can enter their e-mail address so Structr can send them an e-mail with a confirmation link.

The following pre-defined MailTemplate keys can be used to configure the self-registration process. In version 4.0 they have been renamed to have a more uniform structure.

Note: The Mail Configuration Settings have to be done for self-registration mails to be sent.

Name Old Name (removed as of v4.1) Used as Default
CONFIRM_REGISTRATION_SENDER_ADDRESS SENDER_ADDRESS The sender address of the registration mail structr-mail-daemon@localhost
CONFIRM_REGISTRATION_SENDER_NAME SENDER_NAME The sender name of the registration mail Structr Mail Daemon
CONFIRM_REGISTRATION_SUBJECT SUBJECT The subject of the registration mail Welcome to Structr, please finalize registration
CONFIRM_REGISTRATION_TEXT_BODY TEXT_BODY The plaintext body of the registration mail Go to ${link} to finalize registration.
CONFIRM_REGISTRATION_HTML_BODY HTML_BODY The HTML body of the registration mail <div>Click <a href='${link}'>here</a> to finalize registration.</div>
CONFIRM_REGISTRATION_BASE_URL BASE_URL Used to build the link variable ${base_url}
CONFIRM_REGISTRATION_TARGET_PAGE TARGET_PAGE the target parameter value for the redirection target page name register_thanks
CONFIRM_REGISTRATION_ERROR_PAGE ERROR_PAGE the error parameter value for the error redirection target page name register_error

Notes:

  • The visibility flags of these MailTemplates are ignored because the self-registration mail is created as a privileged user.
  • A special link variable is provided for the TEXT_BODY and HTML_BODY templates and can be output with the usual syntax: ${link}
    • Example link: https://support.structr.com/confirm_registration?key=<CONFIRM_KEY>&target=/dashboard&onerror=/register-error
  • From v4.1 scripting is enabled in two templates: CONFIRM_REGISTRATION_TEXT_BODY and CONFIRM_REGISTRATION_TEXT_BODY. The script is being run in the context of the user (me keyword points to the user).
  • In any version prior to 4.1 scripting can not be used and simple text replacement is done

Page Title

The system keyword page references the current page. The page has several properties, including a name attribute which can be accessed with the dot notation (page.name), similar to other programming languages such as JavaScript. Summarized, the template expression computes the current page, retrieves its name and it transforms the first character into uppercase. The result is then rendered as the page’s title.

Example Implementation

Step 1: Create the basic login page/form as per usual. A regular HTML <form> with custom submission handling to log in.

If the user is not configured for two-factor authentication, they are logged in.

If the status is 202 is returned, two-factor authentication is required. The returned headers from the login POST contain the required data to use on the next page (and are passed as request parameters in the example code):

twoFactorLoginPage The page configured in security.twofactorauthentication.loginpage
token The token required to log in
qrdata The URL-safe base64 encoded data of the QR code which can be scanned with an authenticator app

Page Title

This pattern makes sure that the page’s title is automatically displayed correctly when changing the page’s name. To do so, click on “Basic” or “Advanced” and set the name to “overview” (this page will later be the overview page for projects and tasks). To save the name, we click anywhere outside of the input field. The text field should flash green when the data was successfully updated in the database. The page’s title should now be shown as “Overview”.

Preview Area

Clicking on an inactive tab selects the corresponding page, so that the content of that page shows up in the preview area. Clicking on an active tab allows you to change the name of the page, while hovering over a tab shows two additional icons. The View button (Eye icon button) opens the corresponding page in a new browser tab, and the Settings button (Wrench button) opens a configuration dialog for the page preview.

Pagination

The number of results returned by a GET request to a collection resource can be limited with the request parameter _pageSize. This so-called Pagination depends on a combination of the parameters _pageSize and _page. The _page parameter has a default value of 1, so you can omit it to get the first page of the paginated results.

Preview Area

It has a header row with two buttons, and a tab for each page. The Import Template button (White page button) opens an import dialog that allows you to create a new page, either from HTML code, or by importing a web page from an URL. The Add button (Green plus button) creates a simple page with some initial elements, as shown in the above screenshot.

Shared Components

A Shared Component is a reusable structure of HTML elements that can be inserted into a page via drag & drop. It is very similar to a Widget, but there is one important difference: when you insert a Shared Component into a page, Structr creates a special element in that page that relays the rendering to the original Shared Component. This means that changes are immediately visible on all pages where the component is present.

Import Bootstrap Page Template

Click on “Import page” in the dropdown menu of the Page Tree to open dialog. Now either copy the raw HTML code into textarea or enter the URL of the example page in the text field below the textarea to let the system fetch the page for us.