Show your last 5 subscribers

The loop

[[[foreach:subscribers as sub]]]
  <div class="sub-row">[[[sub.user_name]]]</div>
[[[endforeach]]]

sub is a name you picked. Use the same one inside the loop.

Getting five, not all of them

The loop renders every subscriber it is given, so the number on screen is a setting, not something you write in the template. Set Foreach caps on your account settings to 5 and the list arrives with five in it.

This is the part people get wrong: there is no foreach:subscribers limit 5. The cap is applied server-side before the overlay ever sees the array, which is also why raising it costs you nothing in the template.

A row worth looking at

Each subscriber carries more than a name:

[[[foreach:subscribers as sub]]]
  <div class="sub-row">
    <img class="sub-avatar" src="[[[sub.user_profile_image_url]]]" alt="" />
    <span class="sub-name">[[[sub.user_name]]]</span>
    <span class="sub-tier">[[[sub.plan_name]]]</span>
  </div>
[[[endforeach]]]

<style>
  .sub-row {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 8px 0;
    font-family: 'Albert Sans', sans-serif;
    color: #fff;
    text-shadow: 0 2px 4px rgba(0, 0, 0, 0.8);
  }
  .sub-avatar {
    width: 34px;
    height: 34px;
    border-radius: 50%;
  }
  .sub-name {
    font-weight: 700;
  }
  .sub-tier {
    margin-left: auto;
    font-size: 13px;
    opacity: 0.75;
  }
</style>

Crediting the gifter

A gifted sub has two people in it, and showing only the recipient quietly drops the one who paid:

[[[foreach:subscribers as sub]]]
  <div class="sub-row">
    <span class="sub-name">[[[sub.user_name]]]</span>
    [[[if:sub.is_gift]]]
      <span class="sub-gift">gifted by [[[sub.gifter_name]]]</span>
    [[[endif]]]
  </div>
[[[endforeach]]]

Styling by tier

[[[sub.tier]]] is a value you can compare, so a Tier 3 sub can look different from a Prime one:

[[[foreach:subscribers as sub]]]
  [[[if:sub.tier = 3000]]]
    <div class="sub-row tier-3">[[[sub.user_name]]]</div>
  [[[elseif:sub.tier = Prime]]]
    <div class="sub-row tier-prime">[[[sub.user_name]]]</div>
  [[[else]]]
    <div class="sub-row">[[[sub.user_name]]]</div>
  [[[endif]]]
[[[endforeach]]]

You can also put the tier straight into a class and do the whole thing in CSS, which stays readable as the list of cases grows:

<div class="sub-row tier-[[[sub.tier]]]">[[[sub.user_name]]]</div>

When there are none

An empty list renders as nothing at all, which is usually what you want. If the surrounding heading should disappear too, test the count first:

[[[if:subscribers_total]]]
  <h2>Recent subscribers</h2>
  [[[foreach:subscribers as sub]]]
    <div class="sub-row">[[[sub.user_name]]]</div>
  [[[endforeach]]]
[[[endif]]]

Where next

• Show your latest follower - single values and the empty case
• Show chat on screen - the other big foreach loop
• Conditional and Event Tags - the full foreach and conditional reference