This is the complete Molnify Reference Guide. It covers:
Creating a Molnify application can easily be done in either Excel or Google Sheets. You don't have to know any programming language. Basic Excel/Sheets knowledge is all it takes. Simply color your cells to let Molnify know what elements you want, such as inputs, outputs and more.
If you use Excel, upload your Excel file to Molnify to create your application.
When you want to update an Excel-based app, simply upload the Excel file again with your changes. Keep in mind to always specify the same ID explained in the section Metadata.
If you use Google Sheets, you have two options for creating a Molnify application:
If you want to update a Google Sheets-based application, go to your application and click the Update button in the sidebar once you have made changes to your model. Alternatively, go to My Apps and update the app from there.
Regardless of whether you're using Excel or Google Sheets, you may find the Molnify App Generator useful for setting up your app fundamentals easily. It lets you experiment with metadata and styling. Once you're happy, simply download the Excel file with all your settings or visit your automagically created Google Sheets file. Continue editing your app in either Excel or Google Sheets.
Molnify turns a spreadsheet into an app containing different elements: inputs, outputs, charts, tables and actions. In short, inputs let the user fill in data, while outputs, charts and tables show results. Actions are used to perform tasks such as sending emails and much more. The colors of your spreadsheet cells tell Molnify what types of elements to create.
The basic structure for an input and output consists of three cells: (1) title, (2) value and (3) user interface (UI string). The UI string decides how an input or output is presented and is optional. If left out, Molnify will choose the most appropriate representation.
Use thesse colors to let Molnify know what types of elements to create.
Remember to always use the standard colors in Excel and Google Sheets.
A | B | C | D | E | |
---|---|---|---|---|---|
1 | Value A | 5 | A Chart | Series | |
2 | Value B | 10 | Value A | =B1 | |
3 | Value B | =B2 | |||
4 | Product | =B1*B2 | |||
5 | |||||
6 | Name | My App | |||
7 | ID | myApp |
This would create a fully functional app with two inputs (Value A and Value B) with default values of 5 and 10. An output box, titled Product, would show the product of the two inputs. A chart, titled A Chart, would plot the two inputs. The purple cells set the metadata; i.e., the name would be My App and its ID would be myApp.
To customize an input or output, you may specify different settings
in the cell to the right of the actual input/output (cell C1 in the example). We call this
the UI (user interface) string. All these options are
separated by ;
. E.g., min=0;max=50
.
A | B | C | |
---|---|---|---|
1 | Label | 0 | min=0;max=50 |
This example would generate a numeric input titled Label with a default value of 0. Its UI string is min=0;max=50
, so only values between 0 and 50 would be allowed.
If you color a cell green, you will get an input. There are many different types of inputs, such as text fields, sliders, dropdown menus and more.
Example:
A | B | C | |
---|---|---|---|
1 | Label | 0 | min=0;max=50 |
This example would generate a numeric input titled Label with a default value of 0. Its UI string is min=0;max=50
, so only values between 0 and 50 would be allowed.
UI string: Multiple different options are avaiable. They are described for each of the different inputs.
By having data validation turned on for an input cell and assigning a list of values, Molnify will show a group of buttons - one for each value in the list. If the list is long, Molnify will present a dropdown instead.
Example:
A | B | C | |
---|---|---|---|
1 | Select Country | Sweden | select |
This example would create an input titled Select Country with a default value of Sweden. Its UI string is select
, which would tell Molnify to show this as a button group regardless of the length of the data validation list.
UI string:
select
. This will force Molnify to show buttons instead of a
dropdown even for long data validation lists.
To get an input field rendered as a datepicker or timepicker,
simply format the cell as date or time in Excel. You may force
Molnify to interpret the cell as either by specifying
date
or time
in the UI string. You may use placeholders
just like in other text inputs.
Example:
A | B | C | |
---|---|---|---|
1 | Date | 2020-01-01 | date |
This example would create a datepicker titled Date with a default value of 2020-01-01. Its UI string is date
.
Example:
A | B | C | |
---|---|---|---|
1 | Time | 12:00:00 | time |
This example would create a timepicker titled Time with a default value of 12:00:00. Its UI string is time
.
UI string:
date
or
time
.
Adds a horizontal divider with the specified title above the input
field. The divider is shown and hidden along with the input it's associated
with.
A | B | C | |
---|---|---|---|
1 | Name | John Doe | dividerName=Personal Information |
This example would create an input titled Name with a default value of John Doe. Its UI string is dividerName=Personal Information
, which would insert a divider with the title Personal Information above the input.
UI string:
dividerName=divider title
where divider title is the title of your divider.
Specifies that the input field should be presented as a dropdown menu containing the items of a data validation list. This is the default for long data validation lists.
Example:
A | B | C | |
---|---|---|---|
1 | Select Country | Sweden | dropdown |
This example would create an input titled Select Country with a default value of Sweden. Its UI string is dropdown
, which would tell Molnify to show this as a dropdown menu regardless of the length of the data validation list.
UI string:
dropdown
.
To enable multiple selections in a dropdown menu, add multiple
to the UI string. The selected
values will be concatenated into one semicolon-separated text string. E.g., selecting Sweden and
Denmark will result in a value of Sweden;Denmark.
To have multiple options selected as default, add JavaScriptAfterLoad
to your metadata and set it to
$("[cell='Sheet1!B3']").val(["Sweden", "Denmark"]).change()
. Exchange
Sheet1!B3 for the cell corresponding to your dropdown. Read more about triggered
JavaScript actions here.
Example:
A | B | C | |
---|---|---|---|
1 | Countries | dropdown;multiple |
This example would create an input titled Countries with no default value. Its UI string is dropdown;multiple
, which would instruct Molnify to create a dropdown menu enabled for multiple selections.
UI string:
dropdown;multiple
.
A file upload input lets your users upload files. Referencing
the input (e.g., =B1
) will give you a comma-separated string of URLs to
the uploaded files. E.g.,
https://files.myserver.com/files/anImage.jpg,https://files.myserver.com/files/anotherImage.jpg
.
If you need to retrieve a full-sized image, add __full_
to the filename, e.g.,
.../anImage__full_.jpg
.
Next to the file upload area is a gallery of the uploaded files associated with the specific input.
Example:
A | B | C | |
---|---|---|---|
1 | Upload Files | fileUpload;maxFiles=10 |
This example would create an input titled Upload Files. Its UI string is fileUpload;maxFiles=10
, which would tell Molnify to create a file upload area and gallery. It would allow for a maximum of ten files to be uplodad.
UI string:
fileUpload
. Add, e.g., maxFiles=10
to limit
the number of files to ten.
Limit accepted file types by setting acceptedFileTypes
. Specify
file types by entering comma-separated MIME type and file extension.
E.g., image/*,application/pdf
to accept all types of images
and PDFs. File extension can be a wildcard (*).
An info text is actually not an input, but a descriptive text
placed among your inputs. For a longer info text, preferably use
longInfoText
instead.
Note: Info texts are to be used for static texts. Use an HTML output among inputs for dynamic contents.
A | B | C | |
---|---|---|---|
1 | Description | This may be... | infoText |
This would create an info text with the title Description and the text This may be.... Its UI string, infoText
, tells Molnify to render it as an info text.
UI string:
infoText
or
longInfoText
.
A records table lets you access database records saved in another app. Read more.
A | B | C | |
---|---|---|---|
1 | Records | recordstable;appId=MY_APP;columns=A,B |
This would create a records table with the title Records. Its UI string, recordstable;appId=MY_APP;columns=A,B
, tells Molnify to render it as a records table, listing the fields A and B from the app MY_APP.
UI string:
recordsTable
. Also specify appId=YOUR_APP
and
columns=Var1,Var2
, where YOUR_APP is the ID of
the app which has the records you wish to access, and Var1 and Var2
are the variables you wish to list.
Provides a signature area as an input. Simply specify
signature
as the UI string.
Example:
A | B | C | |
---|---|---|---|
1 | Sign Here | signature |
This would create a signature input with the title Sign Here. Its UI string, signature
, tells Molnify to render it as a signature area.
UI string:
signature
.
The default data format for a signature is Base30.
To retrieve the SVG code, you need to add a second text input, which can preferably be hidden.
In the UI cell of the signature, add jsOnChange=copySVGToTextInput
.
Ensure that the text input to receive the SVG code is on the next row in the spreadsheet.
Once this is set up, you can use the SVG code from the text input in, e.g., HTML panels, to show the actual signature.
The example below illustrates how to retrieve the SVG code and display the signature image in an HTML panel.
A | B | C | |
---|---|---|---|
1 | Sign Here | signature;jsOnChange=copySVGToTextInput | |
2 | SVG | hidden | |
3 | Signature | =B2 | html |
UI string:
signature;jsOnChange=copySVGToTextInput
.
Specifies that the input field should be presented as a slider.
Example:
A | B | C | |
---|---|---|---|
1 | Label | 10 | slider;min=0;max=50 |
This example would create a slider titled Label with a default value of 10. Its UI string is slider;min=0;max=50
, which tells Molnify to present this as a slider with a range of 0-50.
UI string:
slider;min=minimum;max=maximum
where minimum and maximum define the range of the slider.
To set the size of the steps, use
delta
, e.g., specify delta=0.1
for steps of 0.1.
Use gridNum
to specify how many ticks you want. E.g., specify gridNum=0
for have a slider without any ticks.
Add a tab with a specified title. All inputs after this up until
the next tab
will be placed in this tab.
The tab is shown and hidden along with the input it's associated
with. This means that adding conditional show to the
first input in a tab also controls visibility of the whole tab.
To identify which tab is currently selected, add an input and set its UI string to
variable=molnifyCurrentTab
. It will be populated with the tab's title.
A | B | C | |
---|---|---|---|
1 | An input | tab=Second tab |
This would create an input field with the title An input. Its UI string, tab=Second tab
, tells Molnify to add this input and all following inputs in the tab named Second tab.
UI string: tab=title
where title is the tab title.
This is the default input type.
Example:
A | B | C | |
---|---|---|---|
1 | Label | 0 | min=0;max=50 |
This example would generate a numeric input titled Label with a default value of 0. Its UI string is min=0;max=50
, so only values between 0 and 50 would be allowed.
For a numeric text field, you may specify the delta, i.e. the
increment and decrement applied when clicking the plus and minus
buttons. Use delta=0.1
for an increment and decrement of 0.1. You may also use min
and
max
(similar to sliders)
for allowed min and max values.
Add a symbol or short text before and/or after the field by
specifying preFix
and postFix
, respectively. E.g., postFix=pcs
to have pcs to the right of the field.
To turn a text field into a larger text area, use the UI string textArea
.
UI string: textArea
.
If you're planning on using a barcode scanner for entering data
into the input, specify
barcode
as the UI string to make the text field automatically select all
text upon hitting the ENTER key.
UI string: barcode
.
For a numeric input field, plus and minus buttons are shown next to
the field by default. To hide them, specify
noButtons
in the UI cell.
UI string: noButtons
.
A placeholder is a text that helps the user understand an
input field. Specify this by adding
placeholder
to the UI string. E.g.,
placeholder=This is a placeholder
.
UI string: placeholder=A placeholder
.
Input validation prevents the user from entering improperly formed data.
For instance, you may only want to allow the user to enter A-Z and
a-z, and nothing else. The following example would do exactly that:
regEx=[^a-zA-Z]
.
UI string: regEx=regular expression
, where regular expression
is the regular expression you want to apply.
By entering
TRUE
or
FALSE
in a cell, Molnify will present this as a toggle button.
Example:
A | B | C | |
---|---|---|---|
1 | A toggle | TRUE |
This would create a toggle button with the title A toggle. Since the value is TRUE, the button would be active by default.
To show a descriptive text next to a toggle, specify
description
in the UI string. E.g.,
description=A description
.
UI string: description=A description
.
You may exclude certain inputs from being passed along at calculation.
UI string: NOCALC
.
You can initialize inputs by passing parameters in the app's URL.
Add a variable
name to the inputs you want to initialize. Then simply append
?variable_name=VALUE
to your app URL, e.g.,
app.molnify.com/app/myForm?firstName=John&lastName=Doe
.
This would initialize the input with variable name firstName
with John and lastName with Doe.
UI string: variable=name
.
If you would like to use the identifier of the logged in user, you can
add user
in the UI string. The identifier is usually the user's
email address, but can also be, e.g., a personal number.
Molnify will add the identifier of the logged in user to this field (or an empty string if no
user is logged in). The input will not be shown in the app. You can then use this value to e.g.,
add logic to show specific values, or even have the values of inputs depend on which user that has logged in.
UI string: user
. To specifically get the email or personal number, use
user.email
or user.identificationnumber
.
To check what user category the currently signed-in user has, add a TRUE/FALSE input with the UI string
superuser
or manager
.
To have an input (or output among inputs) shown full width, without any title next to it,
simply add noTitle
to the UI string.
If you wish to reset an input to the value it had in the Excel file upon hiding, add resetWhenHidden
to the UI cell. When shown again, the input regains the value it had prior to being hidden.
Also refer to Conditional Show.
UI string: resetWhenHidden
.
If you color a cell red, you will get an output. There are different types of outputs, such as output boxes, HTML panels and more.
A | B | C | |
---|---|---|---|
1 | Result | =SUM(B2:B20) | icon=fa-money |
This would create an output box titled Result. Its value is calculated by =SUM(B2:B20). Its UI string is icon=fa-money
, which would tell Molnify to show the Font Awesome icon fa-money next to the value inside the output box.
UI string: Multiple different options are avaiable. They are described for each of the different outputs.
If you color a cell red, you will get an output box placed in an output panel.
Example:
A | B | C | |
---|---|---|---|
1 | Value | =B3*B4 | icon=fa-flag;background=gray;color=white |
This example would create an output box titled Value. Its value is calculated by =B3*B4. Its UI string is icon=fa-flag;background=gray;color=white
, which would tell Molnify to show the Font Awesome icon fa-flag next to the value inside the output box, set the background color to gray and the text color to white. If you add a comment to the red cell, it will be displayed below the value.
Use the property
background
to set a custom background color of an output box.
UI string: background=color
where color is the desired background color, e.g., background=blue
or background=#ff00ff
.
You may specify a Font Awesome icon to display inside an
output box. If you don't want any icon, specify
none
as the icon.
UI string: icon=fa-icon
where fa-icon is the desired Font Awesome icon.
Use the property color
to set a custom output box text color.
UI string: color=color
where color is the desired text color, e.g., color=#ffffff
.
You may hide individual output boxes by specifying
hidden
as the UI string of an output box. Read more about hidden outputs.
To hide the whole panel containing output boxes, refer to Panel Visibility.
Molnify can render the result in a cell as an HTML-formatted panel.
Color the Excel cell red (specifying an output) and set the UI
string to html
.
Example:
A | B | C | |
---|---|---|---|
1 | An HTML Panel | ="<b>This is: </b>" & A1 | html |
This would create an HTML-formatted panel titled An HTML Panel. Its value is set to ="<b>This is: </b>" & A1. The text shown in the HTML panel would thus be This is: An HTML Panel. Its UI string, html
, is what tells Molnify to show this as an HTML-formatted panel.
UI string: html
. If you wish to hide the copy button, simply specify
hideCopy
in the UI string. You may place the HTML panel among inputs by simply
placing it accordingly in your Excel file, and add the UI string amongInputs
. You
may then also make the output full width by specifying noTitle
(refer to this section).
To get a value from 0 to 100 represented as part of a matrix of 100
people, specify
peopleMatrix
as the UI string.
A | B | C | |
---|---|---|---|
1 | Number | 10 | peopleMatrix |
This example would create a People Matrix titled Number. Its value would be 10. Its UI string, peopleMatrix
, tells Molnify to display the value as 10 highlighted people out of 100.
UI string: peopleMatrix
.
Use
color
in the UI string to set the color of the highlighted "people". Example:
color=blue
.
Specify
icon
in the UI string to set a custom Font Awesome icon. Example:
icon=fa-money
.
Use
rows
and
columns
in the UI string to set the number of "people". Example:
rows=5;columns=5
.
To add a descriptive text to an output panel, a panel containing a chart or an HTML output panel, simply add a comment to the output cell, the chart title cell or the HTML output cell.
To force a panel to be in the left or right column, specify
leftColumn
or
rightColumn
in the UI string.
If you want a panel to be hidden, specify panelHidden
in the cell to the right of the panel content (the UI string). To
make a panel containing output boxes hidden per default, set the
metadata property OutputBoxPanelHidden
to TRUE
.
Numbers are generally displayed using the client's locale. For instance, the thousand separator in some countries is ,
and in others it's a space (
), etc.
If you introduce a non-number character, e.g., a currency, Molnify interprets the number as a text string, and number formatting is lost. You can easily add your preferred formatting in Excel using a couple of functions. Below is an example.
Let's say you have the number 3456456 in cell B5. To have this displayed with a $ sign and thousand separators, you can enter ="$ " & TEXT(B5;"### ###")
.
To use a custom thousand separator, e.g. periods (.
), you can simply put ="$ " & SUBSTITUTE(TEXT(B5;"### ###");" ";".")
. This would put spaces as thousand separators, and then exchange them for periods.
In some instances, you may have a date in the form of a number representing days from January 1, 1900. To present such a number in a more readable way,
you may format it as a date, e.g., as YYYY-MM-DD using this Excel formula:
=IF(B1>0;YEAR(B1)&"-"&TEXT(MONTH(B1);"00")&"-"&TEXT(DAY(B1);"00");"N/A")
, where
B1 contains the number.
To visualize data as a chart in Molnify, color the data cells blue.
Molnify interprets cells colored in blue as chart data. Molnify
automatically analyzes your chart data and selects the appropriate
chart representation. If you want to force Molnify to use a certain chart
type, specify
barChart
,
pieChart
,
lineChart
,
lineBarChart
or
waterfallChart
in the UI string.
Color your bar chart data blue, name your series and datapoints and add a title.
Example:
This would create a bar chart with two series and six datapoints. The chart title, Graph, is in cell A1. The series names are specified in cells B1 and C1. The labels for the datapoints are in column A. The UI string, in cell D1, is xAxis=Month;yAxis=Rate
, which sets titles for the X and Y axes.
UI string: barChart
.
Color your pie chart data blue, name your datapoints and add a title.
Example:
This example creates a pie chart titled A Pie Chart with three datapoints. The UI string, pieChart
, instructs Molnify to show the data as a pie chart.
UI string: pieChart
.
Molnify can present your data as a line chart or a combined line/bar chart. Color your chart data blue, name your series and datapoints and add a title.
For a combined line/bar chart (UI string: lineBarChart
), the first series represents the bars and the second series
represents the line. Specify atLeastSync
to make atLeast=value
apply to both Y axes.
This would create a line chart titled A Line Chart with two series (An index and Another index) and twelve datapoints. The UI string, lineChart
, instructs Molnify to present the data as a line chart.
UI string: lineChart
or lineBarChart
.
To create a scatter chart, you need an area with at least three columns - series, x and y. Optionally, you can also specify size and shape.
Available shapes:
circle
diamond
triangle-up
triangle-down
cross
square
This would create a scatter chart titled A Scatter Chart with three datapoints and two series (A and B). The UI string, scatterChart
, instructs Molnify to present the data as a scatter chart.
UI string: scatterChart
.
Color your chart data blue, name your series and datapoints and add a title. Enter e whenever you want to present an accumulated value.
Example of how to create a waterfall chart titled A Waterfall Chart with two series (Rocks and Spoons). e lets Molnify know to show the accumulated value. e is actually also what makes it a waterfall chart without explicitly specifying it in the UI string. In this example, atLeast is set to 20 in the UI string (atLeast=20
), meaning that the value 20 will always be included on the Y axis.
UI string: waterfallChart
.
A special kind of chart is the geo chart, which shows a world map
with values specified for different countries. The chart is
specified the same way as a bar chart with one series.
Simply write geoChart
in the chart's UI string. Countries are defined using country codes
(e.g., US, SE, DK, NO) as datapoint labels.
UI string: geoChart
.
UI string:
decimals=number
can be used to manually set the number of decimals to show. E.g.,
decimals=2
would set the number of decimals to 2.
To set the height of a chart, add the desired height as CSS in your
metadata. E.g.,
div[cell='Sheet1!C7:C33'] svg { height: 2000px; }
for a chart in cells C7:C33.
UI string:
noGroupedStackedControls
hides the grouped/stacked buttons in a bar chart to .
UI string:
noControls
hides the grouped/stacked
buttons and the series legend in a bar chart.
UI string:
horizontal=TRUE
specifies that a bar chart should be rendered horizontally.
UI string:
map
shows only a certain region (e.g., map=se_mill
for Sweden) in a geo chart.
UI string:
noGridLines
hides all grid lines.
UI string:
showValues
makes values shown directly in the chart
(applies to bar charts).
UI string:
steps
turns a line chart into a step chart.
UI string:
xAxis=title
and yAxis=title
set the titles for the X and Y axes.
UI string:
axisDecimals=decimals
sets the number of decimals to display on the axes.
UI string:
atLeast=value
forces a certain value to be included on the Y
axis. Example: atLeast=100
to always include the value 100 in the chart.
For scatter charts, define a comma-separated string of values. I.e.,
atLeast=xMin,xMax,yMin,yMax
, where each position corresponds to a value
that should always be covered by the chart.
UI string:
centerZero
makes the value zero always centered in a bar chart.
UI string: hideMaxMin
hides the max and min values.
UI string: yAxisTicks=value
, where value is the number
of ticks to always display on the Y axis.
UI string:
noWordWrap
disables word wrapping for labels in a horizontal bar chart.
UI string:
staggerLabels=TRUE/FALSE
enables/disables staggering of the labels on the X axis. This
is otherwise automatically decided by the number of labels.
Setting custom chart series colors is done by adding them to the metadata CSS. This will set them globally for all charts.
Example: .chart-series0 { color: black } .chart-series1 { color: red }
to make your first series black and your second series red.
Alternatively: To set the color of a chart series for a particular chart, type series0.color=red;
or equivalently series0.color=#FF0000;
in the UI string, where 0 is the number of the series
(in this case the first one since the series are zero-indexed).
UI string:
seriesInColumns
instructs Molnify to use the columns as series and
the rows as data points.
UI string:
seriesInRows
instructs Molnify to use the rows as series and the
columns as data points.
UI string:
stacked
renders a bar chart with stacked series as default.
There are these following properties which you can set individually for a series:
series0.color=red;
or equivalently series0.color=#FF0000;
in the UI string. Indices for series start at 0.series0.showArea;
in the UI string, where 0 is the number of the series.series0.strokeWidth=4;
in the UI string to set the line width to 4.series0.dashedLine;
in the UI string to get a dashed line.Refer to Panel Description, Panel Placement and Panel Visibility.
In order to present aggregated data as a table, color your data cells
blue. Column titles and row titles are entered outside the blue
area. Instruct Molnify to create a table by specifying
table
as the UI string. The table panel title is specified in the top
left corner cell.
Note that you can manually set the number of decimals.
Example:
Example of how to create a table with the panel title A Table. Its UI string, table
, tells Molnify to display your data as a table instead of a chart.
UI string:
table
renders your data as a table.
Molnify can perform a wide range of different actions, such as sending emails and adding data to Google Sheets spreadsheets. Cells specifying an action are colored yellow.
Example:
This example creates an email action, since type
is set to email
. The action button's title will be Send email. Other options, such as to
, from
, subject
and content
, are specified on separate rows.
These are some general action settings that apply to most actions. Apart from styling, they are specified just like all other action options.
This example would create an email action (however, to
, from
, subject
and content
would also be needed). The action button is titled Click Here and is named Action1. The button is configured to be displayed at the bottom of the page. Finally, the button would only be visible if cell Sheet1!B1 is TRUE.
Action buttons also support conditional show. Simply specify
showIfCell
:
cell_address
and
showIfValue
or
showIfValueNot
:
value_to_match
. Also refer to the section on Conditional Show.
Set hidden
to TRUE
to hide the
action button.
A hidden action can be called with JavaScript like
this:
performActionWithID("actionsBtn0")
, where actionsBtn0
is the first action button.
Alternatively, you can perform an action which has a specific title or name
with performActionWithTitle("Send")
, where Send
is the title of the action button, and performActionWithName("action1")
,
where action1
is the name of the action.
name
: Used when calling several actions using
"multiple actions".
position
: Specify bottom
if you
want the action button at the bottom of the page (default is below
all inputs).
If you prefer to have your action buttons among your inputs, for instance on a certain tab, you can accomplish this by adding an Info Text input and set its content to call the actual action. Remember to also hide the actual action button. Here's an example for an input button that calls the second action (specified by 1):
<a href="javascript:performActionWithID('actionsBtn1');"><button type="button" class="btn btn-sm btn-success buttonMargin molnifyActionButton">Action 2</button></a>
requestHandler
: Set to noModal
to show no modal window while the action is being performed.
Use skip
to disable an action. Perfect for skipping one or several actions in a multiple action.
skip
: Set to TRUE
to disable the action. TRUE
may of course be the result of a function.
The action buttons may be styled with custom colors by adding CSS
to the CSS metadata cell, e.g.,
#actionsBtn0 { background-color: #0000ff; border-color: #0000ff; }
in order to set a blue background color and blue border color on
the first action button.
Specify what happens when an action successfully finishes:
successCalculate
: Perform a calculation
after a successful actionsuccessHTMLElementId
and successHTMLElementContent
:
Update the specified HTML element with the provided contentsuccessNewTabURL
: Open a new tab with the
specified URLsuccessRefreshScenarioList
: Refresh the
list of scenarios after a successful actionsuccessSilent
: Do nothingsuccessText
: Show a text messagesuccessURL
: Redirect the browser to the
specified URLNote that if you specify a success handler for a multiple action, this will override success handlers specified for the individual actions.
title
: Title displayed in the action button.
type
: Type of action.
Add this action to create a button that sends an email.
Example:
This example creates an email action, since type
is set to email
. The action button's title will be Send email. Other options, such as to
, from
, subject
and content
, are specified on separate rows.
type
: email
to
: Recipient email addressfrom
: Sendersubject
: Email subjectcontent
(for plain text content) or
contenthtml
(for HTML content): Email content (e.g.,
=A4
, for sending the content of cell A4)
Add this action to create a button that adds data as a new row to a Google Sheets document.
type
: addrow
id
: The ID (or URL) of the Google Sheets documentsheet
(optional): The name of the sheet in which to add a rowAdditionally, add rows with column number and content, e.g.,
1
: Content to add in column 12
: Content to add in column 23
: Content to add in column 3
Also, make sure you have shared the document with
molnify-librarian@rapidcomputeengine.iam.gserviceaccount.com
to
ensure Molnify has write access.
For numbers to be correctly treated by Google Sheets, set the locale of your Google Sheets document to United States (File -> Spreadsheet settings... -> Locale: United States).
Use this action to store data in a database. Read more about enabling database connections for your app.
type
: insertRow
Additionally, add cells with column names prefixed with "." and the contents you want to add, e.g.,
tableName
: The name of the database table.first_column
: Some contents.second_column
: Some more contents.some_other_column
: Even more contentsTo update a database record, prefix your primary key column with a "k". If any matching record is found it will be updated.
k.primary_key_column
: Some contentsIf this action is present in an app, superusers are able to export all stored data as a spreadsheet alongside with the email and IP address of the user who entered the data, including a timestamp of when the data was saved. Additionally, it is possible to fetch this data via a REST API.
Use this action to store data in a database.
The variables associated with your inputs specify in which database columns the data is stored. To enable the Add Record action, you need to add the actual action and specify the database table name in your metadata, as outlined below. You also need to enable database connections for your app.
recordId
is the unique id of each record in the database table.
You may load a specific record by passing the recordId in the URL. E.g.,
app.molnify.com/app/myApp?recordId=24 to load the record with
recordId 24.
You can access the records from another app by using a records table.
type
: addRecord
RecordTableName
: data_my_database_table
Implement this action to enable users to download a database table.
type
: downloadTable
tableName
: name of the table to downloadImplement this action to enable users to download CSV or JSON data, based on a custom query.
type
: downloadQuery
query
: The (SQL) query used to retrieve the dataformat
(optional): CSV (default) or JSONdelimeter
(optional): The separator used for data, only applicable for CSV. Default is ';'This action saves a scenario. If a scenario with the same name already exists, it will be overwritten.
For general information on scenarios, refer to the Save Scenario section.
type
: scenarioSave
newName
: The name of the new scenariooldName
(optional): Specify an existing scenario name to have that deleted
as part of saving - perfect for combining saving and renaming. Renaming a scenario using oldName
is only valid for scenarios owned by the current user.
To rename a scenario owned by someone else, use overwriteCurrentScenario
, which will rename
the scenario if newName
doesn't match the name of the currently loaded scenario.private
(optional): Save the scenario as private (default is true)allowOverwrite
(optional): Enable the scenario to be overwritten by other users (default is false)overwriteCurrentScenario
(optional): Try to overwrite the currently loaded scenario (default is false).
If the currently loaded scenario isn't enabled for overwrite by other users, the scenario will be saved under the current user.This action enables you to generate files from within your app. The generated files may either be PDF or Excel files and are generated and downloaded when the action is executed. Implementing this action requires:
In the template, you design what the generated file will look like.
If you created your template in Excel, follow these steps:
If you created your template in Google Sheets, follow these steps:
molnify-librarian@rapidcomputeengine.iam.gserviceaccount.com
.Define the cells or tables that make out the source for the file to be generated. Depending on whether you have set up named ranges or tables in the template, do the following:
Add the actual action to your app by specifying the following options:
type
: generateFile
format
: pdf
or xlsx
(default is pdf
)landscape
: true
or false
(default is false
). Only applicable when format is pdffileName
: Name of the output file (default is application ID-molnify.pdf)template
(optional): Filename of the Excel template (e.g., template1.xlsx
) or the URL of the Google Sheets spreadsheet to be usedoverwriteFormatting
(optional): Overwrites the format from the template. Default is TRUE
.protectWorkbook
(optional): The generated Excel workbook will be protected from changes. Default is FALSE
.workbookPassword
(optional): A password for disabling the workbook protection. If not supplied, anyone can unprotect the workbook.This action creates a PDF report based on a Mustache template.
Assign variables to your inputs and outputs, and use them as references in your template. E.g.,
add variable=myInput
to the UI cell of an input in your app, and reference it in your Mustache template using {{inputs.myInput}}
.
If you have a group of inputs that is repeated multiple times, place them in a table and name the table. Use this name as a reference in your Mustache template.
Elements in your app are grouped like this:
inputs.variableName
outputs.variableName
charts.variableName
namedRanges.name
To view all the data your app provides when running the action, open the Sidebar, and click Debug. Select your Generate Report action from the dropdown menu in the Action section, and click Run Action.
To include charts in your generated PDF, reference them using charts.variableName
. This provides
the full SVG of the chart.
Remember to surround the variable name in your Mustache template with three curly brackets to render the HTML, i.e, {{{charts.myBarChart}}}
.
A File Upload input can contain multiple files, which are represented as a value of comma-separated URLs.
If there is only one file, you can simply reference it as {{myFileUpload}}
, to retrieve the file URL.
To iterate over multiple files in a File Upload input, use the {{myFileUpload_array}}
property, which provides an array of URLs,
e.g., ["https://.../image1.jpg","https://.../image2.jpg"]
.
To include a signature in your PDF report, follow this guide and use the hidden SVG input in your template.
Remember to surround the variable name in your Mustache template with three curly brackets to render the HTML, i.e, {{{inputs.mySignature}}}
.
Example:
This simple example demonstrates a Mustache HTML template with:
<html>
<body>
<h1>{{inputs.title}}</h1>
{{#namedRanges.Products}}
<p>Quantity: {{Quantity}} {{#Price}}at price: {{Price}}{{/Price}}</p>
{{/namedRanges.Products}}
<img src="{{inputs.anImage}}" height="400" width="auto" />
</body>
</html>
type
: generateReport
fileName
: Name of the output filetemplate
: Name of the template to be usedsuppressDownload
(optional): Disable download of the report, which
may be preferable when emailing the reportpageSize
: A0, A1, A2, A3, A4, A5, A6, Letter (default), Legal, Tabloid, Ledgerlandscape
: True or false (default) if the page size should be in landscape modecssPageSize
: Try to pick up sizes from CSS instead of here in the actionTo have the URL to the report emailed, simply add the corresponding email options,
such as to
, from
, etc. Do not include type
email
. Also note:
content
or contenthtml
: The email content. Enter {{urlToReport}}
where you want to insert the actual report URL.This action sends an HTTP request.
type
: http
url
: the URL you want to send the request tomethod
(optional): GET
or POST
(default is POST
)payload
(optional): What value to send, e.g., the JSON data (default is OK)autopayload
(optional): inputs
OR outputs
OR all
(this overrides payload
,
and automatically creates a JSON Object with the inputs, outputs or both inputs and outputs)If authorization is required, also specify these:
token
(optional): Token to send in header "Authorization"authorizationType
(optional): If you specify this, the header “Authorization” will be
sent with the value: authorizationType + “ “ + token
. The default
value for this is “Bearer” (if token is set).
To have Molnify perform several actions, specify
name
(read more)
for each action you want to perform. Then add a separate action
with type
set to
multiple
. Then refer to each other action on separate rows.
In some instances you may wish to excelude certain actions from being performed. Please, refer to the skip feature.
type
: multiple
1
: The name of the first action to perform2
: The name of the second action to perform, etc.You can add triggered JavaScript actions to be run at certain points. These are defined as part of your metadata. Current triggers supported are:
JavaScriptAfterLoad
: JavaScript code to be
run after loading the appJavaScriptAfterCalc
: JavaScript code to be
run after a successful calculation. This function is passed the
results from the calculation. Simply access
results
; e.g. console.log(results);
.
Here is an example of a JavaScript run after a
calculation. It will replace the content of an input (referenced
as variable myTextInput)
with the content of an output box (referenced as variable myOutput).
JavaScriptAfterCalc
: setValueForVariable("myTextInput", getValueForVariable("myOutput"))
.
And here is another example of a JavaScript after
a calculation:
JavaScriptAfterCalc
:
if (getValueForVariable("myOutput") == 20) setValueForVariable("myInput", "0")
.
It would update a text input (referenced as variable myInput)
with 0 if the output box (referenced as variable myOutput) equals 20.
A special kind of triggered JavaScript action is
jsOnChange
, which can be added to the UI cell of any input or output. The
provided code will be executed when the input or output is changed. E.g.,
jsOnChange=myFunction
. myFunction will be passed a reference to the actual input
element that triggered it. If your JavaScript code is only one, single statement, you may enter it directly.
The following example would check the character length of an input with variable set to charlimit.
If the length exceeds 6 characters, all characters after the sixth character are removed:
variable=charlimit;jsOnChange=if (getValueForVariable("charlimit").length > 6) setValueForVariable("charlimit", getValueForVariable("charlimit").substring(0,6));
If you have more than a single statement to run when an input or output changes, define a custom function in the MetaData property JavaScript and call it from JSOnChange.
If your app uses cutsom JavaScript code, you may specificy a custom
action handler file and action handler button title. The action
handler JavaScript file needs to implement two functions;
actionHandler(dictionary)
and
customInit(dictionary)
.
Add the following metadata values:
ActionHandler
: The path of the JavaScript
file, e.g. myCustomHandler/handler.js
ActionTitle
: The title of the button which
executes the custom action handlerYou can connect your Molnify application to an SQL database. Contact us to have your database set up.
Once your database is enabled, you can:
Molnify can perform SQL database lookups. The results can be used by your Excel functions.
To enable database lookups, you first have to add a macro to your Excel file. This also enables you to do database lookups on mock data. So, as you develop your app, you can perform lookups in a sheet locally. Once the app is online, the lookups will be done in your real database. This enables for quick testing in Excel while you're building your app.
After adding the database lookup macro, you can use the database lookup function like this:
=DBLOOKUP(id, id column name, table name, column name)
, where
id
is the value to look forid column name
is the column in which to look
for id
table name
is the name of the database table
(and the mock data sheet in your Excel file)column name
is the column containing the
value to be returnedUse the metadata option autofill.named_range
to populate your app with data
from a database table, where named_range is the named range you want to populate
with the returned data. Enter your SQL query in the metadata cell to the right.
You may then run VLOOKUP, or any other Excel function, on the returned data.
Name the range that makes out the table contents (i.e., B2:C3 in this case). Use this reference in your autofill to have the table contents replaced by the data returned from the database table.
This metadata would run the SQL query (="SELECT * from data_myTable"
) and populate the named range (data) with the results.
You may set up different autofills for different named ranges. For instance, you may have an output box
named count and have an autofill set up like this: autofill.count
:
="select count(*) from data_myTable"
to have the output box show the current number
of rows in your database table.
You may run custom, read-only SQL queries in your database table by using the Molnify function
CUSTOMSQL()
.
Example: CUSTOMSQL("SELECT COUNT(*) FROM mytable WHERE store = 'Stockholm'")
.
This section covers some slightly more advanced functionality.
You may show inputs and outputs based on the value of another input
or output by using the following syntax in the UI string:
showIfCell=cell_address;showIfValue=value_to_match
.
You may also use
showIfValueNot
to show an input when the value is not matched.
Note that instead of specifying showIfCell
, you may use
showIfVariable=myNamedRange
to refer to a
named range or a variable.
A | B | C | |
---|---|---|---|
1 | Name | showIfCell=Sheet1!B3;showIfValue=A |
This would create an input with the title Name. Because of the UI string, showIfCell=Sheet1!B3;showIfValue=A
, the input would only be visible when an input or ouput in cell Sheet1!B3 is TRUE.
For more complex conditions, you may use an output box to render, e.g., show or hide.
This cell can then be referenced, e.g., showIfCell=Sheet1!B3;showIfValue=show
, where
Sheet1B3 is the hidden output box. Read more about hidden inputs and outputs.
Note that true/false should be entered in English when used in the UI string.
In some cases you may wish to reset an input to its default value upon hiding. Read more in the section covering Reset When Hidden.
Click here for a video tutorial on conditional show.
You may add custom CSS classes to all inputs, outputs, charts and actions.
In some cases, you may need to use the class selector in combination with another one to reach the actual element that you want to affect. This applies to, e.g., toggles. For complex outputs that are contained in a panel, e.g., a chart, the class is applied to the whole panel body.
Specify your custom styles in the metadata property CSS.
UI string: class=myClass
, where myClass is your custom CSS class. Note that there should not be any ' or " characters.
An input or output may be set to be permanently hidden by specifying
hidden
as the UI string. It will still be passed along and updated at calculations. A hidden output box
can be useful for creating complex conditions for Conditional Show.
A | B | C | |
---|---|---|---|
1 | Positive? | =IF(B3>0;"show";"hide") | hidden |
This would create an output with the title Positive?. Because of the UI string, hidden
, it would always be hidden.
Solver is a custom Molnify function for goal seeking. Note that this function is not available in Excel and will hence report an error in Excel, but work when you upload your application to Molnify.
Syntax: =SOLVER(f; v; x)
where f
is the reference as a string to the cell that contains the goal function (the dependent variable), v
is the goal value that you want the goal function to get and x
is the reference as a string to the cell that contains the independent variable to vary
Example: =SOLVER(“Sheet1!H4”; 0; “Sheet1!B4")
. This will return the value of B4 (the cell to vary)
that will make H4 (the goal function) result in the value 0 (the value to goal seek for). Let's say H4 has the following
function: =B3*7-B4*3+B5
and B3 and B5 are inputs set to 5 and 1. Running SOLVER as defined in this example
would result in 12, since 0 = 5*7 - B4*3 + 1 => B4*3 = 36 => B4 is 12.
Advanced syntax: =SOLVER(f; v; x; z; zv; step; tolerance)
where f
, v
and x
are defined as above, and z
is the reference as a string to an additional cell to which you can chance the value for to zv
before optimization. step
is an optional manual step to use instead
of the automatic step and tolerance
is the tolerance as an absolute measure of deviation from v
This advanced syntax allows you to handle more complex optimization scenarios, as well as set manual step (as a fall back from an automatically calculated step size) and tolerance. Example: =SOLVER(“Sheet1!H4”; 0; “Sheet1!B4"; “Sheet1!B6"; 12; 3; 2)
will just as above solve the same function but now move in steps of 3 until the goal function is between -2 and +2 (tolerance of 2). Additionally, it will set Sheet1B6 to the value 12 before starting the optimization. Manual step may be used when the goal function e.g., is not differentiable or well behaved.
For when the solver does not converge, you may try another implementation based on the bisection method called SOLVERBI
. Although it converges more slowly you might find it gives better results for your case. Similar to SOLVER
, its syntax is =SOLVERBI(f; v; x; z; zv; lowerBound; upperBound)
with two optional parameters for bounding the function.
One additional method called SOLVERSTEP
is a step based approach in which the solver takes a fixed step for x
up to maximum number of steps until a boolean function q
evaluates to TRUE
and the optimization will exit and return the (current) value for x
. The syntax for this is =SOLVERSTEP(q; TRUE; x; z; zv; stepSize; maxSteps, startingX)
, in which stepSize
is the change of x
in each iteration, maxSteps
is the maximum number of steps (up to 200), and finally startingX
is the value of x
from which the optimization should start from.
Note that q
,x
and z
are string references to cells - e.g., "Sheet!A1". Only q
and x
are required, the remaining parameters can be left out and then assumes default values.
To retrieve data from a URL, simply add the Molnify function XMLService
. This function is available in some versions of Excel, but not all. If it is not available in your version of Excel, then you will not receive data/results in Excel, despite it will work when you have uploaded the application to Molnify.
Syntax: =XMLService(url)
where url
is the URL of the XML data.
The Molnify function filterXML
lets you filter out data from an XML string using the standard query format XMLPath. Note: this function is not available in Excel and will hence report an error in Excel, but work when you upload your application to Molnify.
Syntax: =filterXML(xmlString; xmlPath)
, where
xmlString
is the XML string to filterxmlPath
is the XML filterRefer to https://www.w3schools.com/xml/xpath_syntax.asp for details on XML paths.
Example: =FILTERXML(B5;"firstName")
, where B5 contains <firstName>John</firstName>
would give you John.
The Molnify function filterJSON
lets you filter out data from a JSON string using a query format named JSONPath. Note: this function is not available in Excel and will hence report an error in Excel, but work when you upload your application to Molnify.
Syntax: =FILTERJSON(jsonString; jsonPath)
, where
jsonString
is the JSON string to filterjsonPath
is the JSON filterRefer to https://jsonpath.com/ and https://goessner.net/articles/JsonPath/ for details on JSON paths.
Example: =filterJSON(B5;"firstName")
, where B5 contains {"firstName": "John"}
would give you John.
Assign a variable name to an input or output. This is done by adding variable=myVariable
to the UI string, where myVariable is the variable name. This can also be done by simply
defining a named range for the cell. The named range then becomes the variable name.
Variables can be used for initializing inputs from URL parameters upon load.
Variables are also a convenient way of referencing to specific elements without relying on them
maintaining the same cell reference. E.g., use the following jQuery snippet to reference an
element with variable set to lastName: $("[variable='lastName']")
.
Finally, the variable names can be referenced when integrating your app with other services and APIs.
Metadata refers to general information about your app, such as name and author. Metadata also contains data on what users are allowed access. Finally, metadata may also contain styling properties. The cells need to be colored purple.
General metadata covers information such as the name, author, version, etc. Enter the options in purple cells.
Name
: App nameAuthor
: AuthorWebsite
: Website URL (your logo would link here)Version
: VersionID
: App ID. Used to identify the app. It is
reflected in the app's URL. E.g., app.molnify.com/app/my_id.
Description
: A text description of your appReference
: In-depth description and/or
referenceThis set of metadata would create an app with the ID myApp, the name My App and set the author to John Doe. Its ID is reflected in the URL of the app. In this case it would be app.molnify.com/app/myApp.
Molnify offers settings for enabling and disabling general functionality.
AutoCalcEnabled
: Enable app for automatic
calculations (TRUE
or FALSE
)CookieConsentPopUp
: Molnify stores some cookies (please refer to the
Cookie Policy).
If you wish to collect cookie consent when users visit your app, set this metadata option to TRUE
.
Default is FALSE
.
JavaScriptAfterLoad
: $("#cookie-consent-modal > .modal-dialog > .modal-content > .modal-body").text("My custom cookie consent text.")
.EnabledForCalculate
: Specify this as FALSE
to hide the calculate button for you app; combine with AutoCalcEnabled
FALSE
to completely disable calculationsEnabledForDynamicTitles
: Set this to FALSE
to disable dynamic titles for the inputs and outputs in you appEnabledForPrint
: Specify this as FALSE
to hide the print button for you appEnabledForReset
: Specify this as TRUE
to enable a reset button for you appEnabledForUpdate
: Enables users to trigger
an update of the app (TRUE
or FALSE
)EnabledForLogOut
: Shows a sign out button,
if the user is logged in. Specify EnabledForLogOut
to TRUE
. Default is FALSE
.
CustomLogOutURL
: Specify a URL, where the
user will be redirected at sign out. E.g., CustomLogOutURL
: https://www.molnify.com
.EnabledForSameSiteNoneAccessToken
: Set this to TRUE
to
enable an app, that requires sign-in, to be accessed using a SameSite None cookie.
This is required for an app to be accessible in an iframe. Default is
FALSE
.
ClearClipboardAtReset
: Specify this as TRUE
to clear the clipboard at each resetClearClipboardAtCalc
: Specify this as TRUE
to clear the clipboard each time the calculate button is clickedMolnifyIgnore
: Enter MolnifyIgnore
in cell A1 of a sheet that you don't want to include in your
app. Make sure to also specify ParseAllSheets
: TRUE
.OnlyIncludeSheet
: Names of the Excel
sheets to be included (comma-separated)ParseAllSheets
: Set to TRUE
to tell Molnify to look for inputs and outputs in all sheetsJavaScript
: Use this to add custom JavaScript code. Functions defined
in this cell may be called from other places in your app, e.g., from
JSOnChange.
JavaScript
: function myFunction() { alert("Hello world!"); console.log("Alert triggered"); }
.
Let your users save the current state of the app (inputs and outputs) as a scenario by
adding the option EnabledForSave
TRUE
to your metadata.
If you prefer, you can add a Save Scenario action instead of using the standard save button.
The following options can be added to your metadata regarding scenarios:
variable=molnifyCurrentScenario;
to have that input contain the currently selected scenario.
Useful, e.g., when implementing an action, which renames the
currently selected scenario.
variable=molnifyCurrentScenarioLink;
will contain a link to the currently selected scenario. Useful, e.g., when you want to
save a scenario and create an e-mail with a link which references that scenario.
ScenarioNameVariable
to the name of a
named range or variable
which contains your desired default name when saving a
scenario.
ScenarioSavePrivate
to TRUE
if you want scenarios to be saved privately by default.
ScenarioSharedUsersCell
and specify a cell,
e.g., Sheet1!B10
to share the scenario with
a specific user. Ensure that the referenced cell
is an input. Populate the cell with the email of another
user that you wish to share the scenario with. The scenario
will then show up in the scenarios list for that user. If you
wish to share a scenario with several other users, you can either
use a wildcard (e.g., *@mydomain.com) or separate multiple email
addresses with commas.
ScenarioTerm
: By default, a saved app state is called a Scenario.
To use a custom term, e.g., Order, specify ScenarioTerm
Order
.
Molnify supports multiple types of sign-on: email/password, Google based, Swedish BankID biometric login, Azure AD, TokenAuthentication (described below) and SAML-based logins. Contact us to enable SSO for your domain(s)
The purpose of TokenAuthentication is so that you as a client of Molnify can easily log in your customer to Molnify applications, without having to go through the process of having your users creating accounts on Molnify or alternatively integrate with your SSO solutions (e.g., Google Domains or Microsoft Active Directory). An app can be enabled for token-based authentication by specifying the metadata
TokenAuthentication
. Note that the values for this metadata property is a
semicolon-separated string of settings. E.g., TokenAuthentication
: algorithm=myAlgorithm;salt=mySalt
, where
myAlgorithm and mySalt have been configured by Molnify.
When signing in to an app using token authentication, the URL is:
https://app.molnify.com/tokenauthentication/MY_APP_ID?email=name%40domain.com&token=MY_TOKEN
.
Token authentication sets the flag EnabledForSameSiteNoneAccessToken
to true, due to technical reasons.
Contact us to enable this for free for your domain(s) and send you an implementation guide
algorithm
: Algorithm name (given to you by Molnify as part of implementation).salt
: Salt (selected by you).loginPage
(optional): Custom login page, if a call to /tokenauthentication/appId
fails, instead of the normal Molnify login page.email
(optional): URL parameter name to use instead of 'email'.token
(optional): URL parameter name to use instead of 'token'.Molnify allows for refined user handling based on email addresses or Swedish personal identity numbers. Enter the options like any other metadata, i.e., in purple cells. To retrieve the current user, add a dedicated input.
Users
: A comma-separated list of email
addresses that are allowed to access the application. Defining all
users on a domain is also supported by specifying, e.g.,
*@mycompany.com
. Contact us if you need to set up whitelisting for specific
IPs/networks. To grant all users access, specify *@*
.
Managers
: A comma-separated list of users
that are allowed to view all scenarios and download data added using the Insert Row to Database action.SuperUsers
: A comma-separated list of users
that are allowed to more extended access the application, such as updating it. They also
have the same permissions as Managers
.Users
,
Managers
or SuperUsers
to enable sign in with BankID.Instead of a comma-separated list of Users or SuperUsers, you may specify a range where the users are listed in rows.
Example: If your list of regular users is located in the sheet MyUsers (column A; rows 2 to 100), you may
specify Users
: MyUsers!A2:A100
. This also applies to SuperUsers
and Managers
.
Sometimes your application is used by multiple of your own customers and you want to split access between certain types of data between the customers. Realms
works by adding Realms
and specifying which realms you want to use e.g., Alpha,Beta,Gamma
. Records and Scenarios
can then optionally be accessed and used only within a certain realm. You can have an input populated with the currently selected realm by setting
its UI string to currentRealm
. The input will not be shown in the app, but its value is accessible by simply referencing
the cell in your spreadsheet.
Contact us to explore this advanced feature
Set the colors of your headers, buttons, etc. by using the metadata options
below. For instance, enter
HeaderColor
in cell A1 and specify the desired color for the app header in cell
B1, e.g.
#ff0000
for red. Remember to color all metadata cells purple.
TopBannerColor
: Top banner colorTopBannerHidden
: Set this to TRUE
to hide the top-most bannerHeaderFont
: Header text font, e.g., ArialHeaderHidden
: Set this to TRUE
to hide the headerHeaderTextColor
: Header text colorPanelHeaderColor
: Panel header colorBackgroundImageURL
: The URL of your desired
background imageBodyFont
: Body text font, e.g., ArialButtonColor
: Button colorButtonActiveColor
: Color of a
selected/active buttonSuccessButtonColor
: Button color for success
buttonsToggleActiveColor
: Color of a toggle turned
to onExpandButtonColor
: Color for expand buttonsCollapseButtonColor
: Color for collapse
buttonsCalculateTitle
: Title of calculate buttonCopyTitle
: Title of copy buttonCustomInfoTooltip
: Custom tooltip for info
buttonCustomReferenceTooltip
: Custom tooltip for
reference buttonCustomUpdateTooltip
: Custom tooltip for
update buttonCustomSaveTooltip
: Custom tooltip for save
scenario buttonCustomPrintTooltip
: Custom tooltip for
print buttonCustomResetTooltip
: Custom tooltip for
reset buttonCustomLogoutTooltip
: Custom tooltip for log
out buttonCustomDeleteTooltip
: Custom tooltip for
delete scenario buttonCustomDownloadDataTooltip
: Custom tooltip
for download data buttonSliderMinAndMaxBackgroundColor
: Background
color for the min and max values of a sliderSliderMinAndMaxTextColor
: Text color for
the min and max values of a sliderSliderCurrentValueBackgroundColor
:
Background color for the current value of a sliderSliderCurrentValueTextColor
: Text color for
the current value of a sliderPanelsFixed
: Set this to TRUE
to make all panels fixed in position meaning they can't be
rearrangedInputPanelTitle
: Title of input panelInputPanelSmall
: Will make the input panel
narrowerInputPanelFixed
: Will make the input panel
fixed to the leftOutputPanelTitle
: Title of output panelOutputBoxBackgroundColor
: Background color
of an output boxLogoURL
: URL of custom logotype image.
Alternatively, you can include a logotype image directly in your
Excel file.AppleTouchIconURL
: URL of icon for iOS
devicesChartDownloadBackgroundColor
: Background color for charts
when downloading them as a PNG file. Default is transparent
.
You may also specify a completely custom CSS by using CSS
. For instance, enter
CSS
in cell A1 and your CSS string in cell B1, e.g.
text { font: 12px sans-serif; }
.
If you're using a CSS template, use the keyword
AdditionalCSS
to append CSS styles to the template your're using.
You can add custom CSS classes to all elements using the UI string class.