Home Forums Lush Theme Discussion & Support How to make the site-wide header logo larger

This topic is: not a support question

This topic contains 4 replies, has 3 voices, and was last updated by  Nick Truscott 2 years, 10 months ago.

Viewing 5 posts - 1 through 5 (of 5 total)
  • Author
    Posts
  • #4063

    Marsha Graham
    Participant
    Post count: 1

    Hi,

    I would like to centre align a larger logo – perhaps 400px (w) x 150px (h) – above the main navigation menu in this theme. I would like to place it above the menu so that the menu can still extend a reasonable way across the page (but still have it right aligned). Can you please tell me how I can do this? I can find my way around CSS and the theme files confidently and I’m great at following instructions but not so good at working out CSS so any help you would provide would be most appreciated.

    Cheers,
    Marsha

    PS. Have you considered adding multiple/customisable side-bar options to your themes?

    #4064

    themeweaver
    Keymaster
    Post count: 730

    It isn’t that simple.

    This is a responsive theme so pixel dimensions of the image are irrelevant. The exact dimension of the space available to the logo are different on different platforms – mobiles, tablets, desktops etc. The image width always shrinks to fit the available space.

    The layout is governed by extend\layout.css and is specified in percentages. But care should be taken since you can break the responsive nature of the theme.

    #4136

    Nick Truscott
    Participant
    Post count: 67

    Tim, I’m facing a similar issue as the client wants a full width header/logo that is also responsive.

    I’ve got a 1000px png header which responds great at most mobile or large monitor or laptop screen sizes, but there is the equivalent of a “blind spot” at a kindle sort of size.

    I appreciate your previous response to Marsha, but can you offer any advice?

    #4137

    themeweaver
    Keymaster
    Post count: 730

    Big header images are never going to look great on all devices.

    Responsive design is about accepting and designing things to look different on different devices. So in most themes the menu folds away, logos and titles go under each other rather than across etc, etc.

    So having one big header image is not going to work and I don’t believe even if you made it so, it would not look all that great across devices.

    Solution – educate the client. Big header images are a very bad design choice. You might as well go back to a fixed with design.

    #4138

    Nick Truscott
    Participant
    Post count: 67

    I do appreciate that Tim and agree about educating clients. However they have been insistent and it was mainly about the “blind spot” I mentioned. They were happy with the wider logo as it appeared on most mobile platforms (but I wasn’t / am not).

    To appease them I have fiddled and tweaked and used the logo settings for mobile devices (extend/layout.css) in my custom CSS and that – together with reducing the width as much as possible) has resolved their issue. When the current “webmaster” retires I feel sure that the new incumbent will accept the default theme functionality very readily and revert to it.

    Thanks again for everything you do to support so many ministries – a real blessing.

    Nick

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

You must be logged in to reply to this topic.