Customization

DO IT YOURSELF - INTRODUCTION

The ‘Do It Yourself’ functionality in Sweet One gives the super users the ability to configure and adapt the system for different customer needs. By creating your customizations, you can decide what elements and fields to show or hide.

You can take it even one step further and create logic by adding visibility rules. Moreover, you can create new objects based on existing ones and add new fields to both custom and default objects.

The purpose of Do It Yourself is to give the users the possibility to easily adapt Sweet One to their needs without having to code and go through time-consuming release processes.

What is the customization?

Customizations are the core part of ‘Do It Yourself’ functionality. These are the different setups of Sweet One that the user creates. More than one customization can be added to the same environment. You can decide which user groups are connected to specific customization and which customization should be used as a default for all other users. This functionality allows the users to interact with a system that is adapted for them specifically. You can simply think of customizations as different “apps” inside Sweet One. One might be geared towards Sales and another towards Support – two versions of Sweet One for different user groups within the same environment.

In order to access the customization mode, you need to have a feature called: Admin core: Developer.

Users with that feature see a gear icon on the right-hand side of the top bar.

Cus1

Click the gear icon to see the following options:

  1. Create new customization: you can create a new customization
  2. Existing customizations: the system shows a list of all the current customizations available in this environment
  3. Upgrade ConfigurationSet: Opens the tool for upgrading customization (developer functionality)

Cus2

Creating new customization

When creating new customization, you need to specify: user type, the name for this customization and decide which source configuration set your new customization should be based on.

Click ‘create’ to save your new customization.

User type: the new ‘customization’ functionality in Sweet allows the user to create customizations for all different user types that can log in to Sweet One. These user types are: responsible users, private persons, contacts and companies.

Configuration set name: name your customization

Source configuration set: shows a drop-down with all the available base customizations.

Cus23

After ‘creating’ the new customization, the user is navigated to the edit mode, the indicator in the top bar and the name of the current customization is displayed.

admin2

Click the gear icon on the top bar while you are in the edit mode to see the following options:

Exit customization mode: you can exit the customization mode and navigate back to the default customization.

Publish settings: This functionality opens the publish setting for your customization. Customization can be published for all users or only for specific user groups. Users belonging to the user group you publish for will get this customization as the new default customization. Read more under “Publish customization”.

Object manager: opens the settings for all the objects in the customization. From here, you can add new fields to the object or create new object called sub types. Read more under “Object manager”.

Selection manager: opens the settings for data sources/selections in the customization. Here you can edit selection lists, decide which columns and filters should be available, and set the list’s default sort order.

Show revision comments: shows a list of all comments made for the history log. Here you can click on each comment and see the changes made.

Cus3

Editing your customization

You can edit many parts within Sweet One when the customization is in edit mode.

These parts include:

  1. Side menu
  2. Applying visibly rules
  3. Editing object
  4. Managing lists
  5. Rearranging the UI

Click the green icon to open the editor for a specific part of Sweet One. There are mainly three different areas where the icon is shown:

  1. The side menu: opens the editor for the side menu
  2. The top-right corner of the main area: opens the editor for the current page/object you are at
  3. Besides lists/tables: a short-cut for entering edit mode for a table list. You can also access the list editors from the selection manager located in the main gear icon in the top right-hand corner of the page.

See also

Note that this version only supports changes in the tables/grids.

admin3

Editing a customization - side menu

Click the green icon on the side menu to access the edit mode for the sidebar.

A representation of the menu items in a tree structure will be presented. You can easily reorder the items by using the drag and drop functionality. Click the gear icon on the specific item block to access the settings. Here you can change the caption and the icon of the side menu item. You can also apply visibility rules to the menu item to decide who is going to see it.

You can add three different kinds of menu items to the side menu:

Expandable menu item - create a menu item that can have sub-items under it. Note that it is impossible to save an expandable menu item without a sub-item.

Object menu item – create a menu item that you can connect to a sub-object in Sweet. If you have created a new object type from the object manager, you can create a menu item for it. When a user clicks this menu item, you are navigated to the ‘create new dialogue’ for that sub-object.

