Author: Ian Britz
Before we can finish up our Dashboard, let's configure a few more things. First, we'll configure the Header and menu options, then add some filters to the Dashboard. After that, we'll create an Action button to update our data, and stylize our Dashboard with an icon.
Step 1. Let's navigate to the HEADER tab in the Dashboard Editor. Our header is looking a bit cramped, so let's change the height in the bottom-left, and drag the menu component's height down to match. You can also use the Top, Left, and Size options in the bottom-right to define dimensions for the component more accurately.
Step 2. To style the navigation menu, first change the Mode from Published to Selected. This is what the menu nodes will look like when they're selected.
Step 3. Likewise, when the Mode is set to Unselected, you can style what the menu nodes look like when they're not selected. In my header, I'm also going to change the background color of the header to match, using the Background option in the ribbon at the top of the page.
Step 4. Now let's also add an image to create a stronger sense of branding. Right-click the header and select Add Image.
Step 5. Click on the image icon at the top-left of the component, and upload an image.
Step 6. Here's my completed header design:
Step 7. On the right-side of the header, we can also style the action bar.
Step 8. Navigate to the PREVIEW tab to see how everything looks together.
Step 1. Now let's add our Filters to the Dashboard, so we can switch between different Scenario contexts, or Fiscal Years. In the DASHBOARD tab, right-click in the editor window and select Add Filter.
Step 2. Select the Revenue & Cost Form for the Form and Scenario for the Filter.
Step 3. Add a Fiscal Year Filter in the same way.
Step 4. For both Filters, select the settings icon and open the BASIC LINK tab. This allows us to link the Filter selection to other Forms. By selecting all the Forms, our Filters will now act as 'Master Filters' and change the context of every Form in the Dashboard.
Step 5. We can then style Filters in the same way as other components, to create a more cohesive theme. Don't worry about adding Filters to any other pages just yet, we'll look at an option to do that easily in the next section.
Step 1. In order to submit data from the Dashboard to the server, we need to use a Workflow Action called Post. Let's create a text component that will act as a button to trigger the Post Action. Title it Update.
Note: All Workflow Actions are also available from the Action drop-down on the right side of the header.
Step 2. Click on the settings icon and change the Type to Action, and then select Post. Now when someone clicks on this Text Component, it will post our entered data to the database.
Step 3. Let's also right-click the two filters and the action button and select Make Global. This will share the components across all pages in the Dashboard.
Step 4. Lastly, in the SETTINGS tab, we can add an image that will be displayed as the icon for our Dashboard App in the APPS page.
Step 5. Here is the final result:
Now that our Dashboard is finished, we'll need to configure a few additional permissions and administrative settings before we can start using it.