Set an image by link, as a logo, in the center of the home, below the bar

  • Author
    Posts
  • #136952

    After sticking logo and search bar, I would like to set the middle of the home (at the top, below the horizontal red bar) … a title extrapolated from a link image. I used this your code, but it does not work. No image comes out.

    .masthead .site-logo-link {
    display: block;
    background: url(‘https://image.ibb.co/kQ3pn0/logo-nuovo1.png’) no-repeat center center;
    width: 100%;
    height: 100px;
    background-size: contain;
    margin-right: 0;
    }

    The blog I need help with is intellettualemoderno.com.

    #136954

    *Afer remove logo and search bar

    #137001

    binarymoon
    Theme Author

    Looks like you worked this out?

    #137013

    No, I did not solve it. But I managed to display the logo and in the middle. I have encountered other problems: the image is too small. I also noticed that by arranging the image well on the site, it ruins / fails / breaks and is positioned badly on the mobile version.
    I’ll give you some data so you can help me
    a) This is the medium-small size logo: https://image.ibb.co/kQ3pn0/logo-nuovo1.png
    b) This is the medium-sized logo (I prefer this, it’s the one set up, but maybe it’s too big): https://image.ibb.co/neqCAL/logo-nuovo2.png
    c) These are the css that I use: https://uploadfiles.io/8r58x (you place them so we save time on where to intervene)

    WHAT YOU SHOULD RESOLVE, PLEASE
    1) I would like to enlarge the logo a little (always placed in the center), because the original logo is bigger, but with the css code that I have … the logo is reduced. But … if I enlarge the logo, then you create too much space below, too much empty space between the logo and the slider. Can you also avoid creating too much space?

    2) Fixed the problem, the logo must also be displayed well on mobile devices,
    because I noticed that if I fix on the wer …. it ruins / spoils / breaks, because either the position is bad, or the size is wrong, or even the logo is displayed cut (half logo). So if you can help me, as well as on the web, even for mobile.

    Thanks again, you are my salvation. I’m not a webmaster, I’m creating the site by myself. Excuse me for the trouble and excuse me for any wrong translation.

    #137014

    Maybe I wrote too much and badly, and you understand nothing. I would like the final result to be like this (I modified the image with Paint). Position, logo size and equal space: https://imgur.com/a/edoqhM7

    But check also the mobile version (phone)

    #137048

    help please :(

    #137049

    binarymoon
    Theme Author

    Currently you have this:

    .masthead .branding {
    width: 493px !important;
    margin: 0 auto!important;
    float: none !important;
    }

    I would change it to:

    .masthead .branding {
    width: 100%;
    }

    You can then add background-position: center; to .masthead .site-logo-link.

    To make the logo bigger you can increase the height of .masthead .site-logo-link.

    #137050

    Thank you :) Everything works, even from phone and tablet you can see the logo well.

    One last domada: I accidentally removed the search box (the one on the right side). What is the css to add the search box again? Thank you

    #137084

    binarymoon
    Theme Author

    You can show the search with:

    .masthead .search-wrapper {
    display: block;
    width:250px;
    }

The topic ‘Set an image by link, as a logo, in the center of the home, below the bar’ is closed to new replies.