To embed a tweet, open the public post on X's website, choose Embed post from its menu, and copy the code from the publish tool into an HTML-capable area of your site. Preview the published page. A rich embed needs more than a pasted screenshot or a visible URL.
If your result is only a link, begin with the editor and script checks below. If the original post is unavailable, changing the embed styling will not restore it.
Get current code from the official publish tool
- Open the exact post on
x.comin a browser. Check the author, date and surrounding conversation. - Open the post's more-options menu and choose Embed post, or enter its URL at publish.x.com.
- Choose the available appearance options. For a reply, decide whether the parent conversation is needed for context.
- Copy the generated code. Use the current output rather than a snippet from an old tutorial.
- Paste it into the appropriate embed/HTML block, save and inspect the public preview.
X's official embedding guide documents the web workflow. A post must be accessible; public embed code is not a route into protected or deleted originals.
Understand the two parts of a typical embed
The markup identifies the post; the platform's widget script turns supported markup into the richer presentation. The following is an anatomy example with a placeholder URL, not a working embed to publish unchanged:
<blockquote class="twitter-tweet">
<a href="https://x.com/ACCOUNT/status/POST_ID">Read the original post on X</a>
</blockquote>
<script async src="https://platform.twitter.com/widgets.js" charset="utf-8"></script>Replace the example with code generated for your actual post. Keep a meaningful link so readers have a fallback if scripts cannot load. If the site's template already loads the widget script, ask its maintainer how embeds are initialized before adding repeated script tags throughout the page.
For an article citing several posts, introduce each with your own explanation. An embed is supporting material; the reader should understand the main point even if the third-party component does not load.
Choose the correct block in a CMS
| Editor situation | What to try | What to verify |
|---|---|---|
| A dedicated X/Twitter embed block | Paste the post URL into that block. | The saved public page, not only the editor preview. |
| A Custom HTML or code-injection block | Paste official generated embed code where the platform permits it. | Whether the editor strips the script or rewrites markup. |
| A normal paragraph block | Switch to an embed-capable block. | That the URL was not treated as plain linked text. |
| Hosted builder with script restrictions | Use its supported integration or ask the administrator. | Plan/role restrictions and allowed code locations. |
These are editor choices, not a guarantee that every WordPress, Shopify or Squarespace account has identical controls. Themes, extensions, permissions and hosted plans can change what is accepted. Test one post on a staging or draft page before editing a whole collection.
Diagnose a failed embed in the right order
- Open the original. If it cannot be accessed normally, record that before changing the website.
- Inspect the saved page. Confirm the intended markup survived the editor. A preview can differ from the public page.
- Check the script. If only the fallback appears, the widget may be blocked, removed or not initialized.
- Check consent and blockers. A privacy setting, content blocker or site consent tool can intentionally prevent third-party resources loading.
- Check site policy. A developer can inspect browser network/console messages for script restrictions or failed requests.
- Check dynamic content. If an embed was added after the initial page load, the site may need its supported widget initialization.
Do not disable your site's security or consent controls just to make the card appear. Identify the blocked resource and use the site's approved integration. Preserve the readable fallback link while you investigate. X also maintains embedding troubleshooting guidance.
Check conversation context and mobile layout
Use the appearance controls available in the official publish output. Avoid covering the author name, editing the quoted text or presenting a generated screenshot as if it were an interactive platform embed.
Preview at a narrow phone width and a normal desktop width. Check that the post does not force horizontal scrolling, media fits its container, and the fallback link remains usable. If a surrounding layout has a fixed width, fix the container rather than assuming the post itself is too wide.
Check a reply with and without its parent context before choosing Hide Conversation. Removing the parent can make an otherwise accurate quotation misleading.
A timeline is a different component
For a stream rather than one post, use the official timeline workflow. X documents public profile and public List timelines. Configure the appropriate URL in the publish tool instead of pasting several post links and expecting an updating feed.
An oEmbed/API integration is another implementation path, not a requirement for a simple manual embed. If your CMS already handles it, use its supported mechanism. Developers should consult current platform documentation rather than copying an old API URL or assuming unlimited access.
Keep a fallback and check third-party loading
A rich embed loads a third-party component. Review it within your site's privacy and consent process; inserting one does not automatically make a site compliant with any law. A plain source link is a useful fallback where third-party content is withheld.
An embed is also not a permanent backup. If a post is removed or its accessibility changes, the rich content may stop rendering. For a record you need to retain, preserve the accessible material through an appropriate process and record the source URL and capture date.
Final publication check
Before publishing, confirm the right original, correct block, surviving markup, expected third-party loading, readable mobile layout and a working source link. Recheck the public page after saving, especially if caching or optimization plugins modify scripts.
If you need to locate the original first, use the old-post search guide. If it is already unavailable, use the evidence checklist rather than promising that an embed will recover it.