Documentation
Web Item
Adds a web item to a specified location in the application interface. A web item is a hyperlink that’s inserted into some standard place in the Atlassian application interface, such as the administration menu.
The form that the link takes can vary depending on the location. For instance, a web item in the header bar (with a location section ofsystem.top.navigation.bar) adds a link to the navigation bar across the top of the
interface. On the other hand, a web item in the opsbar-operation location section in JIRA adds an item to the
issue operation buttons.
A web item link can open a new page in the application or a dialog, depending on your configuration.
Web items are a simple and useful way to extend Atlassian applications. If you want to extend an Atlassian
application and don't know where to start, a web item may be all you need.
Your add-on can receive additional context from the application by
using variable tokens in the url attribute.
Example
{
"webItems": [
{
"url": "/my-web-item",
"location": "system.preset.filters",
"context": "addon",
"weight": 200,
"target": {
"type": "page",
"options": {}
},
"styleClasses": [
"webitem",
"system-present-webitem"
],
"tooltip": {
"value": "Example tooltip"
},
"icon": {
"width": 16,
"height": 16,
"url": "/maps/icon.png"
},
"key": "web-item-example",
"name": {
"value": "My Web Item"
}
}
]
}
Properties
location
Type
stringRequired
Description
The location in the application interface where the web item should appear. For the Atlassian application interface, a location is something like the coordinates on a map. It points to a particular drop-down menu or navigation list in the UI.
Places in the Atlassian UI are identified by what are known as "well-known locations". For example, thesystem.admin/globalsettings location is in the administrative
menu on the left side of the Administration Console.
Product location documentation:
name
Type
Required
Description
A human readable name.
key
Type
stringRequired
Description
A key to identify this module. This key must be unique relative to the add on.
All specified keys will have all special characters and spaces replaced with dashes and will be lower cased.
example: "My Addon Key" will become "my-addon-key"
The key is used to generate the url to your add-on's module. The url is generated as a combination of your add-on key and module key. For example, an add-on which looks like:
{
"key": "my-addon",
"modules": {
"configurePage": {
"key": "configure-me",
}
}
}
Will have a configuration page module with a URL of /plugins/servlet/ac/my-addon/configure-me.
url
Type
stringuri-templateRequired
Description
Specifies the URL targeted by the web item. The URL can be absolute or relative to either the product URL or the add-on's base URL, depending on the context attribute.
Your add-on can receive additional context from the application by using variable tokens in the URL attribute.conditions
Type
Composite Condition, Single Condition, … ]Description
Conditions can be added to display only when all the given conditions are true.
context
Type
stringDefaults to
addonAllowed values
pageaddonproductDescription
The context for the URL parameter, if the URL is specified as a relative (not absolute) URL.
This context can be eitheraddon, which renders the URL relative to the add-on's base URL,
page which targets a page module by specifying the page's module key as the url
or product, which renders the URL relative to the product's base URL.icon
Type
Description
An optional icon to display with the link text or as the link, specified by URL to its hosted location. You can specify a particular width and height for the icon. Most link icons in Atlassian applications are 16 by 16 pixels.
params
Type
objectDescription
This object represents a map of key/value pairs, where each property name and value corresponds to the parameter name and value respectively.
Example
{
"params": {
"someOtherProperty": "someValue",
"myCustomProperty": "myValue"
}
}
styleClasses
Type
string, … ]Description
Specifies custom styles for the web item target page, if desired. By default, the web item content gets styled in the default style of the target application.
tooltip
Type
Description
The internationalised text to be used in the link's tooltip.
target
Type
Description
Defines the way the url is opened in the browser, such as in a modal or inline dialog. If omitted, the url behaves as a regular hyperlink.
{
"target": {
"type": "inlinedialog",
"options": {
"onHover": true,
"offsetY": "20px",
"offsetX": "30px"
}
}
}
weight
Type
integerDefaults to
100Description
Determines the order in which the web item appears in the menu or list.
The "lightest" weight (i.e., lowest number) appears first, rising relative to other items, while the "heaviest" weights sink to the bottom of the menu or list. Built-in web items have weights that are incremented by numbers that leave room for additional items, such as by 10 or 100. Be mindful of the weight you choose for your item, so that it appears in a sensible order given existing items.