# Config Reference
# title
- Type:
string
- Default:
undefined
The Title for of Site. This will be the suffix for all page titles and displayed in the navbar. It is also used in the Manifest File.
# short_title
- Type:
string
- Default:
undefined
The Short Title of the Site. This will be used in the short_name
attribute of the Manifest File.
TIP
If this parameter is not defined, the value of the title
will be used by default.
# name
- Type:
string
- Default:
undefined
The Name of the Application. It is also used in the Manifest File and as id for assets caching with Service Worker.
WARNING
It should be an alphanumeric and lowercase value.
TIP
If this parameter is not defined, a value based on the title
will be generated.
# description
- Type:
string
- Default:
undefined
The Description for the site. This will be rendered as a <meta>
tag in the page HTML and used in the Manifest File.
# baseUrl
- Type:
string
- Default:
/
The base URL the site will be deployed at. It can be just a slash or a valid URL that shouldn't end with a slash.
WARNING
Since version v0.3.0
, deployments under a subpath (e.g. https://example.com/status/
) are no longer supported.
TIP
You should set the baseUrl
field to your production domain in order to make Alternate URLs fully-qualified.
# theme
- Type:
Object
Provide config options to the be used by the theme.
# scheduled 0.3.0+
- Type:
Object
- Default:
{ position: 'belowSystems' }
Define the position of the Section Scheduled Maintenance in the home page. The allowed values are: belowSystems
, aboveSystems
and aboveGlobalStatus
.
# links
- Type:
Object
- Default:
{}
The external links located at the Footer of each page. There only three links you can define: home
, contact
, support
, legal
and privacy
and must be used the language code as the index of the object. For example:
module.exports = {
theme: {
links: {
en: {
contact: "https://statusfy.co/contact",
support: "https://statusfy.co/support",
home: "https://statusfy.co",
privacy: "https://statusfy.co/data-privacy",
legal: "https://statusfy.co/legal"
},
es: {
contact: "https://statusfy.co/es/contact",
support: "https://statusfy.co/es/support",
home: "https://statusfy.co/es",
privacy: "https://statusfy.co/es/data-privacy",
legal: "https://statusfy.co/es/legal"
}
}
}
}
# serviceWorker
- Type:
boolean
- Default:
true
If set to true
, Statusfy will automatically generate and register a service worker that caches the content for offline use (only enabled production builds). For more details, see the guide on Progressive Web App (PWA).
Important
To make your site fully PWA-compliant, you will need to enable the Web App Manifest.
Also, only enable this if you are able to deploy your site with SSL since service worker can only be registered under HTTPS URLs.
# manifest
- Type:
boolean
- Default:
true
Generate a valid Web App Manifest. For more details, see the guide on Progressive Web App (PWA).
# analytics
- Type:
object
- Default:
undefined
The analytics services.
# ga
- Type:
string
- Default:
undefined
Provide the Google Analytics ID to enable integration.
# mixpanel
- Type:
string
- Default:
undefined
Provide the Mixpanel Token to enable integration.
- Type:
string
- Default:
undefined
Provide the Facebook Pixel App ID to enable integration.
# segment
- Type:
string
- Default:
undefined
Provide the Segment Token to enable integration.
# notifications 0.2.0+
- Type:
object
- Default:
{}
The available notifications options.
# webpush 0.4.0+
- Type:
object
- Default:
undefined
Allow your users/customers to subscribe to Web Push notifications from their browsers. For more details, see the guide on Notifications.
In order to activate OneSignal, you must define your AppID:
...
webpush: {
onesignal: {
appId: "yout-one-signal-app-id"
}
}
...
# icalendar 0.2.0+
- Type:
boolean
- Default:
true
Activate the calendar containing all of your upcoming and past Scheduled Maintenances. For more details, see the guide on Notifications.
# feeds 0.2.0+
- Type:
boolean
- Default:
true
Activate the feeds that include all past Incidents and Scheduled Maintenances. For more details, see the guide on Notifications.
# twitter 0.2.0+
- Type:
object
- Default:
undefined
Define Twitter accounts that your users can access in order to receive updates.
You must define a value for each language your system supports:
...
notifications: {
twitter: {
en: "BazziteTech",
es: "BazziteES"
}
}
...
For more details, see the guide on Notifications.
# support 0.2.0+
- Type:
object
- Default:
undefined
Define the external Support Sites your users can access in order to receive updates from other sources you may want to provide.
You must define a value for each language your system supports:
...
notifications: {
support: {
en: "https://statusfy.co/support",
es: "https://statusfy.co/es/support"
}
}
...
For more details, see the guide on Notifications.
# defaultLocale
- Type:
string
- Default:
en
The app's default locale, URLs for this locale won't have a prefix. It is also used in the Manifest File.
# locales
- Type:
[{ code: string, iso: string, name: string }]
- Default:
[{ code: 'en', iso: 'en-US', name: 'English' }]
Specify locales for i18n support. For more details, see the guide on Internationalization.
# content
- Type:
object
- Default:
{ dir: 'content', systems: [ 'api', 'cdn', 'dns', 'site-delivery' ] }
Parameters that define some content considerations for your Incidents.
# dir
- Type:
string
- Default:
content
The path that defines the location of your incidents' markdown source files.
# frontMatterFormat
- Type:
string
- Default:
yaml
Define the default format of the Incidents' Front Matter used by the new-incident
command (More info here). You can choose one of the following: yaml, yml, toml, json. For more details, see the guide on Incidents' Front Matter.
# systems
- Type:
Array
- Default:
['api', 'cdn', 'dns', 'site-delivery']
Define the IDs of the Available Systems. These IDs will be used when you indicate the Affected Systems in your Incidents.
Important
You must define, in your locales files, the Human-Friendly titles of the defined IDs Systems.
# head
- Type:
object
- Default:
undefined
Extra tags to be injected to the page HTML <head>
. Each tag can be specified in the form of {tagCategory: [tagName, { attrName: attrValue }]}
. For example, you can add a custom mask-icon:
module.exports = {
head: {
link: [
{ rel: 'mask-icon', href: '/icons/safari-pinned-tab.svg', color: '#3e4e88' }
]
}
}
or define a meta tag site verification:
module.exports = {
head: {
meta: [
{
name: 'google-site-verification',
content: '+nxGUDJ4QpAZ5l9Bsjdi102tLVC21AIh5d1Nl23908vVuFHs34='
}
]
}
}
To know the list of options you can give to head, take a look at vue-meta documentation.