Ehren

Changing logo in header

Recommended Posts

In my case, I needed the logo to be shown to the left in the header (not center) in the mobile version (Dimension Theme). So I made this modification in custom.css

#header .flex00, #header .logo-wrap {
    max-width: 50%;
}

 

Share this post


Link to post
Share on other sites
8 hours ago, Daraesthetic said:

@Ehren what's a code so the logo is in the left corner on desktop?

Logos should already be in the left corner on desktop, unless you're using a customized theme.

Share this post


Link to post
Share on other sites

Hi there;

I just got setup with IPS yesterday and am making a few customizations right now. I stumbled upon this thread and it seemed to be rather current so I thought I'd ask here. :D 

A couple of questions: 

1) I have a relatively small, text based logo. In mobile view it breaks to another line instead of staying in the main "header". Since there is room in the header for both the logo and the nav menu, having it on the next line looks sloppy. Is there a way to move it from that second line, to the main header when viewing on mobile? 

2) I've got multiple variations of our logo. Is it possible to have a different variation appear on mobile than on tablet / desktop? 

Thank you very much for any help anyone can provide. 

Cheers

- Adam 

Share this post


Link to post
Share on other sites

Hi Adam,

Welcome to ipsfocus.

1. The top bar on mobiles contains the navigation icons (latest posts, search, hamburger icon) on the right side, and the breadcrumb navigation on the left side. On the index page, the breadcrumb navigation isn't shown, but if you browse around, you'll notice that space is occupied.

2. There are no options by default to allow a different logo for mobiles. You could maybe hard-code this in, but I don't currently have a copy/paste solution for you unfortunately. Sorry about that!

Share this post


Link to post
Share on other sites
10 hours ago, ProC Punisher said:

what is best size for a logo with the Carbon theme? Thanks

The Carbon header is 120px by default, but any size logo will work. The CSS will simply resize it to the correct dimensions.

  • Thanks 1

Share this post


Link to post
Share on other sites

Hi klashksa,

You may need to upload a larger version of your logo. It simply looks like you've uploaded a small logo.

Share this post


Link to post
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

Loading...