-
Hello @Stardreamer !
You may apply smth like this in the Custom Styles area of your template:
position: fixed;
}
-
It seems you'd better add the code to my previous answer like:
<style>
display: none;
}
position: fixed;
}
</style>
and create the RAW block with this
#special_block id where you will place your sticky content. -
Hello @Karina Budhrani !
You may remove the header with CSS ways and place there the sticky block via the Pages app. Also,you may create the RAW block, make it visible only for the guests and place there the CSS code, which will hide the header area. Smth like:
<style>
#bx-toolbar {display: none;
}
</style>
-
It has been fixed, it looks like you have some custom styles which overwrite mobile CSS styles, I've added the following CSS rules in Nexus app to fix it:
html
#bx-toolbar-content { display:none !important; } html .cd-side-nav, html .bx-sliding-menu, .bx-sliding-menu-main { top:0 !important; } -
i'm having a problem centering my navigation menu. I added the below to custom styles in my Lucid theme and it did seem to help with Chrome browser but not Edge or Fire fox. any suggestions? Would the fix be a little different to center the menu than what I have here?
#bx-sliding-menu-sys_site.bx-sliding-smenu-main ul.bx-menu-object-sys_site {
-webkit-justify-content: center;
justify-content: center;
} -
Hello BIG Marketing Solutions LLC !
It is possible to do in the Studio->Pages->[proper module]->[proper page]. Add there the RAW block, place it at the end of the page and fill it with the Javascript / JQuery code to delete the block with
#bx-menu-main-container CSS class. It will look like:<script>
$('
#bx-menu-main-container ').remove();</script>
-
-
UPDATE: the deal was in those default style lines:
.bx-db-menu ul>li:not(.bx-menu-item-more-auto) a .sys-icon {- display: none;
- }
It's possible to enable it via the Custom Styles area within the proper block like:
#bx-page-block-2095 .bx-db-menu ul>li:not(.bx-menu-item-more-auto) a .sys-icon {- display: block;
- }
-
Hello Jake Arsenault !
You may add the following styles to the Custom Styles area of your template in the Studio
#bx-sliding-menu-sys_site.bx-sliding-smenu-main ul.bx-menu-object-sys_site {-webkit-justify-content: center;
justify-content: center;
}
-
Hello caribman2020 !
You may show this menu by the load with the following JS script in your Studio->Deisgner->Injections->Header area:
<script>
$(document).ready(function () {
bx_menu_slide_inline('
#bx-sliding-menu-sys_site', $('#bx-menu-toolbar-item-main-menu'), 'site');});
</script>
Or you need to place the block with the necessary menu in every page (Studio->Pages->Systme->[Page name]->Add Block->Skeleton->Menu->Choose menu).
But both variants aren't good and it's better to use another template.
Hello @Stardreamer !
You may apply smth like this in the Custom Styles area of your template:
position: fixed;
}
It seems you'd better add the code to my previous answer like:
<style>
display: none;
}
position: fixed;
}
</style>
and create the RAW block with this #special_block id where you will place your sticky content.
Hello @Karina Budhrani !
You may remove the header with CSS ways and place there the sticky block via the Pages app. Also,you may create the RAW block, make it visible only for the guests and place there the CSS code, which will hide the header area. Smth like:
<style>
#bx-toolbar {
display: none;
}
</style>
It has been fixed, it looks like you have some custom styles which overwrite mobile CSS styles, I've added the following CSS rules in Nexus app to fix it:
html#bx-toolbar-content { display:none !important; } html .cd-side-nav, html .bx-sliding-menu, .bx-sliding-menu-main { top:0 !important; }
i'm having a problem centering my navigation menu. I added the below to custom styles in my Lucid theme and it did seem to help with Chrome browser but not Edge or Fire fox. any suggestions? Would the fix be a little different to center the menu than what I have here?
#bx-sliding-menu-sys_site.bx-sliding-smenu-main ul.bx-menu-object-sys_site {
-webkit-justify-content: center;
justify-content: center;
}