--- title: How to install and configure Dashboard Builder description: "## How to install and configure Dashboard Builder This comprehensive document provides a step-by-step guide on installing Dashboard Builder on your server, empowering you to set up your data visualization platform effortlessly. Additionally, the document offers detailed instructions on creating…" url: "https://dashboardbuilder.net/how-to-install-and-configure-dashboard-builder" updated: "2026-10-19" category: Getting started --- # How to install and configure Dashboard Builder ## How to install and configure Dashboard Builder This comprehensive document provides a step-by-step guide on installing Dashboard Builder on your server, empowering you to set up your data visualization platform effortlessly. Additionally, the document offers detailed instructions on creating charts, establishing database connections, retrieving data from various source like Excel, JSON and Google Sheets, and generating source code. Explore the full potential of Dashboard Builder with ease using this comprehensive resource. ### Contents ## Frequently asked questions What are the requirements for Dashboard Builder? #### Requirements - PHP Version 7.1 or later - Apache 2 or later, Nginx or any other server that supports PHP. - Windows 7 or later /Linux 3 or later/Ubuntu or any other platforms support Apache, Nginx etc - Firefox 52, Chrome 57, IE 8, or any other browser that supports SVG - **allow_url_fopen** is enable e.g `allow_url_fopen = On` in php.ini - **SimpleXML** extension is installed and enabled - **OpenSSL** extension is installed and enabled - PDO drivers such as MySQL and SQLite are installed - Read-Write permission to folders and sub-folders of dashboardbuilder i.e `chmod -R 774 dashbboardbuilder-v3-FREE` How to install Dashbaord Builder? #### Installation - Download from [https://dashboardbuilder.net](/) - Place the file in a directory on the web server. e.g. “…/www/dashboardbuilder/” - Unzip ![](/images/zipfile.png)the file using Extract Here option to the root folder of "dashboardbuilder" Getting started? #### Create your first Dashboard - Access the web folder in your browser. e.g. [http://localhost/dashboarduiler](#) following welcome screen will appear ![Getting Started](/images/dbbpic/1.png) How to connect to a database? #### Select the database as data source: Click the database icon ![PHP Dashboard welcome screen](/images/php-dashboard-screen1.png) **Now,**select the database from the data source settings.. ![Select Database as Data Source](/images/dbbpic/4.png) Enter your host name, username, password and database name as mentioned in the screen ![Select Database as Data Source](/images/dbbpic/4-0.png)How to use XLS or CSV file as data? Click the database icon ![Select Database as Data Source](/images/php-dashboard-screen1.png) Now, select upload from the data source settings. XLSX, XLS or CSV can also be used as data source ![Select Database as Data Source](/images/dbbpic/4-1.png)How to connect to Google Sheets and fetch data with Dashboard Builder? #### Publish to the web Before going to the next step, make sure that your Google sheet is published to the web: **Step-1:**Go to your **My Driver** folder and right click on the spreadsheet you want to access. Click File and click "Publish to the web" . ![Publish to the web](/images/google-drive-screen1.png) **Step-2:** Select your desired Sheet and "Comma-separated values (csv)" from the dropdown. ![Publish to the web screen2](/images/google-drive-screen2.png) Hit the publish button. **Step-3:**Copy the link on the following screen. ![Publish to the web screen3](/images/google-drive-screen3.png) #### Connecting Google Shee with the Dashboard Builder **Step-1:**Click the Database icon ![PHP Dashboard welcome screen](/images/php-dashboard-screen1.png) **Step-2:**Now, paste the link of your Google sheet. ![Publish to the web screen4](/images/google-drive-screen4.png) How to connect and retrieve data from a JSON file? Click the Database icon In the data source setting, click the File Tab and enter the full URL address of your JSON file and hit the Save button ![Connect and retrieve data from a JSON](/images/Json-connectivity.png) How to select a Chart Type and Insert Data? Select the gear icon for your Chart preference. The following screen will appear ![Chart Setting](/images/php-dashboard-screen8b.png) #### SQL statement format Enter your SQL statement in SQL field `SELECT sum(salary) as xaxis, DATE_FORMAT(from_date, '%Y/%m') as yaxis FROM salaries GROUP BY DATE_FORMAT(from_date, '%Y/%m') LIMIT 10` Select your Trace data for X as 'xaxis' and data for Y as 'yaxis' as mentioned above. Click the SQL   sign if you want to add more SQL statement Select your desired table and click  Run Query   button ![SQL statement](/images/dbbpic/6.png) Select your Chart Type, Trace and its Properties. ![SQL statement](/images/dbbpic/6-1.png) ![Chart Setting](/images/dbbpic/6-2.png) Click  Save Changes   when you finish How to Preview? ### Preview: In the main screen, click  Save Changes  , Charts will be appeared on the screen as shown below. ![Chart Setting](/images/dbbpic/7.png) How to Adjust the size and postion of chart? ### Adjust size and position: To adjust the size and position of your Chart Panel by dragging it's corner ![Chart Preference](/images/php-dashboard-screen9b2.gif) How to Save your data? #### Save Data: Click Save   button. The following screen will appear. Give a name to your file and click Save button. ![Chart Preference](/images/dbbpic/8-3.png) How to Open a New Dashboard? #### New Dashboard Click New  button. The following screen will appear. Now click Yes. ![Chart Preference](/images/dbbpic/8-2.png) How to Open an Existing Dashboard? #### Open an Existing Dashboard Click Open   button. The foloowing screen will appear. Select your file from the given list ![Open an Existing Datashboard](/images/dbbpic/8-1.png) How to generate a PHP code? #### Generate a PHP Code Click Generate  button The following screen will appear with PHP code ![Generate PHP source code](/images/dbbpic/9.png) Click the Copy+Paste button to copy the code and paste it into your PHP application You also need to copy the required API file/folder i.e 'inc/dashboard_dist.php' and 'assets/js/dashboard.min.js' to the folder where your application is running. How add dropdown filter to a chart? #### Add a dropdown filter to a chart *This feature is availalbe in **3.8** or later version of Dashboard Builder* **Step -1 : Add a new Trace** ![Step 1 - Add a dropdown filter](/images/drop_down_menu_step1.jpg) **Step -2 : Select your chart type and data for X and Y axis for Trace 2** ![Step 2 - Add a dropdown filter](/images/drop_down_menu_step2.jpg) **Step -3 : Click “Show” button** ![Step 3 - Add a dropdown filter](/images/drop_down_menu_step3.jpg) **Drop down filter will appear** ![Step 4 - Add a dropdown filter](/images/drop_down_menu_step4.jpg) --- ## Need a hand? Tell us what you’re stuck on and we’ll help you finish the setup. [Contact support](https://dashboardbuilder.net/support)