Link - creates a menu item that navigates the user to a URL. The URL will be opened in a new tab in the browser.

See also

Currently, creating sub-objects are only available on company, case and deal.

Cus4

Editing customization - applying rules

We can decide who can see what and when in Sweet One by applying the rules to different elements

Example of using rules to a side menu item.

  1. Open the side menu editor by clicking the green icon in the menu’s left corner.
  2. Here, we will select the user menu.
  3. Click the gear icon on the menu item you want to apply rules for.
  4. You will see a button called rules at the top of the edit view. All elements which have this button can have rules applied to them. Click the button to open the rules editor.
  5. You can create a new rule by clicking the “Add new rule” button.
  6. Here, you can choose for which features the element should be visible/not visible. You can also set parameters such as required and read-only, which controls how input fields should behave.
  7. You can add conditions for the rule. This means that you can decide if the rule should be applied all the time or only in special cases. If no conditions are set, the rule will be used all the time
  8. Conditions are set by deciding which field and which value that field needs to have for the rule to be triggered. You can select more than one condition per rule.
  9. You can add more than one rule to any element. The rules have a priority order. The top rule will override the rules below.

admin5

Applying rules - example 1

Element not visible for anyone

The simplest example would be to just hide an element with a rule for all the users. The rule we see below is applied to All features (*), all users will be w affected by this rule. Next, we can see that the Visible checkbox is unchecked, which means that this element will be hidden for all users. Simply, this rule will hide the element for all the users.

image3

Applying rules - example 2

Element visible only for Case user

The example below presents two different rules applied to one menu item.

The first rule will apply to all users with the feature Case user. The rule states that the element should be visible for users with that feature.

The second rule will be applied for all features (*), and states that the element should be invisible.

Since the first rule will override the one below, the element will only be visible for users with feature Case users.

This way, you don’t need to create individual rules for all the features if you only want to show an element for the user with a specific feature.

admin6

Applying rules - example 3

Element visible only when Status=Prospect.

This example is similar to the one before.

However, instead of adding a specific feature for the first rule, we set a condition.

This condition states that if the status of a deal is Prospect, the element will be visible for all features.

If that deal has any other status, the element will not be shown.

image10

Editing customization - Object manager

Users can add new custom fields to any object in the system, thanks to the object manager. Moreover, new object types (sub-objects) can be created.

Navigate to the Object manager by clicking the gear icon in the top-bar when you are inside the customization-mode

Here you see a list of all the objects in Sweet One. Click on one of the objects from the list to open the object editor.

In the editor, you can add new fields to an object and create object sub-types based on that object (currently, this functionality is only available on the case, company and deal).

Sub-types:

A sub-type is a clone of the main object that you can make changes to. These changes may include adding other fields or reordering UI elements such as tabs and fields.

This functionality makes it possible to clone the properties of, for example, a case to create a new type of case with other fields, different tabs, etc.

admin8

Add new field

To add a new field, navigate to the object you want to add the field on from the object manager.

You see a list of all the fields connected to that object. You can edit the existing fields or create a new field by clicking the Add new field button.

You can add a caption and choose a field type. You can also select the following parameters to the field:

Can change state: makes the field available as a condition for rules.

Is code field: connects a code group to the field. Here you can create a new code group or connect an existing one.

Cus21

See also

When using functionality under Admin - Metadata - Codes, the changes to the codes are only applied for the customization you are currently administrating. This applies to: 1. activate/inactivate codes 2. caption change 3. state key change 4. order (sort index) change.

Add new object type (deal, case company)

To add a new object type, go to the object you want to make a sub-type for and click the object type tab.

Here you can see a list of existing object types. If you haven’t added any, it will be empty.

To add a new object, click the Add new type button. Here you can add the following:

Name – Select a name for the object type

The field and value inputs let you decide which field and value the main object needs to have in order to become the sub-type.

Field – Select which field the main object needs to have

Value – Select which value the main object needs to have

Key – Add a key to the object

Caption English

Caption Swedish

admin10

Sub-type example

