Command reference

This page lists every command that can be called from an HTML block through the data-mobius attribute (see Getting started). Parameter names are given in the order they can be passed "in brackets".

App navigation

Convenient commands for opening a particular screen. Prefer them to manual navigation.

Command	What it does	Parameters
`catalog.openHome`	Opens the catalogue home	-
`catalog.openSection`	Opens a catalogue section	`id`, `title`
`catalog.openSectionFiltered`	Opens a section with a preset filter and its own title	`id`, `title`, `filter`
`catalog.openProduct`	Opens a product card	`id`
`catalog.search`	Opens the product list for a search query	`phrase`
`loyalty.openCard`	Opens the loyalty card	-
`scanBarcode`	Opens the barcode scanner	-

                                HTML                            

                            
<a data-mobius="catalog.openSection('320', 'New in')">New in</a>
<a data-mobius="catalog.openProduct('15')">Product of the week</a>
<a data-mobius="catalog.search('coffee')">Find coffee</a>
<a data-mobius="loyalty.openCard">My card</a>
                        

The filter parameter is a set of selection conditions. Pass it through data-params:

                                HTML                            

                            
<a data-mobius="catalog.openSectionFiltered"
   data-params='{"id":"320","title":"On sale","filter":{"sale":"Y"}}'>
    Discounted products
</a>
                        

Basket

Command	What it does	Parameters
`basket.add`	Adds a product to the basket	`id`, `qty`
`basket.update`	Changes the quantity of a product	`id`, `qty`
`basket.remove`	Removes a product from the basket	`id`, `qty`
`basket.clear`	Clears the basket completely	-

If no quantity is given, 1 is used.

                                HTML                            

<button data-mobius="basket.add" data-id="15">Add to basket</button>
<button data-mobius="basket.add" data-id="15" data-qty="6">Take a pack of 6</button>

Favourites and comparison

Command	What it does	Parameters
`favorites.toggle`	Adds a product to favourites or removes it	`id`
`compare.toggle`	Adds a product to comparison or removes it	`id`

                                HTML                            

<button data-mobius="favorites.toggle" data-id="15">Add to favourites</button>

Sheets and modal windows

Command	What it does	Parameters
`webview.openSheet`	Shows a bottom sheet with ready content	`html` or `url`, `snapPoints`
`webview.openModal`	Opens a full-screen window with content	`html` or `url`, `title`
`bottomsheet.open`	Shows a sheet with content described in the block itself	the `id` of the embedded block
`modal.open`	Opens a window with content described in the block itself	the `id` of the embedded block
`document.open`	Opens a PDF document inside the app	`url`, `title`

The most convenient way is to describe the sheet content right in the block and refer to it by id:

                                HTML                            

                            
<a data-mobius="bottomsheet.open('info')">More about the offer</a>

<bottomsheet id="info" height="60%">
    <h3>Offer terms</h3>
    <p>The discount runs until the end of the month across the "New in" section.</p>
</bottomsheet>
                        

The <bottomsheet> tag is not visible in the block itself: the app shows its content as a sheet only on tap. The height attribute sets the sheet height. This technique works in blocks on the home screen, on the product card and in stories.

The document.open command displays a PDF correctly on both iPhone and Android:

                                HTML                            

                            
<a data-mobius="document.open"
   data-params='{"url":"https://example.com/warranty.pdf","title":"Warranty"}'>
    Open the warranty
</a>
                        

Toasts, links, region

Command	What it does	Parameters
`notification.toast`	Shows a toast notification	`title`, `message`, `type`
`share`	Opens the system share sheet	`message`, `url`, `title`
`openURL`	Opens an external site in the browser	`url`
`region.set`	Changes the current region	`id`, `title`

For notification.toast the type parameter takes info, error or warning.

                                HTML                            

                            
<button data-mobius="notification.toast"
        data-params='{"title":"Done","message":"Promo code copied","type":"info"}'>
    Show a toast
</button>

<a data-mobius="share"
   data-params='{"title":"Our app","url":"https://example.com"}'>
    Share
</a>
                        

Manual navigation

If there is no ready command for what you need, use the universal ones. screen is the screen name and params are its parameters.

Command	What it does	Parameters
`navigation.navigate`	Opens the given screen	`screen`, `params`
`navigation.goBack`	Returns to the previous screen	-

                                HTML                            

<a href="mobius://navigation.goBack">Back</a>

In most cases the ready commands in the App navigation section above are more convenient: they are simpler and require no knowledge of screen names.

Compatibility with older blocks

Blocks built earlier with MobiusApp.navigation.navigate(...) or with buttons carrying data-screen keep working. There is no need to rewrite them. For new blocks use data-mobius: it is simpler and more general.

What next

Examples: ready blocks based on these commands.
Programmatic access: how to receive a result from a command and read user data.

Updated 04.09.2026 18:04

Was this page helpful?

Getting started Programmatic access (Mobius)