Add Logo – Metro – Responsive?

Community Forums Forums General Discussion Add Logo – Metro – Responsive?

This topic is: not resolved

Tagged: , ,

This topic contains 13 replies, has 5 voices, and was last updated by  Sasha Foust 1 year, 8 months ago.

Viewing 14 posts - 1 through 14 (of 14 total)
  • Author
    Posts
  • #19270

    4WardMotion
    Participant
    Post count: 34

    I would like to add a logo to my header instead of using the text.  How do I add a logo first off and secondly I would like it to be responsive so that it is centered when looking on a mobile phone or iPad.  Is there a tutorial out there on how to do this or can someone instruct me on how to do this?

    Thanks!

    Tyy

    #19312

    snakeair
    Participant
    Post count: 164

    In your admin dashboard go to  —>Appearance —-> Header and upload your logo.

    Now to make it mobile responsive, you will have to install Nick’s plugin. It can be found on his blog:  http://designsbynickthegeek.com/plugins/genesis-responsive-header

    #19430

    4WardMotion
    Participant
    Post count: 34

    Ok, I added the header image and now it just has a big red bar all the way across.  I am using the Metro theme with the red color.  Not sure why it is making it red.  The entire header is now red and is not showing my logo image.  Also, it is making the whole thing a clickable link.  Can I make it so just the logo is clickable?  Thanks for the help!

    Tyy

    #19457

    snakeair
    Participant
    Post count: 164

    When you upload your image in the header section, look at the bottom of that page and take the checkmark off  ” Show header text with your image.” since you don’t want the text header no more and save settings. Your logo image ethat you uploaded and selected will be clickable.

    #19458

    4WardMotion
    Participant
    Post count: 34

    I have done exactly as you said and it won’t work.  It just makes the entire header red.  Not sure what is happening.  I have checked and unchecked the header text box and the only thing it does is reduces the size of the red area to the size of the header text.  Other than that it will not put my logo.  Seems like something in the theme’s color template is overwriting it.  Any other ideas?  Thanks!

    Tyy

    #19459

    4WardMotion
    Participant
    Post count: 34

    Ok, I just figured something out.  When choosing any of the color themes other than default is what is causing the problem.  When I chose the default color theme it works, except it makes the entire header clickable instead of just the logo.  This seems like it might be an error with the theme.  Any thoughts?

    Thanks!

    Tyy

    #19460

    snakeair
    Participant
    Post count: 164

    I’m going to upload my new logo image this week as I just hired a designer this morning. I still have the default text one showing but on the old genesis theme I had, I never ran into this issue.  I’ll let a moderator or another member toss in some advice.

    #19491

    SmartEnergy
    Participant
    Post count: 1

    I am having the same problem. I have this blue rectangle and I cannot put up the logo.

    #19577

    craigdonnelly
    Participant
    Post count: 2

    I am also having the same problem. If I use any color but the default color theme (I want to use green)… If I want to upload my own logo (no text in header)… I get a solid green bar in the header area.

    I am going to try to change the default color theme to green in the css.  Will come back and update.

    #19582

    craigdonnelly
    Participant
    Post count: 2

    Ok it worked. I changed the default metro theme color (#f96e5b) to the green color of my choice (#457E00). Just do a find and replace.

    If you want to upload your own header logo graphic file (jpg., png, etc…) and use a different color than the default metro theme color (which is currently set to pink (#f96e5b)…. you need to modify the main css file… by changing the default color to the color you want to use.

    #19641

    4WardMotion
    Participant
    Post count: 34

    Thanks for sharing that fix.  I will go play with it and see what I can come up with.  One question I still have though is when I add the header image it makes the whole header as a link instead of just the logo.  Is there a way to change that.  Thanks!

    #19654

    Sasha Foust
    Participant
    Post count: 16

    I am also having this problem with Metro. Can a moderator look into it and fix this problem? Even a quick CSS solution would be great.

    I feel something as fundamental as uploading a logo shouldn’t be this hard.

    #19688

    4WardMotion
    Participant
    Post count: 34

    Ok, I just got a reply directly from support regarding this problem and here is what they recommend.

    Look for:

    .header-image #title a {

    background: none;

    padding: 0;

    Change it to:

    .header-image #title a {

    background: none !important;

    padding: 0;

    I just tried this and it did fix the problem using one of the other themes color templates.

    I still need to find out how to only make the logo a link and not the whole header, but I guess one step at a time.  Hope this helps.

    #19899

    Sasha Foust
    Participant
    Post count: 16

    Support wrote me this answer. Delete background color and add display block and text indent. Just need to fix the clickable area as well now…

     

    #title a {
    background: url(images/logo.png) no-repeat;
    display: block;
    line-height: 1;
    padding: 8px 16px;
    padding: 0.5rem 1rem;
    text-indent: -9999px;
    }

Viewing 14 posts - 1 through 14 (of 14 total)

You must be logged in to reply to this topic.