Interactive email template
Social feed embed
Load recent social posts in AMP so newsletter content feels fresh on open.
Social feed blocks help creators and brands keep recurring sends current.
Inbox preview
Static HTML rendering of the email body. Use it to check the layout before sending the live AMP version to a test inbox.
Mailneo demo <hello@mailneo.co>
10:42 AM (2 min ago)
Social feed embed
to me · interactive email
code snippets
<!doctype html>
<html amp4email>
<head>
<meta charset="utf-8" />
<script async src="https://cdn.ampproject.org/v0.js"></script>
<script async custom-element="amp-list" src="https://cdn.ampproject.org/v0/amp-list-0.1.js"></script>
<script async custom-template="amp-mustache" src="https://cdn.ampproject.org/v0/amp-mustache-0.2.js"></script>
<style amp4email-boilerplate>body{visibility:hidden}</style>
<style amp-custom>
body { margin: 0; padding: 16px; font-family: Arial, Helvetica, sans-serif; background: #fff7ed; color: #1f2937; }
.card { max-width: 560px; margin: 0 auto; padding: 16px; border: 1px solid #fed7aa; border-radius: 12px; background: #ffffff; }
h1 { margin: 0 0 8px; font-size: 24px; line-height: 30px; }
.muted { color: #6b7280; font-size: 13px; line-height: 18px; }
.btn { display: inline-block; margin-top: 10px; padding: 10px 14px; border: 0; border-radius: 8px; background: #f97316; color: #ffffff; text-decoration: none; font-weight: 700; cursor: pointer; }
.pill { display: inline-block; margin-right: 8px; margin-bottom: 8px; padding: 4px 9px; border-radius: 999px; border: 1px solid #fdba74; background: #fff7ed; font-size: 12px; }
.item { padding: 10px; border: 1px solid #fed7aa; border-radius: 10px; margin-top: 8px; }
</style>
<title>Social feed embed</title>
</head>
<body>
<section class="card">
<h1>From our social channels</h1>
<p class="muted">Latest posts are loaded when this email opens.</p>
<amp-list width="auto" height="250" layout="fixed-height" src="https://amp.mailneo.co/demo/social-feed">
<template type="amp-mustache">
<div class="item">
<p style="margin:0;font-weight:700;">@{{handle}}</p>
<p class="muted" style="margin:6px 0 0;">{{text}}</p>
</div>
</template>
<div placeholder class="muted">Loading posts...</div>
</amp-list>
</section>
</body>
</html>AMP components used
use cases
Creator newsletter
Reuse latest social snippets without rebuilding each send.
Industry: Media
Brand community recap
Highlight top engagement moments from owned channels.
gotchas
Content moderation
Filter replies and user-generated text before feed publication.
Platform terms
Follow API usage and branding guidelines for each social platform.
conversion uplift data
No conversion benchmark was attached to this template yet.