Dashboard help

Bootstrap Studio Help
1

Hello everybody, I bought Bootstrap Studio yesterday, went through the tutorials but I cannot manage to create a layout page for a live dashboard.

What I would like to achieve is: 1) Fix navigation bar on top, logo on left and a drop down with 2 items on the right (Edit mode, View Mode) 2) Then I need 2 menu, one all the way to the left, and one all the way to the right<br /> a. When I click on Edit Mode I want to display only Menu 1. b. When I click on View Mode I want to display only Menu 2. 3) A content area where I can place a div gridstackJS

Menu 1 and 2 should not overlap the content div, I just want that it push the content area on the side. I will use Menu 1 to place a second gridstack where user can drag and drop cards in the main content, and menu 2 to place same labels and charts.

Layout

For now I managed to place a navigation bar on top but if i try to add a side menu or anything else it will be placed on top of my navigation bar. How can I achieve this? Thank you!

2

First thing I would suggest is make sure you understand the workings of the HTML and CSS code involved. The forums here are helpful mostly for things to do with the app itself. If you are not sure how to structure a website, you might be better off hiring someone to do this for you. There are a lot of tutorials on the web so there's no lack of resources to learn, but you do need to have a good understanding of how things need to be structured in order to use this app.

3

My knowledge on HTML and CSS are pretty basic, and almost zero on bootstrap, I though it would be easier to create the structure using this tool.

Could you suggest at least how many div's I need to achieve this?

4

There's more to all of this than just a number of divs. This tool isn't a drag and drop and not need knowledge of coding tool I'm afraid. In order to really know how to use this tool you will need to have some base knowlege of HTML, CSS and of course Bootstrap. If you're looking for something that is fully drag and drop without any coding needed you'll need to find another app.

5

The reasons for using a Framework like Bootstrap is it handles all the responsiveness and breakpoints, so it IS easier to create the structure of a responsive website. Rather than placing everything in divs, you use Bootstrap containers, rows and columns so your layout adapts gracefully to different screen sizes. If you're going to build your site in Bootstrap Studio, you really need to learn Bootstrap to use the program effectively. While technically you could build a layout with generic divs, it kind of defeats the whole purpose of using Bootstrap.

To build a layout like this, you will need to write some javascript to show/hide your menus. There is probably more than one way to build a layout like this, and I'd imagine different people would take different approaches. Here's an example... http://thelightwavegroup.com/example/example.html

Not to sound unhelpful, but this forum is geared towards help with using the Bootstrap Studio program, not help with building websites. Most of us here make our livings doing just the sort of work you are asking for help with.