Home>Support>Header image/logo

Header image/logo

Dear Siteorigin team,

Thank you for all your beautiful themes and great support so far. Much appreciated! I have been trying to place my logo on the top left corner on my Focus based website. However, when scaling the logo to menu, the logo becomes too small. On the other hand when not scaling it I am not being able to get on the similar lane with the menu while keeping it size. I happy with the current size of the logo, just the position could be better.
http://smartfilmproduction.com/

any advice?

cheers
Ondrej

URL: http://smartfilmproduction.com/

This is our free support forum. Replies can take several days. If you need fast email support, please purchase a SiteOrigin Premium license.

  1. 9 years, 6 months ago Daniel
    Hi, I Work Here

    Hi Ondra,

    Try the following custom CSS to move your logo more to the left:

    .container {
    width: 960px;
    margin: 0 10px!important;
    position: relative;
    }

    Please try and let me know! :)

  2. 9 years, 6 months ago Ondra Lodes

    Hello Addo,

    Thank you for your response. The CSS you suggested moves the whole website left. I am looking to move the logo only. Up and left.

    Thank you

  3. 9 years, 6 months ago Daniel
    Hi, I Work Here

    Hi Ondra,

    Sorry, that should have been:

     section.container {
    margin: 0!important;
    }
    #masthead .site-title{
    margin: 0!important;
    }

    Cheers!

  4. 9 years, 6 months ago Ondra Lodes

    Hello Addo,

    Thank you for this. That works great. The very last thing I need here is to move the logo up and down to put it on the same line as the menu?

    Thanks
    ondrej

  5. 9 years, 6 months ago James

    #masthead .site-title {
    height: 5px !important;
    }

    #masthead .site-navigation .menu-wrapper ul li a {
    height: 25px !important;
    }

  6. 9 years, 6 months ago Ondra Lodes

    Nope this doesn’t work. I tried variations while changing the height values for both but still not change to position of logo to menu.

  7. 9 years, 6 months ago James

    hi, i changed you .site-title to 5px and your menu aligned with the logo.

    at the moment you have this css set #masterhead .site-title: 50px !important: you may need to find where you have this already in your css as no other changes will have an impact / override an !important .

    this needs to be as below

    #masthead .site-title {
    height: 5px !important;
    }

  8. 9 years, 6 months ago Ondra Lodes

    Ok. Sorry I hope I am still following your advice. I have now set it to the values you suggested, but now the logo is partially sunk behind the slider…

  9. 9 years, 6 months ago James

    hi,

    ive just checked your site on mozila and the logo and menu align on opera, safari, google chrome browsers i can see the problem with the alignment.

    try this

    #masthead hgroup img {
    height: 70pxm !important;
    }

  10. 9 years, 6 months ago James

    #masthead hgroup img {
    height: 70px !important;
    }

  11. 9 years, 6 months ago Ondra Lodes

    Great job thank you! one more thing. If I decide to move the logo slightly left?

    many thanks for your expertise.

  12. 9 years, 6 months ago James

    hi,

    there is still size issue in safari browser.

    could you clear all the masterhead and menu changes in your custom css and where try alignment different way.

    #masthead .site-navigation .menu-wrapper {
    display: inline-block;
    padding-top: 25px;
    }

    #masthead .site-navigation .menu-wrapper ul li a {
    height: 31px !important;
    }

  13. 9 years, 6 months ago Daniel
    Hi, I Work Here

    Thanks for your assistance James!

  14. 9 years, 6 months ago Ondra Lodes

    Thanks gentleman. Great Job!

    regards

    Ondrej

Replies on this thread are closed. Please create a new thread if you have a question, or purchase a SiteOrigin Premium license if you need one-on-one email support.

Get The Most Out of SiteOrigin with SiteOrigin Premium

Find Out More