Hexo: is_home() and homepage

Created on 23 Jul 2014  ·  8Comments  ·  Source: hexojs/hexo

hello, I will wish to manage the color of my menu according to the page on which I find myself.
Example: The Home menu is colored when the the page is homepage.

Off the is_home () function does not work. It seems to me that there was one thing I did not understand.
My url is: http://blog.pg/
The URL returned by the variable path or url is: http://blog.pg/archives/

why archives?

Thank you for your return.

question

Most helpful comment

Regarding the separate issue from @SykieChen :

the condition function works well on local server running on hexo -s but it failed to work if i generate them into static files.

...I also ran into this - In my case it was due to the use of a partial() with caching turned on. For example:

# `this.path` would not change within this partial...
<%- partial('_partial/header', null, {cache: !config.relative_link}) %>

# But it does change in this partial...
<%- partial('_partial/header') %>  # Caching off by default

All 8 comments

ok, I succeeded in doing this but there must surely be another solution

<% for (var i in theme.menu){ var linkPath = theme.menu[i].substr(1);  %>
<li>
    <a class="" href="<%- url_for(theme.menu[i]) %>"><% if ((linkPath != "" && is_current(linkPath)) ||(linkPath == path )){ %>active<% } %><%= i %></a>
</li>
<% } %>   

Please show me the source code of templates.

I just came across this problem too. For me is_home() prints out that Archives is home. (Here's my hexo repo.)

Just for reference, I'm trying to make the homepage be a landing page with the blog at /blog.

well, here's my work around instead of using sweet helpers:

      <% if (url_for(page.path) == '/index.html'){ %>     
          yay!
      <% } %>       

my problem is a little different:
the condition function works well on local server running on hexo -s
but it failed to work if i generate them into static files.

i found a probable reason, i used post.path and found no matter which page i am in the output is always the same. Then i noticed the same var works well in article.ejs, and i found the problem maybe because i used them in wigdets, but the widgets are only generated one time in the process of generating the first page, and the things generated are reused in every pages generated later. So the widgets CANNOT varies in differend pages. that's all.

I am also running into issues trying to use the is_current() helper with configured theme.menu paths and url_for() (Hexo v3.1.1)

As a workaround I made an alternative isCurrentMenu() helper (placed in the ./scripts/ folder):

// scripts/is-current-menu.js
/**
 * Helper: is_current_menu(menu)
 *
 * To be used as an alternative to the `is_current()` helper 
 * with the layout "menu" configuration.
 */
function isCurrentMenu(menu){
  var _this = this;
  menu = menu || '';

  // filter the input path and the current path
  var paths = [menu, this.path].map(function(p) {
    return _this.url_for(p)
      .replace(new RegExp('^' + hexo.config.root), '')
      .replace(/index.html$/, '')
      .replace(/\/$/, '')
      .replace(/^\//, '');
  });

  return paths[0] === paths[1] ||
    (paths[0].length && paths[1].substring(0, paths[0].length) === paths[0]);
}

hexo.extend.helper.register('is_current_menu', isCurrentMenu);

Example usage in template:

<ul class="nav navbar-nav">
  <% for (var i in theme.menu){ %>
    <li><a class="<%= is_current_menu(theme.menu[i]) ? 'active' : '' %>" 
           href="<%- url_for(theme.menu[i]) %>"><%= i %></a></li>
  <% } %>
</ul>

Example menu configuration:

menu:
  Home: /
  Archives: /archives

[Edit] It turns out that I didn't fully understand the built-in behavior... I was able to get is_current() to work by modifying my menu configuration to the following:

menu:
  Home: index.html
  Archives: archives/

Related to #1112

Regarding the separate issue from @SykieChen :

the condition function works well on local server running on hexo -s but it failed to work if i generate them into static files.

...I also ran into this - In my case it was due to the use of a partial() with caching turned on. For example:

# `this.path` would not change within this partial...
<%- partial('_partial/header', null, {cache: !config.relative_link}) %>

# But it does change in this partial...
<%- partial('_partial/header') %>  # Caching off by default
Was this page helpful?
0 / 5 - 0 ratings