Navigation | A way to create a field/array that replaces the page.title but outputs remaining titles if null

I’ve created a simple text field

header.new_page_title

I want to use this field to serve as a page title overwrite. For example. In the admin there is a Title field that also serves as the front-end page title in your nav or sub-nav. If I fill in the new_page_title field it replaces the default title.

That is what I want to achieve. Is this possible?

I’ve tried using a simple if statement within my for loop, but I ended up looping the new_page_title 4 times instead of replacing the one title in the array and outputting the rest as normal.

This is the code that failed:

{% if child.visible %}

      <a class="hvr-bounce-to-right {{ current_page }}" href="{{ child.url }}">
         {% if header.event_link %}`
               {{ header.event_link }}
           {% else %}
               {{ child.menu }}
           {% endif %}
      </a>

{% endif %}

Hopefully this makes sense. I think a better example would be creating a slug but only for titles. So for example, if my title on the page is About, and it shows up in the nav/subnav as About BUT I want the override title to be About My Business

hmm, took a quick look but it looks like your loop is not correct. if you loop through child pages, you have to use {% if child.header.event_link %} but in your example you used if header.event_link.

Does changing this fix your problem?

Thanks @paul for sending me in the right direction. I think I was overthinking it.

What I wanted to do was trying to create a Slug-type field for the Page Title; Because the Page Title also serves for the navigation/subnavigation. So I wanted to be able to simplify a title if needed. For example – I have a page with the title All-Star 2019. But I want the navigation to only say All-Star instead of All-Star 2019. So I created a simple text field to capture the Title I want to show (All-Star). But Also, if this field is null, pull the default Title Field instead. So I have it working with this code

Front-End | Navigation Partial

{% for child in page.children %}
    {% if child.visible %}
        <li>
            <a class="hvr-bounce-to-right {{ current_page }}" href="{{ child.url }}">
                {% if child.header.title_slug is defined %}
                    {{ child.header.title_slug }}
                {% else %}
                    {{ child.menu }}
                {% endif %}
            </a>
        </li>
    {% endif %}
{% endfor %} 

and in my Blueprint

header.title_slug:
      type: text
      label: Title Slug
      style: vertical
      size: medium
      help: Overrides Nav Title for Page