Frontend settings

Changing the logo and other frontend settings

You do not need to pay the white-label fee in order to remove the Fleio logo from the top-left corner of Fleio web application.

How to change default display mode for items

Change the items_display_mode property from the same constants.js files as stated above to either cardview to display the items as cards or listview to display them like a list. Note that the user will still be able to change the display mode for a page using the button from the top-right side of the page content.

How to add custom menu items and categories

You are able to customize your menu by adding top level menu options with links, menu options underneath existing categories or even add new categories with menu options. To do so, you just need to edit your settings.py file (more on that here).

You need to edit some settings (available both for enduser and staff panel). These settings are: CUSTOM_MENU_CATEGORIES_ENDUSER, CUSTOM_MENU_OPTIONS_ENDUSER, CUSTOM_MENU_CATEGORIES_STAFF, CUSTOM_MENU_OPTIONS_STAFF.

To add a category you may follow the following example:

CUSTOM_MENU_CATEGORIES_ENDUSER = {
    'Category one': {
        'main_feature': 'core',
        'location': 2,
    },
    'Category two': {
        'main_feature': 'core',
        'location': 3,
    }
}

You may condition the category by any existing feature name in fleio (more on that here). You can use the core feature if you want your category to be always visibile (‘core’ feature is always enabled). Also note the location setting, which allows you to specify where in the menu should the category appear. Note that counting starts from 0. Also, you should be careful not to use the same location for more than 1 custom category because this may raise issues in your application.

To add a menu option underneath a menu category (already existing in fleio or one that you created like described above), you may use the CUSTOM_MENU_OPTIONS settings for enduser and staff like in the following example:

CUSTOM_MENU_OPTIONS_ENDUSER = [
        {
            'category': 'Category one',
            'label': 'Option one',
            'href': 'https://fleio.com',
            'open_in_new_tab': True,
            'icon': 'warning',
            'feature': 'core',
    },
    {
            'category': 'Billing',
            'label': 'Custom product',
            'href': 'https://fleio.com',
            'open_in_new_tab': True,
            'icon': 'product',
            'feature': 'billing',
            'location': 2,
    },
]

As you may notice, there are several settings that you can use. Use the category attribute to specify under what category the new menu option should be placed, use label attribute to specify what will be the menu option’s name, href attribute for redirecting to a custom link, open_in_new_tab to make users open the link in new tab when clicking it, icon for displaying an icon to the left and feature to condition this menu option by a fleio feature. Again, you can use ‘core’ feature to make sure it will appear forever. Also, you can use the location attribute just like you did for categories.

To add a top level menu option (it will not be under any category) add a new option in the ‘CUSTOM_MENU_OPTIONS_ENDUSER’ setting just like above, but not using the category atttribute. So, this may look like this:

CUSTOM_MENU_OPTIONS_ENDUSER = [
        {
            'label': 'Top level',
            'href': 'https://fleio.com',
            'open_in_new_tab': True,
            'icon': 'warning',
            'feature': 'core',
            'location': 6,
    },
]

For top level menu options, make sure their location is not the same with one defined for categories.

White-label

If you want to remove the small Fleio link that appears at the bottom of the login screen and at the bottom of the left menu, you have to purchase the white-label option.