Dealing with a big logo (actually two logos)

Hello,
Can you please help me with two problems that we have on one website.
On https://dentists-and-friends.de/
my colleague and I, we had to combine two logos into one, sine the client 
wanted to have two logos in the same corner of the page...

And now we have a problem that on screens that are around 15-16-17 inches,
the logo and the menu are braking into two parts- so they are not in the same level.
(This doesn't happen on bigger screens like 21 inches)

Do you have any solution for us?

Our idea is to turn on the mobile version of the menu, the Hamburger menu,
earlier... even at 16-17 inches. But how do we do that so that we don't have to use
a child theme?

Another thing that we cannot find how to do is to change the link address of the logo,
so that when you click on the logo, you get to the Transparenz page, and not the home page.

Please help.

Stefan

Comments

  • Hello Stefan,

    the logo is just too big and there are too many menu items for it to fit on lower screen sizes. The sollution would be to rearange the menu so there are less items or use a simple header style so you get the burger menu from the start.

    The logo redirects to the home page by default and it would require theme file changes in order to customize it.
    You can also use our header builder plugin to add 2 different images as logos and link them where you want.
    You will find the plugin in wordpress>betheme>install plugins

    thanks

  • Hey Brian,
    Thanks for your reply and your advice. We will talk to the client to see if it is possible to rearrange the
    menu items.
    We will also try the header builder.

    However I have two more question about the "custom css and js" that is in the theme options.
    I saw this tutorial 
    and I tried to follow those steps. It worked but it was working only while I was logged in in the wordpress. Also it didn't work on other browsers while I was logged in (I am using Chrome, and it didn't work in Opera and Edge).
    With this custom code I managed to decrease the right margin of the logo and padding between the menu items, so the header didn't break so soon. This would be a great solution, but can you tell me if there are some missing steps here to make this really work, or what is the problem?

    Also, is it possible to edit the media queries with custom css and js, so that we can bring the burger menu sooner?

    Thanks in advance.
    Stefan
  • But, this video tutorial is not coming from our youtube channel and it's on very old version of the theme.
    Our official youtube channel:

    Also, Custom CSS codes if are made properly, will work fine, it's not possible to disable it.
    But, media queries will not be easily changed with custom css because they are hardly coded in the theme code, what we suggest is to install the child theme and customize code of our theme - but unfortunately, we do not help with customizing it.

    Thanks
  • Hi Pablo,
    Thanks for your reply.
    Ok, I get it, it is an old video and it is not an official one.

    And ok for the media queries...

    Can you then just help me with the custom css, because I think that would be a perfect solution.
    This is what I added to it:

    #Top_bar .menu > li > a span:not(.description) {
        padding: 0 10px;
    }

    #Top_bar .logo {
        margin: 0 1px 0 20px;
    }

    And like I said, it worked great then, but not when I logged out. And even when I logged back in,
    now it is not working.

    Thanks,
    Stefan
  • Please tell me what do you exactly want to achieve?
    You don't have to provide any CSS codee to increase the size of logo or margin of it.
    It's all available to do in the Theme Options > Global > Logo

    Thanks
  • Hi Pablo,
    Sure... I would like to decrease the padding between the menu items and the right margin on the logo.
    And all because when we have smaller screens, like 15 to 17 inches, the header is breaking apart. 
    You can have a look at the website and try it yourself.
    https://dentists-and-friends.de/
    If there is anything else that I need to explain, please let me know.

    Thanks,
    Stefan
  • p.s. One more thing.
    We tried to change the link attribute of the logo by going to the file includ-logo.php:
    https://www.dropbox.com/s/5lsx9uarb4dmhj4/IMG-689a86be5bc14640d9d36faf7b261eb7-V.jpg?dl=0
    https://www.dropbox.com/s/ewmp8z30i8coeui/IMG-9b3366775b22b19aa502843487dbd322-V.jpg?dl=0
    And it worked for some time but when we cleared the cash to check
    if it works, everything resets and the logo is again leading to the home page.
    We need the logo to lead to the Transparenz. Is this possible by this method?
  • Sorry, but it's not possible to decrease the padding between the menu items.
    You shouldn't customize it with CSS, because it could affect with responsive problems - we strongly suggest not to do it.

    Also, we do not support customizing the theme files code.
    Thanks
  • edited October 2019
    About the padding, I don't understand why because everything was working fine, but ok.

    And about customizing the link in the theme files, that's really too bad.

    Thanks for your help anyway.
Sign In or Register to comment.