Branding - Custom brand header with logo, navigation and icons


(Vinoth Kannan) #1

discourse-branding

This plugin is converted and maintained as a brand header theme component.


About

Add custom brand header with logo, navigation, icons and banner for you Discourse website.

Banner Styles

  1. default - Full width image banner with title and description on hover.
  2. smart - Three columns banner with image, title, description and links. Highly inspired by https://community.smartthings.com
  3. plugin - Create your own banner with new plugin outlet branding-banner.

To add links on smart banner use plugin outlet branding-banner-links like below.

<script type='text/x-handlebars' data-template-name='/connectors/branding-banner-links/resources'>
  <p>Resources: </p>
  <ul>
    <li><a href="http://link1.com">Link 1</a></li>
    <li><a href="http://link2.com">Link 2</a></li>
    <li><a href="http://link3.com">Link 3</a></li>
    <li><a href="http://link4.com">Link 4</a></li>
    <li><a href="http://link5.com">Link 5</a></li>
  </ul>
</script>

Screenshots

Installation

Repo is at: https://github.com/vinkashq/discourse-branding

Navigation plugin is required to manage brand links and icons

In your app.yml add:

hooks:
  after_code:
    - exec:
        cd: $home/plugins
        cmd:
          - mkdir -p plugins
          - git clone https://github.com/discourse/docker_manager.git
          - git clone https://github.com/vinkas0/discourse-navigation.git
          - git clone https://github.com/vinkas0/discourse-branding.git

And then rebuild the container:

./launcher rebuild app

Configuration

You can change branding settings under admin/site_settings/category/branding. And add your custom menu links in /admin/plugins/navigation path using Navigation plugin.


Navigation - Add custom menu items
Create Banner on Top
Pre-Built Theme?
First time Discourse'er
Change click behavior
[Simple] A button near the logo/sticky menu
Changing 'After Header' so that it is just visible on main page
Custom discourse setup
(Erlend Sogge Heggen) #2

So in essence, this is like a standardised, more user friendly version of a custom nav header, correct?

It’s a great idea!

A slightly more advanced concept I’ve been toying with in my head is to create a branding menu based on a website’s API. So if you’ve built your site with a CMS that provides an API, like WordPress, Drupal or Contentful, you could poll that API to build the branding menu and keep it up to date.


(Vinoth Kannan) #3

Yes, It is.

Currently I am doing homepage banner feature with this. Thank you @Bernstein for donations to this and two more plugins.

I am thinking to add footer functionality with it. But I am not sure about how many users wanted and how much helpful it is.


(Vinoth Kannan) #4

v0.2.0


new feature: Add welcome banner to your home page. It will be visible on home, latest, new, unread, top, categories pages.


#5

When i disable the plugin, the header remains - is this a known issue?


(Vinoth Kannan) #6

No. Thanks for your report. I will fix it soon.


(Ruxan) #7

how can i change color the smart banner? :frowning:

thanks for this sexy stuff !!!


(Vinoth Kannan) #8

by default it uses theme colors. To change the colors of particular portions you have to use CSS customization.


(Ruxan) #9

thanks for answer, i figure that out last night, its very good!


(Ruxan) #10

sorry for bothering you, but im having a small hickup,

as you can see on

just underneath the orange colored Category, there are links from my last top menu setup

i realised there were duplicate, same set were on top menu, and same just under Categories

i went to /admin/plugins/navigation and deleted all of them, they went away from top menu, but they are still there even when i clear cache and everything…

can you point me how to delete that :frowning:

edit:

i have figure it out, after i rebuild app, if i have any of menus on TOP, they just show up under Categories, then i need to delete all menu, rebuild, and add all menu items again.

wierd :confused:


(Vinoth Kannan) #11

As I mentioned in navigation plugin top menu items needs rebuild to display the changes. I will fix this in future when I have time.


(Ruxan) #12

you must understand, that problem is apearing when you are rebuilding.

If you have MENU ITEMS 1,2,3 … on top menu

when you rebuild your discourse, same duplicate MENU ITEMS 1,2,3 apear under CATEGORIES

:slight_smile:

short story, you dont want to have top menu active when you are rebuilding, delete menu items before rebuild, then add them after rebuild, that solved my problem :slight_smile:


(Michael - DiscourseHosting.com) #13

Bug here… enabling this plugin will, for some reason, surround the RSS feeds (like /latest.rss) with HTML, making them unusable.


(John Lorance) #14

I’m on 1.8beta4 (now beta5a) have the navigation plugin and branding plug in. Still not seeing the menu for the navigation plug-in but that’s a separate issue. Is there anyway to have the branding plugin enabled so I can get the banner aspects of the branding plug-in but w/o the extra top bar of that is generally what the navigation plug in provides? Seems like an all or nothing situation right now.


(Bhanu Sharma) #15

Is this plugin still being maintained?

I tried rebuilding yesterday with this plugin and my discourse returned a White screen of death. only fixed after removing this plugin.
any ideas?


(Ben Edwards) #16

As the creator of the original inspiration banner, I’d love to know if this plugin can be installed on hosted (not self) instances of Discourse. I don’t see it in the default list. I’d like to do something like it with a community perhaps.


(Vinoth Kannan) #20

No. This plugin can’t be installed in hosted sites. In the list you can only see official plugins from Discourse.


(Ben Edwards) #21

Oh, well. Back to my hacky ways :slight_smile:


(Jeff Atwood) #23

I’m pretty sure everything this plugin does, could be done with CSS and HTML customizations in Admin, Customize.


(Sam Saffron) #24

@vinothkannans I would really like this converted to a theme, it is totally non-strategic having it as a plugin, it only amends the front end.

Theme vars are a problem I want us to solve. Though I feel you can just inject them via a theme component anyway now so there is a workaround.

(note, this is not urgent, but should be on your radar)