
-
AuthorPosts
-
July 28, 2025 at 9:13 pm #1487307
For the site’s homepage, we’d like the “burger” icon on the left and the logo on the right, preferably in the center (https://img.savvyify.com/image/01-Homepage.y9tpL).
For all other pages, we’d like the sidebar menu on the left (https://img.savvyify.com/image/02-All-pages.yy86x).
As you can see from the images, we can obviously do this in the theme settings, but one excludes the other.
So, either only at the top or only on the left.
Is there a way to achieve the result we want?
And when using the “burger” icon, is it possible to open the menu on the left instead of the right (https://img.savvyify.com/image/01-Homepage-b.yy905)?July 29, 2025 at 6:13 am #1487316Hey icarogioiosi,
Thank you for the inquiry.
This is possible but it will require significant modifications that are beyond the scope of support. You may need to hire a freelance developer or contact Codeable.
-— https://kriesi.at/contact/customization
You’ll find the css rules for the left header in the themes/enfold/css/layout.css file around line 632.
/*sidebar headers*/ .html_header_sidebar{} .... more styles
Best regards,
IsmaelJuly 29, 2025 at 9:29 am #1487328Thanks for the reply.
Is it possible to at least have a homepage without a menu and possibly without a logo?
RegardsJuly 29, 2025 at 10:38 am #1487332Hi,
Thanks for the update. You can hide the header for each page if you like, you can find the settings in the Layout menu while editing the page in question.
Best regards,
RikardJuly 29, 2025 at 4:46 pm #1487347Thanks for your time.
I’ve tried, but those settings are only available for layouts with a main menu placed at the top.
As anticipated at the beginning, for all other pages we’d like the sidebar menu on the left.July 29, 2025 at 4:58 pm #1487348And when using the “burger” icon, is it possible to open the menu on the left instead of the right (https://img.savvyify.com/image/01-Homepage-b.yy905)?
I send you a private link as an example of what we would like to doJuly 30, 2025 at 5:50 am #1487366Hi,
Thank you for the update.
You can add this css code to reverse the burger menu animation from left to right.
.html_av-overlay-side .av-burger-overlay-scroll { width: 500px; transform: translateX(-500px); left: 0; right: auto; }
For the home page, you can try this css code to completely hide the header.
.home #header display: none; }
Best regards,
IsmaelJuly 30, 2025 at 10:14 am #1487380Hi Ismael.
Thanks for your input.
I did a quick check, and the burger menu code seems to resolve the issue.
Regarding the “CSS code to completely hide the header”… it doesn’t seem to work with either the left menu (which is what we’d like to use) or the top menu/header.July 30, 2025 at 11:23 am #1487386well you got a page like this for your layout: https://kriesi.at/themes/enfold-photography/
try:
@media only screen and (max-width:767px) { #top .av-logo-container .inner-container { display: grid !important; grid-template-columns: 1fr 1fr; grid-template-areas: "nav logo"; } #top .av-logo-container:after, #top .av-logo-container .av-sidebar-social-container { background-color: gray; } .responsive #top #header .logo { grid-area: logo; width: unset !important; justify-self: end; } .responsive #top #wrap_all .main_menu { grid-area: nav; justify-self: start; width: unset !important; left: 0; right: unset; position: relative; } } /* === change the width values to your needs f.e. 500px instead of 350px === */ /* === burger slide-out from the leftside === */ .av-burger-overlay-scroll { width: 350px; left: -350px; max-width: 100%; transition: all 0.5s cubic-bezier(0.75,0,0.25,1); } .html_av-overlay-side .av-burger-overlay-scroll { left: 0; max-width: 100%; transform: translateX(-350px); transition: all 0.5s cubic-bezier(0.75,0,0.25,1); } /* === hide header on home page === */ @media only screen and (min-width:768px) { .html_header_sidebar #top.home #header { display: none !important; } .html_header_left #top.home #main { margin-left: -2px !important; /* === to ensure there aren't any white flashes on the left === */ position: relative; } }
July 31, 2025 at 5:53 am #1487408Hi,
the top menu/header.
We may need to view the site and inspect the elements. Please provide the site URL in the private field.
Best regards,
IsmaelJuly 31, 2025 at 8:21 am #1487409ok – if you like to have on default a sidebar header – and on homepage only the header top position.
( for that scenario we need than a bit different css too if you like to have slide-out from left to right)1 set your enfold child to header top and make all your decisions you like to have for that header ( height, logo left or right, navigation position, shrink or not, etc pp )
2 Go to your homepage editor and make your decision there – f.e. if it should have transparency etc.
3 Look now to your homepage with dev tools of your browser. Note your ID of that page and look what classes are set on #header
e.g.: ( all_colors header_color light_bg_color av_header_top av_logo_right av_main_nav_header av_menu_left av_custom av_header_sticky av_header_shrinking av_header_stretch av_mobile_menu_tablet av_header_searchicon av_header_unstick_top_disabled av_bottom_nav_disabled av_header_border_disabled )4 now switch back to your header left position.
put this to your child-theme functions.php:
(remove options you do not need – or replace – f.e. header_size and header_custom_size and replace by header_size: ‘slim’ / or large )
you can find those corresponding header settings in : avia_header.phpfunction av_change_header_style($header){ if(is_page(array( 17, 123456))){ $header['header_position'] = "header_top"; $header['header_layout'] = 'logo_right main_nav_header menu_left'; $header['header_size'] = 'custom'; $header['header_custom_size'] = 140; $header['header_shrinking'] = 'header_shrinking'; $header['header_sticky'] = 'header_sticky'; $header['header_unstick_top'] = 'header_unstick_top'; $header['header_stretch'] = 'header_stretch'; $header['header_transparency'] = 'header_transparency header_glassy'; $header['header_class'] = " all_colors header_color light_bg_color av_header_top av_logo_right av_main_nav_header av_menu_left av_custom av_header_sticky av_header_shrinking av_header_stretch av_mobile_menu_tablet av_header_searchicon av_header_unstick_top_disabled av_bottom_nav_disabled av_header_border_disabled"; } return $header; } add_filter('avf_header_setting_filter','av_change_header_style');
here in this example there are two pages (ID’s) replaced with that different layout – adjust to your home page ID
this filter has a lot more options. Enter on$header['header_class']
your noted classes from point 3.see example page: https://clean.webers-testseite.de/
August 2, 2025 at 3:41 pm #1487499Thanks Guenni007!
Your suggestion with the code to hide the left bar was crucial./* === hide header on home page === */
@media only screen and (min-width:768px) {
.html_header_sidebar #top.home #header {
display: none !important;
}.html_header_left #top.home #main {
margin-left: -2px !important; /* === to ensure there aren’t any white flashes on the left === */
position: relative;
}
}Is it possible to apply this somehow to the maintenance page as well?
Furthermore, your example page (https://clean.webers-testseite.de/) is more or less what we’d like to achieve.
We’re testing the code you kindly provided to find the best possible solution.
I congratulate you for accurately understanding our request and identifying such effective solutions.August 13, 2025 at 12:00 am #1487939check what page-id is your maintenance page include that ID to the conditional tag above
if(is_page(array( 17, 123456))){
or is it one you created with a plugin? -
AuthorPosts
- You must be logged in to reply to this topic.