How to add links to the title header


(Sean) #1

Hey guys,
I’ve just successfully got my own version of Discourse up on heroku! I’m trying to add some links next to the title logo. I tried modifying /app/views/layouts/application.html.erb and adding some a tags with hrefs under the title span13 div class, but it never shows up when I upload it to heroku:

<header class="d-header">
      <div class="container">
        <div class="contents">
          <div class="row">
            <div class="title span13">
              <a href="/"><img src="<%=SiteSetting.logo_url%>" alt="<%=SiteSetting.title%>" id="site-logo"></a>
              <a class="extra" href="">about</a>
              <a class="extra" href="">blog</a>
              <a class="extra" href="">forum</a>
              <a class="extra" href="">links</a>
            </div>
          </div>
        </div>
      </div>
    </header>

I guess I don’t have enough experience with emberjs. Can anybody point me in the right direction. Thanks.


(Régis Hanol) #2

I guess what you are looking for is the logoHTML property of the header_view:

https://github.com/discourse/discourse/blob/master/app/assets/javascripts/discourse/views/header_view.js#L92-L107


(Sean) #3

So I tried this, but now it crashes my forum:

logoHTML: function() {
var result = "<div class='title'><a href='" + Discourse.getURL("/") + "'>";
if (this.get('controller.showExtraInfo')) {
  var logo = Discourse.SiteSettings.logo_small_url;
  if (logo && logo.length > 1) {
    result += "<img class='logo-small' src='" + logo + "' width='33' height='33'>";
  } else {
    result += "<i class='icon-home'></i>";
  }
} else {
  result += "<img class='logo-big' src=\"" + Discourse.SiteSettings.logo_url + "\" alt=\"" + Discourse.SiteSettings.title + "\" id='site-logo'>";
}
result += "</a></div>";
result += "<a class='extra' href='/about.html'>about</a>";
result += "<a class='extra' href='/blog.html'>blog</a>
result += "<a class='extra' href='http://southbayrubyla.herokuapp.com'>forum</a>";
result += "<a class='extra' href='/links.html'>links</a>"
return new Handlebars.SafeString(result);

}.property(‘controller.showExtraInfo’),


(Sean) #4

I totally saw what I did there… But I fixed it!
here’s the results:
http://southbayrubyla.herokuapp.com/

Thanks a ton zogstrip.

One last question, do you know where I could find the CSS for the header?


(Régis Hanol) #5

Well, there’s a header.css.scss file in app/assets/stylesheets/application. That should be a good start :wink:


(Sean) #6

I eventually found it on my own. Thanks though! :smiley: