myDBR offers a wide variety of options to customize the look and feel of the application.
The Main Screen offers a starting point for report launching.
Customizable items include:
If you want to customize the report header and the footer, you can do it by changing the content of the user-directory. Files in the directory are:
interface/themes
user/reportheader.html
user/images/companylogo.png
user/defaults.php
user/userstyle.css
user/extension_init.php
The main view's top header (the dashboard) can include report content / single report elements like charts or any HTML / JavaScript you want. The content to be shown will be placed to the user/main_top.html file.
To include a full report to the dashboard, you can use a predefined embed_url-JavaScript call which will take the report URL as a parameter.
When a report is embedded, add &embed=2
to the URL so that only the report content is embedded.
<script type="text/javascript"> embed_url("http://myserver.com/mydbr/report.php?r=59&m=45&h=84410e9a181a9f93ca85b1a1811351c415f1be85&embed=2"); </script>
If you want to just include images, you can include them directly using img-tag Use getchart-parameter to choose which image to show. If the report just includes one image, use getchart=1.
<img src="report.php?r=496&u1=1&m=60&h=83e484f935d7b1d02d1fa07ca1b280a7ef9e1062&getchart=1" style="width:320px;height:150px;" alt="first" />
If you want to include different content in a different language, you can use the localization featured.
To do this, put #{DASHBOARD}
into the user/main_top.html, and define the desired content in the localization
at top banner.
You can include your own logo into PDF output by adding the following lines to the user/defaults.php
$mydbr_defaults['export']['pdf']['logo'] = 'filename.jpg'; // where filename.jpg is an image in user/images $mydbr_defaults['export']['pdf']['logo_width'] = xx; // where xx is the logo width in pixels
myDBR allows report customization with your own CSS. Options for CSS customization include:
myDBR offers UI customization with themes. A theme is a CSS definition that defines UI elements for all myDBR layouts. Creating a new CSS-file in interface/themes makes it available as a theme in the myDBR. To create a new theme, use the existing ones as a basis.
The file user/userstyle.css is used to define commonly used styles often shared with multiple reports. These can be result set, row, column, and etc. styles.
A report with reportID (r parameter in URL) has a DIV with classes "content report_519". "content" is shared with all reports, "report_XXX" class allows styling an individual report in userstyle.css.
OEM customization allows you to white label myDBR as your own solution. Branding allows you to add/replace myDBR logos/texts with your own.
The application logo, application name, visibility of the header, and the footer can be controlled from the Environmental settings. Additionally, with OEM license, many of the customizable objects have additional 'oem_*' classes so you can style them with CSS.
In addition to login notifications and userstyle.css, one can add HTML/JavaScript into the OEM login screen by modifying the
user/oem/login_bg.html
and google_login_bg.html
-files. The content of these files is inserted into div with class oem_login_bg
into the login screens.
You can customize the application's favicons by overriding the default icons defined in defaults.php $mydbr_defaults['oem']['favicons']
Definitions:
/* Create new link-headers */ $mydbr_defaults['oem']['favicons']['icons'] = array( array('type' => 'image/png', 'rel' => 'apple-touch-icon', 'href' => 'oem-touch-icon-iphone.png'), array('type' => 'image/png', 'rel' => 'apple-touch-icon', 'href' => 'oem-touch-icon-ipad.png', 'sizes' => '152x152'), array('type' => 'image/png', 'rel' => 'apple-touch-icon', 'href' => 'oem-touch-icon-ipad-retina.png', 'sizes' => '167x167'), array('type' => 'image/png', 'rel' => 'apple-touch-icon', 'href' => 'oem-touch-icon-iphone-retina.png', 'sizes' => '180x180'), array('type' => 'image/x-icon', 'rel' => 'shortcut icon', 'href' => 'oem-favicon.ico'), );Will create favicon headers like:
<link rel="apple-touch-icon" type="image/png" href="oem-touch-icon-iphone.png"> <link rel="apple-touch-icon" type="image/png" href="oem-touch-icon-ipad.png" sizes="152x152"> <link rel="apple-touch-icon" type="image/png" href="oem-touch-icon-ipad-retina.png" sizes="167x167"> <link rel="apple-touch-icon" type="image/png" href="oem-touch-icon-iphone-retina.png" sizes="180x180"> <link rel="shortcut icon" type="image/x-icon" href="oem-favicon.ico">