98Course share & footer CTA

The two blocks that close a course page. Share is a row of real links with the network named, never an icon soup. The footer CTA is the page's last argument — one action, one line of fine print, and nothing else competing with it.

Use it for

The end of a course, module or lesson page
Share on anything a learner might send to a colleague

Not for

A share dialog with twelve networks — ship the three people actually use here, and a copy-link
Two CTAs. A page with two last arguments has none

Share row

markup

<div class="ns-share" style="inline-size:100%">
  <span class="ns-share__label">Share this course</span>
  <a class="ns-btn ns-btn--outline ns-btn--sm" href="#0"><i class="ph ph-linkedin-logo" aria-hidden="true"></i> LinkedIn</a>
  <a class="ns-btn ns-btn--outline ns-btn--sm" href="#0"><i class="ph ph-x-logo" aria-hidden="true"></i> X</a>
  <a class="ns-btn ns-btn--outline ns-btn--sm" href="#0"><i class="ph ph-envelope-simple" aria-hidden="true"></i> Email</a>
  <button type="button" class="ns-btn ns-btn--quiet ns-btn--sm" data-copy><i class="ph ph-link-simple" aria-hidden="true"></i> Copy link</button>
</div>

Footer CTA

The last thing on the page. One action, and the fine print answers the question that stops people clicking it.

Ready when you are

Start Apex basics

Twelve lessons, three hours forty, and a bulk-safe trigger you wrote yourself at the end of it.

Enrol — $49 Watch a free lesson

Lifetime access · certificate on completion · 14-day refund, no questions

markup

<section class="ns-band ns-band--sunken" style="inline-size:100%">
  <div class="ns-band__inner">
    <div class="ns-cta">
      <span class="ns-kicker">Ready when you are</span>
      <h2 class="ns-band__title">Start Apex basics</h2>
      <p class="ns-band__lede">Twelve lessons, three hours forty, and a bulk-safe trigger you wrote yourself at the end of it.</p>
      <div class="ns-cta__actions">
        <a class="ns-btn ns-btn--primary ns-btn--lg" href="#0">Enrol — $49</a>
        <a class="ns-btn ns-btn--outline ns-btn--lg" href="#0">Watch a free lesson</a>
      </div>
      <p class="ns-cta__fine">Lifetime access · certificate on completion · 14-day refund, no questions</p>
    </div>
  </div>
</section>

Accessibility contract

Each share control names the destination ("Share on LinkedIn"), because the glyph is not a label
Copy-link confirms in text, not only by changing colour
The CTA is one <a> — a div that navigates is not a link