CMS Development

JWiberg
Member

How do i get the title and URL from my parent page on child page

SOLVE

Hey,

 

I have a site structure where i have a parent page and child page

On the child page i would like to display the title and the url to the parent page

Like this:

Parent page Title(with link to parent page) / Title of child page

 

I made this possible on my blog, but im unable to find the right variables in HubL to make this work on my pages. Any help would be appreciated 🙂

0 Upvotes
1 Accepted solution
Sjardo
Solution
Top Contributor | Diamond Partner
Top Contributor | Diamond Partner

How do i get the title and URL from my parent page on child page

SOLVE

Hi @JWiberg 

The code for our breadcrumbs

{# Set empty array #}
{% set slug = [] %}
{# Get absolute url of current page and split #}
{% for item in content.absolute_url|split('/') %}
  {# Remove the first 2 items. This way it wil remove the items 'https' and 'www.sample.com' #}
  {% if loop.index != 1 && loop.index != 2 %}
    {# Append item to the slug #}
    {% do slug.append(item) %}  
  {% endif %}
{% endfor %}

{# Get path. First try to get the slug. As fallback request path #}
{% set breadcrumbs = slug || request.path|split('/') %}
{# Set seperator #}
{% set seperator = '<span class="seperator">&nbsp;&nbsp;&raquo;&nbsp;&nbsp;</span>' %}
{# Set Home label #}
{% set home_label = 'Home' %}

{# Set base for page urls #}
{% set page_url = {'value' : request.scheme ~ '://'} %}
{# Get domain #}
{% set domain = request.domain %}
{# Add domain to the page url #}
{% do page_url.update({'value' : page_url['value'] ~ domain ~ '/'}) %}

<ol class="vet-breadcrumbs"> 
  
  {# Home #}
  <li>
    <a href="https://{{ domain }}/">
      <span>{{ home_label || 'Home' }}</span>
    </a>
    <meta/>
  </li>
  {{ seperator }}
  
  {# Pages #}
  {% for breadcrumb in breadcrumbs %}
  
    {# Laste page (No link) #}
    {% if loop.last %}
      <li>
        <span>{{ breadcrumb|replace('-',' ')|capitalize }}</span>
      </li>
    {% else %}
      
      {# Page #}
      {% do page_url.update({'value' : page_url['value'] ~ breadcrumb ~ '/'}) %}
      <li>
        <a href="{{ page_url['value'] }}">
          <span>{{ breadcrumb|replace('-',' ')|capitalize }}</span>
        </a>
      
      </li>
      {{ seperator }}
  
    {% endif %}
  {% endfor %}
</ol>

 

 

Sjardo Janssen, Bureau Vet
Bureau Vet - Sjardo.nl

Did my post solve your question? Help the community by marking it as a solution

View solution in original post

5 Replies 5
Sjardo
Top Contributor | Diamond Partner
Top Contributor | Diamond Partner

How do i get the title and URL from my parent page on child page

SOLVE

Thanks @dennisedson for the mention!

 

@JWiberg sadly, there is no "relation" between a child and a parent page. The only relation there is, is if it's in the same URL Path or not. 

 

You can do multiple things to "trick" a parent:

1. Base the Parent on the URL path

Based on that URL path, you can grab the URL and a fake title that might not be the same as the parent, but is fairly ok. 

As an example, here are breadcrumbs we made based of the URL.

Screenshot 2021-06-17 at 09.52.16.png

The home is the default website URL and name. Projecten. the parent, is based of the URL (example.com/projecten/nieuwe-bestrating-maakt-wijkcentrum-druten-helemaal-af).

 

Let me know if you need the code for this 🙂

2: Create a module where you need to select the menu

This way, you can show the parent in the menu, where you want to. Create a module, load the selected page and you are done!

Yet, you need to set this on every page. Lot's of manual work.

 

3: Create a custom menu that you load on every page and contains every page on your site.

Hide all items of the menu but the second to last. I think that should do the trick, but gets buggy real fast.

Sjardo Janssen, Bureau Vet
Bureau Vet - Sjardo.nl

Did my post solve your question? Help the community by marking it as a solution
JWiberg
Member

How do i get the title and URL from my parent page on child page

SOLVE

Yes this is exactly what i was thinking about doing! if its possible to share code to set me in the right direction it would be awesome 🙂 

0 Upvotes
Sjardo
Solution
Top Contributor | Diamond Partner
Top Contributor | Diamond Partner

How do i get the title and URL from my parent page on child page

SOLVE

Hi @JWiberg 

The code for our breadcrumbs

{# Set empty array #}
{% set slug = [] %}
{# Get absolute url of current page and split #}
{% for item in content.absolute_url|split('/') %}
  {# Remove the first 2 items. This way it wil remove the items 'https' and 'www.sample.com' #}
  {% if loop.index != 1 && loop.index != 2 %}
    {# Append item to the slug #}
    {% do slug.append(item) %}  
  {% endif %}
{% endfor %}

{# Get path. First try to get the slug. As fallback request path #}
{% set breadcrumbs = slug || request.path|split('/') %}
{# Set seperator #}
{% set seperator = '<span class="seperator">&nbsp;&nbsp;&raquo;&nbsp;&nbsp;</span>' %}
{# Set Home label #}
{% set home_label = 'Home' %}

{# Set base for page urls #}
{% set page_url = {'value' : request.scheme ~ '://'} %}
{# Get domain #}
{% set domain = request.domain %}
{# Add domain to the page url #}
{% do page_url.update({'value' : page_url['value'] ~ domain ~ '/'}) %}

<ol class="vet-breadcrumbs"> 
  
  {# Home #}
  <li>
    <a href="https://{{ domain }}/">
      <span>{{ home_label || 'Home' }}</span>
    </a>
    <meta/>
  </li>
  {{ seperator }}
  
  {# Pages #}
  {% for breadcrumb in breadcrumbs %}
  
    {# Laste page (No link) #}
    {% if loop.last %}
      <li>
        <span>{{ breadcrumb|replace('-',' ')|capitalize }}</span>
      </li>
    {% else %}
      
      {# Page #}
      {% do page_url.update({'value' : page_url['value'] ~ breadcrumb ~ '/'}) %}
      <li>
        <a href="{{ page_url['value'] }}">
          <span>{{ breadcrumb|replace('-',' ')|capitalize }}</span>
        </a>
      
      </li>
      {{ seperator }}
  
    {% endif %}
  {% endfor %}
</ol>

 

 

Sjardo Janssen, Bureau Vet
Bureau Vet - Sjardo.nl

Did my post solve your question? Help the community by marking it as a solution
JWiberg
Member

How do i get the title and URL from my parent page on child page

SOLVE

Thank you so much!!! This works like a charm! Now i can customize it in a way i would like it 🙂 thank you for your help

Skärmavbild 2021-06-17 kl. 10.48.49.png

dennisedson
Community Manager
Community Manager

How do i get the title and URL from my parent page on child page

SOLVE

@Sjardo , have any advice for @JWiberg 😀

Thanks,

Dennis




HubSpot Community Developer ShowMake sure to subscribe to our YouTube channel
where you can find the HubSpot Community Developer Show
0 Upvotes