Archived topic

Add Text to left of hamburger menu

6 replies · Started by Stephen on December 22, 2019

Viewing posts 1–7 of 7

December 22, 2019 at 5:18 am #1111133

I would like to add a small piece of text (the page title) to the left of the hamburger menu icon, which is used on all device types. I want the logo, the page title and the hamburger menu all to be aligned horizontally. I have tried various hooks but can't get all 3 elements in one line in the header.

Thanks,
Stephen

December 22, 2019 at 8:47 pm #1111812

Hi there,

Give this a shot:

.inside-header {
    display: flex;
    align-items: center;
}

.site-logo {
    order: 1;
    margin-right: auto;
}

.site-header h3 {
    order: 2;
    margin-bottom: 0;
}

#site-navigation {
    order: 3;
    margin-left: 0;
    margin-right: 0;
}

Let me know :)

December 23, 2019 at 5:20 am #1112111

Thanks Tom. That worked perfectly :)

December 23, 2019 at 9:40 am #1112483

You're welcome :)

January 4, 2020 at 2:48 am #1121542

Hello,

I've noticed this does not work on the blog posts page (/blog). The page title either shows nothing left of the hamburger menu or sometimes the blog title of the first blog post in the feed (not "Blog" which I want).

The hook is <h3> <?php the_title( '<h3>', '</h3>' ); ?> </h3> and is place before_logo.

thanks,
Stephen

January 4, 2020 at 2:50 am #1121543

Disregard actually - I am going to move this to another support thread

January 4, 2020 at 5:17 am #1121659

I have responded to your other topic.

This archived topic is closed to new replies.

Start building better websites today.