Brand header theme component

This solved the issue, thank you.

4 Likes

I seem to be getting a broken thumbnail displaying on the menu whenever I write in the URL of the .jpg logo (the same .jpg logo I use on my Wordpress installation) in the configuration settings.

Any idea what the issue might be?

2 Likes

Try uploading the image directly to your discourse site and using that instead of the one hosted on your WP site.

4 Likes

I tried that as well but still get a broken thumbnail for some odd reason.

1 Like

When SSL (https) and CSP are enabled in your Discourse site the logo URL should have the « https » prefix.

5 Likes

Hello,

Where should I put my custom CSS for this component ?

In the theme common css, I have to add !important everywhere because it seems loaded before the brand header css.
In the brand header css, I have the warning

This is a remote theme, if you edit CSS/HTML your changes will be erased next time you update the theme.
So when I will update I will lose my customization.

2 Likes

Hello @vinothkannans thank you for this great component!

I don’t want it to show to non logged in users so I have added this in the CSS of the component:

.b-header {
display: block;
}

.anon .b-header {
display: none;
}

It works but it still takes space here:

Do you know what I should do?

2 Likes

Add the below CSS to remove the blank space.

.anon .ember-application .d-header {
  margin-top: 0;
}
5 Likes

Wow thank you sooooo much Vinoth!! It looks great! Tada!

3 Likes

Hello everyone,

I need a help for CSS customization, I am trying to make my header uniform from the links to the text title.

I tried changing a bit the CSS to get the same font size and hover block, but it is not perfect yet.

Look the difference between the text title and following links, the blocks and font are not the same size (links and title text).

Thanks in advance.

1 Like

Hi, back with another question. My icons, and their links seem to be gone. I am on 2.5.0 stable. I checked desktop and mobile.

I tried removing and replacing them, still no go. Any ideas?

1 Like

It looks like the icons are missing the prefix fab- in the theme setting “icons”. For example twitter should be fab-twitter and the youtube should be fab-youtube.

3 Likes

That did it, Thanks!

Odd I didn’t change anything, just didn’t work one day. Great theme component and the support is even better!

2 Likes

This is now done in the commit below

4 Likes

I love this change, but on several sites where I use it personally, and on a hosted site I’m a moderator of (the NaNoWriMo forums) we’ve been seeing some issues. Unlike the regular hamburger menu, if you try to swipe it away it bounces back onto the screen.

I’ve personally seen this on a fully updated Moto (g7) Power on Android 9 and on a fully updated iPhone 8.

There has also been at least one report of the menu opening on touches near the icon and not just on it, but I’ve personally been unable to reproduce that particular behavior.

2 Likes

Hi there,

I just updated the brand header component, but now my menu is invisible (and the menu items are not in the source code). The only thing I see is an empty space:

Any clue? I disabled the component currently.

When enabled I got 4 javascript errors in the console (missing 404 error):
https://dub2.discourse-cdn.com/standard20/theme-javascripts/8797523fe59f84228101b2063eea3c2c4027e13f.js?__ws=answers.ixon.cloud

1 Like

Before the update it looked like this:

1 Like

I’m able to see the updated header in your site. And it doesn’t have any js errors now. I think it was a intermediate cache issue.

2 Likes

Yes thanks, problem is now solved for some reason :slight_smile:

1 Like