Page Builder - Forum | JoomShaper
Solved Helix Framework

Page Builder

Asked by Aslam Ahamed 3 years ago Last activity 3 years ago

Accepted answer

Marked as the solution
Rashida Rahman Staff
3 years ago

Hi Aslam Ahamed,

Did you try Pavel's custom CSS, please? I have checked and it works.

However, you can use the following code in your custom CSS either: 

body.ltr.offcanvs-position-right.offcanvas-active .body-wrapper {
    right: 0;
}

Note: Path towards custom CSS(Joomla 3): Extensions>Templates>Styles> Click on your current default template name then choose Template Options. Then find custom CSS within the custom code

Best Regards

10 more replies

Oldest first Newest first Most helpful
Paul Frankowski Senior Staff
3 years ago

Hi Aslam,

Using Menu module settings you can choose which menu will be displayed inside Offcanvas menu.
It doesn't have to be "MainMenu" you can choose different one from list.

info_781_2023.png

Aslam Ahamed Asked this
3 years ago

Hi Paul,

I want the menu Over the screen.

Thanks

Paul Frankowski Senior Staff
3 years ago

?? I still don't understand what is wrong

Please make a mock-up and share link to it. Otherwise we stuck.

Aslam Ahamed Asked this
3 years ago

EVERYTHING LOOKS OK. plEASE SEE THE SCREENSHOT I HAVE SHARED.

the menu push the screen to the left. I dont want that. i want the menu to be top of the screen

thanks

Paul Frankowski Senior Staff
3 years ago · edited

info_785_2023.jpg

If you want to move Offcanvas menu somewhere else (left, middle), you have to use Custom CSS, if current settings has too little feature for what you need.

Paul Frankowski Senior Staff
3 years ago · edited

But If you want to reduce that top space from 80px to 40px

info_785_2023.jpg

use custom CSS, for example:

.offcanvas-menu .offcanvas-inner {
  padding-top: 40px !important; }

There is an old saying, that one good image is worth 100 words, are you agree?

Pavel
3 years ago · edited

Hi. In latest raw Helix Ultimate template it works just as you want - offcanvas menu is over the body ("screen") + blure for content.

If you use raw Helix Ultimate, just update it.

For other HU based templates try this code

.body-wrapper {
    inset: 0 !important;
}
Aslam Ahamed Asked this
3 years ago

Thanks Rashida . You Are savior it worked <3

Rashida Rahman Staff
3 years ago

Glad to know that and you are always welcome:)

Log in to reply.