Viewing 9 posts - 1 through 9 (of 9 total)
  • Author
    Posts
  • July 28, 2025 at 9:13 pm #1487307
    icarogioiosi

    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 #1487316
    Ismael

    Hey 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,
    Ismael

    July 29, 2025 at 9:29 am #1487328
    icarogioiosi

    Thanks for the reply.
    Is it possible to at least have a homepage without a menu and possibly without a logo?
    Regards

    July 29, 2025 at 10:38 am #1487332
    Rikard

    Hi,

    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,
    Rikard

    July 29, 2025 at 4:46 pm #1487347
    icarogioiosi

    Thanks 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 #1487348
    icarogioiosi

    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)?
    I send you a private link as an example of what we would like to do

    July 30, 2025 at 5:50 am #1487366
    Ismael

    Hi,

    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,
    Ismael

    July 30, 2025 at 10:14 am #1487380
    icarogioiosi

    Hi 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 #1487386
    Guenni007

    well 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;
  }
}
  • Author
    Posts
Viewing 9 posts - 1 through 9 (of 9 total)
  • You must be logged in to reply to this topic.