Ghost/ghost/admin/app/templates/posts/analytics.hbs

<section class="gh-canvas">

    <GhCanvasHeader class="gh-canvas-header stacked gh-post-analytics-header">
        <div class="gh-canvas-breadcrumb">
            <LinkTo @route="posts">
                Posts
            </LinkTo>
            {{svg-jar "arrow-right-small"}}Analytics
        </div>
        <h2 class="gh-canvas-title gh-post-title">
            {{this.post.title}}
        </h2>
        <p class="gh-post-analytics-meta">
            {{#if
                (or this.post.isSent
                    (and this.post.isPublished this.post.email)
                    this.post.willEmail
                )
            }}
                {{#if this.post.emailOnly}}
                    Sent
                {{else}}
                    Published and sent
                {{/if}}
            {{else}}
                Published on your site
            {{/if}}

            {{#let (moment-site-tz this.post.publishedAtUTC) as |publishedAt|}}
                on
                {{moment-format publishedAt "D MMM YYYY"}}
                at
                {{moment-format publishedAt "HH:mm"}}.
            {{/let}}
        </p>
    </GhCanvasHeader>

    <h4 class="gh-main-section-header small bn">
        Engagement
    </h4>
    <div class="gh-post-analytics-box">
        <div class="gh-post-analytics-item">
            <h3>{{format-number this.post.email.emailCount}}</h3>
            <p>Sent</p>
        </div>
        <div class="gh-post-analytics-item">
            <h3>{{this.post.email.openRate}}%</h3>
            <p><strong>{{format-number this.post.email.openedCount}}</strong> opened</p>
        </div>
        <div class="gh-post-analytics-item">
            <h3>{{this.post.clickRate}}%</h3>
            <p><strong>{{format-number this.post.count.clicks}}</strong> clicked</p>
        </div>
        <div class="gh-post-analytics-item">
            <h3>{{format-number this.post.count.signups}}</h3>
            <p>Free {{gh-pluralize this.post.count.signups "signup" without-count=true}}</p>
        </div>
        <div class="gh-post-analytics-item">
            <h3>{{format-number this.post.count.conversions}}</h3>
            <p>Paid {{gh-pluralize this.post.count.conversions "conversion" without-count=true}}</p>
        </div>
    </div>

    <h4 class="gh-main-section-header small bn">
        Link clicks
    </h4>
    <div class="gh-post-analytics-box column">
        <div class="gh-links-list">
            <div class="gh-links-list-item">
                <a href="#">https://vanschneider.com/blog/#/portal/signup</a>
                <p class="gh-links-list-clicks">18</p>
            </div>
            <div class="gh-links-list-item">
                <a href="#">https://vanschneider.com/blog/an-unsolicited-portfolio-review-featuring-2/</a>
                <p class="gh-links-list-clicks">16</p>
            </div>
            <div class="gh-links-list-item">
                <a href="#">https://vanschneider.com/blog/#/portal/unsubscribe</a>
                <p class="gh-links-list-clicks">3</p>
            </div>
            <div class="gh-links-list-item">
                <a href="#">https://vanschneider.com/blog/#/portal/signin</a>
                <p class="gh-links-list-clicks">0</p>
            </div>
        </div>
    </div>

    {{#if (feature 'sourceAttribution')}}
        <h4 class="gh-main-section-header small bn" {{did-insert this.loadData}}>
            Source attribution
        </h4>
        {{#if this.sources}}
            <div class="gh-post-analytics-box resources">
                <div style="display: grid;
                    grid-template-columns: 2fr 1fr;
                    grid-gap: 64px;
                ">
                    <MemberAttribution::SourceAttributionTable @sources={{this.sources}} />

                    <div style="border-left: 1px solid #eceef0; padding-left: 48px;display: flex;justify-content: center;align-items: center;">
                        <div style="max-width: 200px;">
                            <MemberAttribution::SourceAttributionChart @sources={{this.sources}} />
                        </div>
                    </div>
                </div>
            </div>
        {{/if}}
    {{/if}}

    <h4 class="gh-main-section-header small bn">
        Get started with analytics
    </h4>
    <div class="gh-post-analytics-box resources">
        <div class="gh-post-analytics-resource">
            <div class="thumbnail" style="background-image: url(assets/img/marketing/analytics-1.jpg);"></div>
            <div class="flex flex-column justify-between">
                <div>
                    <h3>📈 Understand analytics in Ghost</h3>
                    <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p>
                </div>
                <div class="gh-btn gh-btn-link">Become an expert &rarr;</div>
            </div>
        </div>
        <div class="gh-post-analytics-resource">
            <div class="thumbnail" style="background-image: url(assets/img/marketing/analytics-2.jpg);"></div>
            <div class="flex flex-column justify-between">
                <div>
                    <h3>How to best share your shiz</h3>
                    <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p>
                </div>
                <div class="gh-btn gh-btn-link">Sharing is caring &rarr;</div>
            </div>
        </div>
    </div>
    
</section>