In the example below, we see a new type of case called the Complaint case. With this created from the object manager, we can convert a regular case to our sub-type as soon as the Case type = Complaint. With our new sub-type, we go to a case, set the category to a complaint (case is converted to Complaint case) and edit the case card. The changes we make here will only affect the Complaint case. In this way, we can make the case look different as soon as the Type is Complaint.

image4

Editing customization - rearranging the UI

UI structure - you can easily rearrange the UI elements such as fields, tabs and other elements.

The UI is structured in a certain way. The elements that build up the UI are listed below.

Templates – Templates are highest in the hierarchy and make up a whole page

Blocks – Blocks are containers that can hold the elements below in the list but can also contain more blocks inside it (block in block)

Rows – Rows are inside the blocks and often contain one or more cells

Cells – Cells are lowest in the UI hierarchy and can be shown as input fields, checkboxes or buttons.

admin11

Example 1

Let’s say we want to rearrange the tabs on the company card.

  1. Go to any company
  2. Click the green gear icon in the right corner of the UI
  3. You will now see a list of blocks. These can be rearranged by using drag and drop functionality.
  4. Click the gear icon on the tab block
  5. You will see a list of all the tabs.
  6. Rearrange the tabs by dragging and dropping them.

Cus5

Example 2

Another example would be adding a field to the edit mode of a company.

  1. Go to any company and open the edit mode
  2. Click the green gear icon in the left corner of the UI
  3. You will now see a list of blocks. These can also be rearranged by using drag and drop functionality.
  4. Click the gear icon for Block.1
  5. Click ‘add new row’.
  6. Click ‘add new cell’.
  7. Give the cell a key and a caption and connect a field to it.
  8. Click on Add at the top of the slider

admin13

Example 3

Create a column-based layout

  1. Go to any company
  2. Click the green gear icon in the left corner of the UI
  3. You will now see a list of blocks.
  4. Reorder the blocks with drag and drop functionality in the following order: Action bar, Expandable menu, Tags, Carousel header, Tabs.
  5. Click the arrow icon on the Carousel header block.
  6. Change the width to 50%
  7. Click the arrow icon on the tabs block.
  8. Change the width to 50%
  9. Save

Cus9

Editing customization - selection manager

Edit selections - to edit a selection list, you can either go directly to the list and click the blue gear icon next to the list or go to the gear icon in the top bar and click Selection manager and choose the list you want to edit.

image5

General settings

The first tab in the selection list manager is the General tab. Here you can adjust some general settings for the list.

Use as API - this list will be available to use as a data source for Sweet Performance if you activate ‘Use as API’ functionality

Script - Here, you can change the ‘Row click’ script of the list. The default script will be to open the object. You can easily adjust which parameters to use in the script with the parameter field drop-down.

Cus10

Edit columns

The second tab in the selection list manager is the column tab (here, you can rearrange, remove or add columns).

Remove column: Click the bin icon in the column block. This column will be removed from the selection and not available for users. You can add it back with the Add column function.

Manage columns: Here, you can add more columns and/or remove the columns from the list. When adding a new column, a drop-down will show all the possible columns grouped by relations.

You can, for example, add related activities on a company or related cases on a private person as columns.

Rearrange columns: You can rearrange columns by using drag and drop functionality. The order of the columns in the settings will be reflected in the list.

In this example, a work order is the main object and in the drop-down you see available columns on related activities that you can add to the selection list.

Cus11

Edit filters

The third tab in the selection list manager is the filter tab. Here you can rearrange, remove or add filters.

Remove filter: Click the bin icon in the filter block. This filter will be removed from the selection and not available for users. You can add it back with the Add filter function.

Manage filters: here, you can add more filters and/or remove filters from the list. When adding a new filter, a drop-down will show all possible columns grouped by relations.

You can, for example, add related activities on a company or related cases on a private person as filters.

Rearrange filters: You can rearrange filters by using drag and drop functionality. The order of the filter in the settings will be reflected in the list.

In this example, the work order is the main object and in the drop-down, you see available filters on related activities that you can add to the selection list.

Cus12

Default sort order

The fourth tab in the selection list manager is the default sort order tab. Here you can set how the list should be sorted per default. Users can manually change the sort order, but the default order will always be set when the user resets the list.

