Heading text on NodeBB forum

[phenomlab]

@mventures said in Title on homepage of nodebb forum:

I shall go through this tomorrow and check what the issue on Categories is about, although I can’t see any issue at my end on Chrome and Safari.

You won’t do now as I rectified it

[mventures]

@phenomlab Oh wow! Thanks again, so much! I can see the page menu in the “down” arrow on the left navigation bar now.

How do I get that one small tagline bar up at the top, perhaps next to the logo, as its a white blank space, since the menu is to the left now? I can create a JPG/PNG image of my statement which can be loaded there. If that’s a bad idea, then something I can type up there.

[phenomlab]

@mventures I think I know what you’re after, but could you explain and clarify? Perhaps a mock-up sketch would help.

[mventures]

@phenomlab Here is an example of what I meant:

Basically, having the tagline in the header, where the logo is.
The tagline can be a JPEG banner that I can create and upload or it can be a text that can appear there.

[phenomlab]

@mventures You could achieve this effect with a :psuedo CSS class. Let me have a look at this

[phenomlab]

@mventures I forked this into it’s own topic as it deviates from the original thread.

[phenomlab]

@mventures How’s this ?

To achieve this look

1. Create a Brand Header widget

Save

2. Go to admin/appearance/customise#custom-css
3. Add the below CSS

[data-widget-area="brand-header"] {
    display: contents;
}
.tagline {
    position: relative;
    margin-left: 10px;
    margin-top: 20px;
}

Save

[mventures]

@phenomlab That’s awesome! Keen to give that a try right now! Thank you I shall be back.

[mventures]

UPDATE: It worked Thank you again. I added a few sentences and had to do a hard refresh for everything to appear and its exactly how I need it to be.
Was that BRAND HEADER widget always there or did you create it just now??

[phenomlab]

@mventures The brand widget is part of the Harmony theme, so it already exists.

Also, I added another CSS class so that the tagline is hidden on mobiles. With all that text, it’ll wrap and take half of the mobile screen estate, which will look awful.

@media (max-width: 576px) {
.tagline {
    display: none;
}
}

[mventures]

@phenomlab That’s a great idea! I didn’t think of that. Thank you.

[mventures]

@phenomlab Sorry I am back on this one. I just noticed on the desktop a blue bar appears across the header region when you visit any of the categories. Does it have to do with your CSS class insertion? It doesn’t appear on the homepage but the channel pages only.

[mventures]

UPDATE: That blue bar has now disappeared and I did nothing. Perhaps, you @phenomlab ?

[phenomlab]

@mventures I’ve not done anything here.