Creating Page with list of posts with a specific tag

I’m trying to create a newsletter page that includes static content pulled from a page at the top, and then shows a list of the posts that are tagged “newsletter” below it.

I’ve tried to follow a few different tutorials online and keep getting stuck.

I have a custom-newsletter.hbs that looks like this:

{{!< default}}

<div class="content-area">
    <main class="site-main">
        {{#page}}
            <div>
                <h2>{{title}}</h2>
                {{content}}
            </div>
        {{/page}}


		{{#get "posts" filter="tag:newsletter"}}
        <div class="post-feed container medium">
            {{#foreach posts visibility="all"}}
                {{> "loop"}}
            {{/foreach}}
        </div>
        {{pagination}}
		{{/get}}
    </main>
</div>

And then a routes.yaml:

routes:

collections:
  /newsletter/:
    permalink: /newsletter/{slug}/
    data: page.newsletter
    template: custom-newsletter
    filter: 'tag:newsletter'
  /:
    permalink: /{slug}/
    template: index
    filter: 'tag:-newsletter'

taxonomies:
  tag: /tag/{slug}/
  author: /author/{slug}/

When I go to site.com/newsletter I get a page that correctly shows the looped list of posts at the bottom but where I would expect the static page content I just see “undefined”. I thought it would pull from the Page I had created with the slug “newsletter” (based on this tutorial). What am I doing wrong?

That’s exactly what I’m currently trying to achieve. Thought this would be a quite common way to display the content