By clicking the Add sort order button, you can add one or more columns to sort. The first column in the list will be the main sort order and the ones below will be sorted in prio order from top to bottom. You can click the arrow in the block to set if the column’s sorting should be ascending or descending. You can reorder the sort order by using drag and drop functionality.

Cus13

Editing customization - adding an external block

Add a new external block

To add a new external block, go to the interface where you want to add it (for example, case), click the green gear icon and click “Add new block”.

To add an external block, click the button with the globe icon (see image below). Give your new block a name and click ‘add’.

Click the gear icon on the external block to open the settings. Here you can choose between two types of external blocks.

Types of external blocks

HTML block - a block where you can enter HTML code.

URL block - a block where you can add a link to a webpage that will be visible inside an iframe. With this function, you can add links from Sweet Performance to view dashboards or reports directly in Sweet One.

Cus16

Cus17

Add a new HTML block

Choose type: HTML block in the Type drop-down. The parameter field and the HTML field will be visible. The parameter field lets you use data from Sweet and inject them into your HTML code.

In the HTML field, you enter the HTML code that should be visible inside the block.

Cus18

Add a new URL block

Choose type: URL block in the Type drop-down. The parameter field and a URL field will be visible. The parameter field lets you use data from Sweet and inject them into your

In the URL field, you can paste a link to a website page. The page is then visible inside an iframe in the external block.

Cus19

Parameter field

You can add parameters from Sweet One into URLs and scripts.

The parameter field can be found when you add custom scripts (like on buttons or selection list row click editor) or when you add an external block.

The parameter field drop-down lets you pick one or more fields connected to the current interface in Sweet. If you are on a company, the connected company fields will show. If you are on the start page, the connected user fields will show, etc.

When you have picked a parameter field in the drop-down, you can use it in your script or URL.

There are two ways to add the parameter field to a script or a URL.

Using name

Enter the field name inside two curly brackets: {Field name here}. The field name is the name displayed inside the brackets ( ) in the parameter drop-down.

Using numbers

Enter numbers from 0 and up, like this: {0}. {0} refer to the first parameter in the drop-down, {1} refer to the second parameter, and so on.

Cus20

Publish a customization

After creating new customization, you can set it as the default customization for the whole environment or publish it for certain user groups. You can at any time unpublish customization by removing the user groups or choosing another customization as the default one (if it was picked as the default customization for all other users).

Publish for user groups:

  1. While inside the edit mode, click the gear icon in the top bar and choose Publish settings
  2. Choose in the drop-dropdown below Publish for user groups which user group(s) you want to publish the customization for.
  3. Click the publish button – the customization is now available for users within those user groups.

Set default customization - if you want your customization to be the default one for all users (except for those connected to a user group that has another customization published for it), follow those steps:

  1. Navigate out of admin mode
  2. Click the gear icon in the top bar and choose “Existing customizations”.
  3. Here, you can set default customization for each user type in the drop-down lists. All users who do not belong to a user group with specific customization connected to a group will see this customization when they log into the system. “Vanilla” is the standard Sweet One configuration.

Cus22

Access published customizations as a user

If your user is in more than one user group connected to customization, you will be able to access those by clicking on the current customization name in the top bar.

You see a list of all the customizations available for your user. You can navigate to any of these by clicking the customization name.

admin15

The user who does not belong to a specific user group connected to particular customization has access only to the default customization. A customization administrator can decide which customization is the default one by clicking the gear icon in the top bar (while not in the edit mode) and clicking on “Existing customizations”. Here you can set the default customization from a drop-down.

admin16

Edit existing customization

You can access and edit all the existing customizations by clicking the gear icon in the top bar (while not in edit mode) and selecting Existing customizations. Here you will see a list of all current customizations. You can also set which customization you want to use as the default one. If another admin user is currently working inside customization, you will see a lock symbol in the locked status column. You won’t be able to access edit mode for those customizations before that user has closed the edit session. You can also remove the customization by clicking on the 3-dot menu on the row. You will get a confirmation if you want to remove it. If you press OK - the customization will be deleted.

Cus6