Adding a Recommendation / Affiliate Card

You can drop a styled "recommendation" box into any article on your site (a blog post, a page, or a docs article) to highlight a product or an affiliate link. The card uses a small set of CSS classes that ship with your site, so you only paste the markup and it is styled automatically in your theme colours.

What it looks like

Here is a live example of the card:

How to add it

1. Open the article in the editor (Blog, Pages, or Docs).
2. Click the Code (source) button in the editor toolbar (the < > icon).
3. Paste the markup below where you want the card to appear, then change the text and the link.
4. Save. The card shows up styled on the page.

Copy this markup

<div class="nmq-aff">
  <div class="nmq-aff-badge">Recommended</div>
  <h3 class="nmq-aff-title">Your headline</h3>
  <p>Your description text.</p>
  <a class="nmq-aff-btn" href="https://your-affiliate-link" target="_blank" rel="noopener nofollow sponsored">Your button &#8594;</a>
</div>

Simplest version (just a box and a button)

<div class="nmq-aff">
  <p>We recommend <strong>Hostinger</strong> for fast, affordable hosting.</p>
  <a class="nmq-aff-btn" href="https://www.hostinger.com?REFERRALCODE=NUMROQ20" target="_blank" rel="noopener nofollow sponsored">Get 20% off &#8594;</a>
</div>

Tips

• The nmq-aff-badge and nmq-aff-title lines are optional. Remove them for a simpler card.
• Always keep rel="noopener nofollow sponsored" on affiliate links. It is the correct, search-engine-friendly way to mark a paid link.
• You can add several cards in one article (for example a "top hosting providers" post), each with its own link.
• The card uses your secondary theme colour, so it matches your brand automatically.