HUB - Creating Fullscreen Menu

Adding a fullscreen menu is really simple. You just need a trigger to show/hide the menu and a wrapper to put your content inside. Let's see how.

1. To get started, let's add the trigger first.

And change the settings and stylings as you want

2. Now you need the wrapper for your content. To do this, simply add a row, and from its options, enable Fullscreen Navigation option.

Under Fullscreen Navigation you can find the options for navigation background and lines color ( Point 3 ).

Now, Let's add menu, social icons and some text. But before adding content, there are some things that you need to remember.

Let's say we want a menu like this

  • Top columns inside fullscreen navigation won't work as they work in regular rows. For example, the bottom layout will not result what you expect.

In the screenshot you see all the content are in top level columns. That won't result what we're looking for.

  • To solve this problem, we need to add our content we want at the bottom, inside an inner row. So, to do that, let's add a row inside a column.
  • So, if you need your content to be in split columns, simply add them in inner rows.

3. Now, inside this inner row, you can have your content in any structure. We will make 2 columns here and move social links to the left, and the text to the right. Please remember you can change the column sizes, or the row structure from here

4. And at the end, add your content right there. The final structure will be like this