The "product" feature allows you re-package applications created in DbFace as a standalone web product.

Web product works as a standalone application which has its own URL, brand, menu, and login system. You can even choose a prebuilt theme for the web product.

Export applications created in DbFace as web product

Product Builder#

DbFace provides you a super easy way to pick existed applications and combine them into menu items.

Sign in DbFace with the administrator account. Tap the "All Product" icon at the right-top corner. You can see all the web products under your account.

Web products under my account

Tap the "Create new product" button to enter Product builder interface, if you want to edit the existing web product, tap the "Edit" button.

Web product builder interface in DbFace

Settings#

Web product Settings

  • Name
    The web product internal name. If you do not provide Brand name, it will also be considered as the brand name.

  • URL
    The web product URL suffix. DbFace will generate the web product URL based on the DbFace installation and the web product URL field.

  • Description
    The web product description text.

  • Design Theme
    DbFace provides several prebuilt color themes for your web products. You can even custom the final product theme based on the prebuilt theme by editing CSS code.

  • User Logins
    Select the "Public" radio button, web product does not require user logins to access all the applications. If your DbFace installed on a public web server, that means anyone can access these applications in the web product.

  • Active this product
    The web product can not be accessed until you check the "Active this product" checkbox.

Applications#

In the "Applications" section, you pick applications under your account and combine them into menu items.

Web product Menu builder in DbFace

Misc Settings#

Web product misc settings

  • Brand
    The web product brand name.

  • Brand URL
    People tap the brand will open the brand URL.

  • Menu Type
    Use static and fixed top navbar.

  • Menu Position
    Place the menu left or right.

  • Container
    The application container responsive fixed width or full width of the viewport.

Styles#

You can use CSS code and Javascript to customize the behavior of the web product. Your CSS code will override the default styles. The javascript code will be loaded and executed after the web product loaded.

Web product Styles and Javascript

Preview Area#

Tip

Please notice that the preview area does not show you the REAL look of the web product. You need to click "Preview" button to see what the web product looks in actuality.

Web product preview area

Preview & Save#

Tap the Preview button, you can check what the web product real look. You need to input URL field in the settings section before you tapping the Preview button.

Tap the "Save" button to save the web product. You can find the web product URL in the list page.