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

<section class="gh-canvas" {{did-insert this.loadData}}>

    <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}}<sup>%</sup></h3>
            <p><strong>{{format-number this.post.email.openedCount}}</strong> opened</p>
        </div>
        <div class="gh-post-analytics-item">
            <h3>{{this.post.clickRate}}<sup>%</sup></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>{{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><span class="hide-when-small">Paid </span>{{gh-pluralize this.post.count.conversions "conversion" without-count=true}}</p>
        </div>
    </div>

    {{#if (and this.links this.links.length) }}
    <h4 class="gh-main-section-header small bn">
        Link clicks
    </h4>
        <div class="gh-post-analytics-box column">
            <div class="gh-links-list">
                {{#each this.links as |link|}}
                    <div class="gh-links-list-item">
                        <a href="{{link.link.to}}">{{link.link.title}}</a>
                        <p class="gh-links-list-clicks">{{link.count.clicks}}</p>
                    </div>
                {{/each}}
            </div>
        </div>
    {{/if}}

    {{#if (and (feature 'sourceAttribution') this.sources this.sources.length)}}
        <h4 class="gh-main-section-header small bn">
            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>