# Customizing Getting Started Content

The Getting Started tab is displayed as a user enters Exago. This tab can be customized by loading custom html. This is done by modifying the language element ‘GettingStartedContent’ in the file ‘en-us-getting-started.xml’. To assist in customizing the Getting Started tab, Exago provides several JavaScript functions to open the New Report Wizard, execute reports, open other custom tabs and display reports as dashboards.

The example below demonstrates a custom tab with links to the New Report Wizard and Dashboards.

> NOTE. It is recommended to make custom tabs in a separate language file to make it easy to change tabs by user or groups of users. See Modifying Select Language Elements.

# Creating Additional Custom Tabs

Addition custom tabs can be created by creating a language elements with a unique name containing the html content. Custom tabs can be opened with the JavaScript function wrAddTabbedContent (see Available JavaScript Functions).

This example demonstrates a custom tab that has buttons to launch a report in different formats.

    <element id="QuickReportsTab">
     <button value="HTML" onclick="wrExecuteReport('My Reports\\Revenue', 'html');" />
     <button value="EXCEL" onclick="wrExecuteReport('My Reports\\Revenue', 'excel');" />
     <button value="PDF" onclick="wrExecuteReport('My Reports\\Revenue', 'pdf');" />
     <button value="RTF" onclick="wrExecuteReport('My Reports\\Revenue', 'rtf');" />
     <button value="CSV" onclick="wrExecuteReport('My Reports\\Revenue', 'csv');" />
    </element>

# Available JavaScript Functions

To assist with the creation of custom tab content, Exago provides a small number of JavaScript functions to allow custom html to call features of Exago.

void wrStartNewReportWizard([string reportType])

Description | Opens the New Report wizard in a new tab. Optionally, specify which wizard to open. Possible values for reportType: advanced express expressview dashboard chained
Example | Ex. Click <span style="text-decoration:underline; cursor:pointer;" onclick="wrStartNewReportWizard();">here</span> to create a new report.

void wrStartDuplicateReportDialog(string reportFolder\\reportName):

Description | Opens the Duplicate Report dialog.
Remark | If the report name is null or blank Exago will use the report selected in the Main Menu.
Example | Ex. Click <span style="text-decoration:underline; cursor:pointer;" onclick=" wrStartDuplicateReportDialog();">here</span> to create a duplicate this report.

void wrExecuteReport(string reportFolder\\reportName, string format)

Description | Executes the specified report in the specified format.
Example | Ex. <input type="button" class="Button" value="HTML" onclick="wrExecuteReport('Sales Reports\\Revenue by Category','html')

string wrGetSelectedReportName()

Description | Returns the name of the report that is selected in the Main Menu.
Remark | The returned string will include the folder structure of the report separated by slashes.

void wrAddTabbedContent(string ContentID, string TabName)

Description | Opens a new tab and loads the html stored in the element of the Language file that corresponds to the Content ID.
Remark | The ContentID should match the element ID of the html you want to load. The TabName can match the element ID of the name you want the tab to display, or a custom string with the name of the tab.

data-onloadreportname= “ReportFolder\\ReportName”

Description | Executes a report as HTML and loads it into a div or iframe.
Remark | The report string should be formatted as "Report Folder\\Report Name." NOTE. When using this function make sure the setting Enable Debugging in Other settings is False.
Example | Ex. <div class="Report" data-onloadreportname="Employee Reports\\Number of Sales by Employee"></div>

data-useviewer ="True/False"

Description | Specifies to load a report as raw html or utilize Exago dynamic report viewer.
Remark | Default value is True. In cases where the dynamic capabilities of the Exago viewer is not need set to False to load raw html.
Example | Ex. <div class="Report" data-onloadreportname="Employee Reports\\Number of Sales by Employee" data-useviewer= “False”></div>

data-enablescrolling ="True/False"

Description | Specifies whether or not to show scroll bars.
Remark | Default value is True. This can helpful for certain reports that may not fit exactly within the startup content.
Example | Ex. <div class="Report" data-onloadreportname="Employee Reports\\Number of Sales by Employee" data-enablescrolling= “False”></div>

data-reloadinterval="n"

Description | Reloads a report every n seconds.
Remark | This function is used in conjunction with data-onloadreportname.
Example | Ex. <div class="Report" data-onloadreportname="Employee Reports\\Number of Sales by Employee" data-reloadinterval="2"></div>

data-allowexport="0/1"

Description | Specifies wether or not to show the re-export menu for the report.
Remark | The default value is 0 (does not show the menu). Set to 1 to have the re-export options display.
Example | Ex. <div class="Report" data-onloadreportname="Employee Reports\\Number of Sales by Employee" data-reloadinterval="1"></div>