Viewing 8 replies - 1 through 8 (of 8 total)
  • Thread Starter charwa

    (@charwa)

    @bensibley any update on this please?

    Theme Author Ben Sibley

    (@bensibley)

    Hey sorry I missed this!

    I’m afraid there isn’t a way to add more content to this part of the site. The closed widget area is the “Below Header” one which will display below the primary menu. You could use a wider logo image, but only one image can be uploaded at this time. Using a shorter logo would limit the height of the header and reduce space. I haven’t seen your site, but I can say that the header will also look more balanced if the social media icons and also the secondary menu are both used (or at least the search bar).

    Thread Starter charwa

    (@charwa)

    @bensibley thanks for your reply, this is the webiste https://turizmpress.com
    actually used social media and secondary menu but as you see the right side is very empty. Even I remove the secondary menyu, social media icons are alligned with logo. Appreciate your help to sort it out.
    Header screenshot: https://prnt.sc/s97q7r

    • This reply was modified 3 years, 11 months ago by charwa.
    Theme Author Ben Sibley

    (@bensibley)

    Thanks for the link!

    I’ve got two ideas you could try out. First, you could allow the primary menu to sit next to the logo by adding this CSS:

    @media all and (min-width: 800px) {
    
      .title-container {
        float: left;
      }
      .menu-primary-container {
        margin-top: 48px;
      }
    }

    That CSS can be copied & pasted into the “Additional CSS” section in the Customizer (Appearance > Customize), and it will take effect right away.

    Or, you could remove the logo and tagline completely and instead put the logo into an Image widget in the left sidebar. This code would leave the logo visible on mobile devices and hide it on larger screens:

    @media all and (min-width: 800px) {
    
      .title-container {
        display: none;
      }
      .menu-primary-container {
        margin-top: 24px;
      }
    }

    This would make the header way shorter and use up all the space while the logo is still near the top of the site in the sidebar.

    Thread Starter charwa

    (@charwa)

    @bensibley first solution seems great thanks. One more question regarding the footer padding and margin. Is there any way to change the distance between footer text and menu? (screenshot: https://prnt.sc/s996qa)

    In general if you could publish all css variations would be great so that people like me don’t bother you 🙂

    • This reply was modified 3 years, 11 months ago by charwa.
    Theme Author Ben Sibley

    (@bensibley)

    Great! Glad you’re happy with that.

    I see you already have some negative margin on the footer pulling things downwards, so I would remove that first, and then add the following CSS:

    .menu-footer-container {
      margin: 0;
    }
    .site-footer-widgets {
      margin: 0;
    }
    .site-footer .design-credit {
      margin: 0;
    }

    Then if you decide you want more space then the easiest way is to add margin above and below the widget area since it is in the middle. You would update it like this:

    .menu-footer-container {
      margin: 0;
    }
    .site-footer-widgets {
      margin: 24px 0;
    }
    .site-footer .design-credit {
      margin: 0;
    }
    Thread Starter charwa

    (@charwa)

    Appreciate your great support @bensibley

    Theme Author Ben Sibley

    (@bensibley)

    Sure thing! Glad I could help 🙂

Viewing 8 replies - 1 through 8 (of 8 total)
  • The topic ‘Header logo’ is closed to new replies.