Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Breadcrumbs has a wrong url at lastest position. #3097

Open
FavorMylikes opened this issue Aug 1, 2021 · 3 comments
Open

Breadcrumbs has a wrong url at lastest position. #3097

FavorMylikes opened this issue Aug 1, 2021 · 3 comments

Comments

@FavorMylikes
Copy link
Contributor

Environment

  • Minimal Mistakes version: 4.24
  • Ruby gem or remote theme version: 2.7
  • Jekyll version: 4.2
  • Git repository URL: FavorMylikes/hackmd-note/
  • GitHub Pages hosted (if yes provide URL to site): ucas.io
  • Operating system: ubuntu

Expected behavior

Steps to reproduce the behavior

  1. Open ucas.io/dates/2021/07/
  2. The href should be /dates/2021
    image

Other

I have read the code below.

{% assign crumbs = page.url | split: '/' %}
{% assign i = 1 %}
{% for crumb in crumbs offset: 1 %}
{% if forloop.first %}
<li itemprop="itemListElement" itemscope itemtype="https://schema.org/ListItem">
<a href="{{ '/' | relative_url }}" itemprop="item"><span itemprop="name">{{ site.data.ui-text[site.locale].breadcrumb_home_label | default: "Home" }}</span></a>
<meta itemprop="position" content="{{ i }}" />
</li>
<span class="sep">{{ site.data.ui-text[site.locale].breadcrumb_separator | default: "/" }}</span>
{% endif %}
{% if forloop.last %}
<li class="current">{{ page.title }}</li>
{% else %}
{% assign i = i | plus: 1 %}
<li itemprop="itemListElement" itemscope itemtype="https://schema.org/ListItem">
<a href="{{ crumb | downcase | replace: '%20', '-' | prepend: path_type | prepend: crumb_path | relative_url }}" itemprop="item"><span itemprop="name">{{ crumb | replace: '-', ' ' | replace: '%20', ' ' | capitalize }}</span></a>
<meta itemprop="position" content="{{ i }}" />
</li>
<span class="sep">{{ site.data.ui-text[site.locale].breadcrumb_separator | default: "/" }}</span>
{% endif %}
{% endfor %}

I'm new on liquid, and have not totally understand what it is doing.

But it looks like split current page url with /

When i = 2, it will generate <a> tag with href.

But I don't see where the href handler is.

@iBug
Copy link
Collaborator

iBug commented Aug 3, 2021

Could consider it a bug. The breadcrumb was not carefully designed to handle multiple levels of hierarchy. It could only do one level (Home → Level 1 Hierarchy → Article).

@ultimape
Copy link
Contributor

ultimape commented Jan 19, 2022

My content has many nested directories. I am also new to liquid, but managed to get this going for me.

This would be a breaking change on people's format so I'm not sure how to best implement it. And given my experience here there may be a more elegant way to code this. But you (or a maintainer) are welcome to have at it.

I rewrote that part of breadcrumbs.html page to use a different url rendering loop based on this example on stackoverflow by (@jhvanderschee)

I also set this up to always render the root breadcrumb even on the root directory / homepage. By changing

{% if page.url != "/" and site.breadcrumbs %}

to {% if site.breadcrumbs %}

I figure that you can always disable the breadcrumb on the root by setting the breadcrumbs: false in frontmatter instead of it being specialcase'd in the code. Not sure if that works with this bit of logic tho.

A friend suggested I could use {% capture %} to clean this up, but I'm not sure how.

This is what I changed it to to get the correct urls.

    {% comment %} thanks to https://stackoverflow.com/a/32004173/42082 for how to fix urls {% endcomment %}
    {% assign crumbs = (page.url | remove:'/index.html' | split: '/') %}
    {% assign i = 1 %} 
    <li itemprop="itemListElement" itemscope itemtype="https://schema.org/ListItem">
      <a href="{{ '/' | relative_url }}" itemprop="item"><span itemprop="name">{{
          site.data.ui-text[site.locale].breadcrumb_home_label | default: "Home" }}</span></a>
      <meta itemprop="position" content="1" />
    </li>
    {% for crumb in crumbs offset: 1 %}
      {% assign i = i | plus: 1 %}
    <span class="sep">{{ site.data.ui-text[site.locale].breadcrumb_separator | default: "/" }}</span>
    <li {% if forloop.last %}class="current"{% endif %} itemprop="itemListElement" itemscope itemtype="https://schema.org/ListItem">
      <a href="{{ '' | relative_url }}{% assign crumb_limit = forloop.index | plus: 1 %}{% for crumb in crumbs limit: crumb_limit %}{% if forloop.last %}{{ crumb }}{% else %}{{ crumb | append: '/' }}{% endif %}{% endfor %}"
        itemprop="item"><span itemprop="name">{{ crumb | replace: '-', ' ' | replace: '%20', ' '  | remove:'.html' }}</span></a>
      <meta itemprop="position" content="{{ i }}" />
    </li>
    
    {% endfor %}

Hope this helps!

@ultimape
Copy link
Contributor

ultimape commented Jan 20, 2022

I noticed There is a PR in the pipeline that would make my aforementioned changes of disabling breadcrumbs on the '/' directory a reality. #3096

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

3 participants