enlarging and centering logo

Hi,
I have spport access on for aficreditsolutions.com. How can I do the following?

- Center the logo
- Make the logo larger
- Fix it so the top is not cut off

  • Adam Czajczyk

    Hi cornelius_butler

    I hope you're well today!

    I'll be happy to help you with that but I need some additional information first.

    1. You'd like the logo to be centered but what about the menu then? Currently the logo is on the left and the menu (multiple lines) is on the right so where should the menu be moved? I assume that the best solution would be to put it above or below the logo but I'd need your decision on this.

    2. You mentioned that the top is "cut off" and I don't think I'm seeing that, it doesn't look "cut off" to me at all. Is it on desktop or in mobile view or is it with some specific screen resolution?

    Or is that all about some mobile view (smartphone or tablet or both)?

    Let me know, please, and I'll assist you with it.

    Best regards,
    Adam

  • Adam Czajczyk

    Hello cornelius_butler

    I checked your site hoping, after seeing he source code, that the entire header was built with some sort of a builder but it doesn't look like that and it seems that it's how the theme has it created. In that case without seriously redoing theme's header.php we can only go for some CSS workaround.

    This code seems to be working in browser but I didn't add it to your site directly:

    #header_wrapper .header {
    	display:block;
    	overflow:hidden;
    }
    #header_wrapper .header .col-md-5 {
    	width:100%;
    	clear:both!important;
    	overflow:hidden;
    	float:none!important;
    }
    
    #header_wrapper .header .col-md-5 .logo {
    	position:relative;
    	text-align:center;
    	top:50%;
    }
    #header_wrapper .header .col-md-5 .logo img {
      max-height:350px;
    	position:relative;
    	margin-top:0;
    }
    
    #header_wrapper .header .col-md-7 {
    	width:100%;
    	clear:both!important;
    	display:block;
    	float:none!important;
    }
    
    #menu-x-demo-menu {margin:0!important;}

    You could try adding it to your site's custom CSS (e.g. via Appearance -> Customize -> Additional CSS or via Appearance -> Edit CSS), clear any caches on site and in browser and see if that works for you. If so, keep it added to the site but if not it might be necessary to create a child theme of a current them, then create a custom template for a header which, I'm afraid, would be a bit outside the scope of this support.

    But give the CSS a try first, please, and let's see if it's fine or if we can add some small tweaks to it.

    Best regards,
    Adam

Thank NAME, for their help.

Let NAME know exactly why they deserved these points.

Gift a custom amount of points.