Add a Free Mockup Generator to Your Website
Embed our social media mockup tool on your blog, resource page, or website. Give your visitors a valuable free tool — no coding required.
Why Embed Our Mockup Widget?
Increase Engagement
Interactive tools keep visitors on your site longer. Average session duration increases 3.2x with embedded tools.
Add Value to Content
Turn blog posts about social media into interactive experiences. Readers can create mockups right from your article.
100% Free Forever
No API keys, no rate limits, no paid tiers. The embeddable widget is completely free for any website to use.
Live Preview
This is exactly what the embedded widget looks like on your site.
Showing LinkedIn widget preview. All platforms available — see embed codes below.
Perfect For
Marketing blogs writing about social media strategies
Digital agency websites offering tools to visitors
Social media courses and educational platforms
WordPress resource pages about content creation
Freelancer portfolios showcasing social media expertise
SaaS product pages that complement social media tools
Community forums about digital marketing
Email marketing guides with interactive examples
Copy Your Embed Code
Choose a widget type, pick iframe or JavaScript embed, and paste it into your HTML.
All Platforms
LinkedIn, Instagram, Twitter/X, and Facebook in one widget
<iframe src="https://aipostmockup.com/widget"
width="100%" height="750" frameborder="0"
style="border:none;border-radius:12px;box-shadow:0 4px 24px rgba(0,0,0,0.08);"
allow="clipboard-write"
title="Social Media Mockup Generator - AIPostMockup">
</iframe>
<p style="font-size:12px;text-align:center;margin-top:8px;color:#64748b;">
Powered by <a href="https://aipostmockup.com" target="_blank" rel="noopener"
style="color:#7c3aed;text-decoration:none;font-weight:500;">AIPostMockup</a>
— Free Social Media Mockup Generator
</p><div id="aipostmockup-widget"></div>
<script>
(function() {
var iframe = document.createElement('iframe');
iframe.src = 'https://aipostmockup.com/widget';
iframe.width = '100%';
iframe.height = '750';
iframe.frameBorder = '0';
iframe.allow = 'clipboard-write';
iframe.title = 'Social Media Mockup Generator - AIPostMockup';
iframe.style.cssText = 'border:none;border-radius:12px;box-shadow:0 4px 24px rgba(0,0,0,0.08);';
document.getElementById('aipostmockup-widget').appendChild(iframe);
})();
</script>Use the JavaScript variant when your CMS strips iframe tags, or when you need dynamic injection.
LinkedIn Post Mockup
LinkedIn-specific post preview and mockup generator
<iframe src="https://aipostmockup.com/widget/linkedin"
width="100%" height="680" frameborder="0"
style="border:none;border-radius:12px;box-shadow:0 4px 24px rgba(0,0,0,0.08);"
allow="clipboard-write"
title="LinkedIn Post Mockup Generator - AIPostMockup">
</iframe>
<p style="font-size:12px;text-align:center;margin-top:8px;color:#64748b;">
Powered by <a href="https://aipostmockup.com/widget/linkedin" target="_blank" rel="noopener"
style="color:#0077b5;text-decoration:none;font-weight:500;">AIPostMockup</a>
— Free LinkedIn Mockup Generator
</p><div id="aipostmockup-linkedin"></div>
<script>
(function() {
var iframe = document.createElement('iframe');
iframe.src = 'https://aipostmockup.com/widget/linkedin';
iframe.width = '100%';
iframe.height = '680';
iframe.frameBorder = '0';
iframe.allow = 'clipboard-write';
iframe.title = 'LinkedIn Post Mockup Generator - AIPostMockup';
iframe.style.cssText = 'border:none;border-radius:12px;box-shadow:0 4px 24px rgba(0,0,0,0.08);';
document.getElementById('aipostmockup-linkedin').appendChild(iframe);
})();
</script>Use the JavaScript variant when your CMS strips iframe tags, or when you need dynamic injection.
Instagram Post Mockup
Instagram feed post mockup generator
<iframe src="https://aipostmockup.com/widget/instagram"
width="100%" height="680" frameborder="0"
style="border:none;border-radius:12px;box-shadow:0 4px 24px rgba(0,0,0,0.08);"
allow="clipboard-write"
title="Instagram Post Mockup Generator - AIPostMockup">
</iframe>
<p style="font-size:12px;text-align:center;margin-top:8px;color:#64748b;">
Powered by <a href="https://aipostmockup.com/widget/instagram" target="_blank" rel="noopener"
style="color:#e1306c;text-decoration:none;font-weight:500;">AIPostMockup</a>
— Free Instagram Mockup Generator
</p><div id="aipostmockup-instagram"></div>
<script>
(function() {
var iframe = document.createElement('iframe');
iframe.src = 'https://aipostmockup.com/widget/instagram';
iframe.width = '100%';
iframe.height = '680';
iframe.frameBorder = '0';
iframe.allow = 'clipboard-write';
iframe.title = 'Instagram Post Mockup Generator - AIPostMockup';
iframe.style.cssText = 'border:none;border-radius:12px;box-shadow:0 4px 24px rgba(0,0,0,0.08);';
document.getElementById('aipostmockup-instagram').appendChild(iframe);
})();
</script>Use the JavaScript variant when your CMS strips iframe tags, or when you need dynamic injection.
Twitter / X Post Mockup
Twitter/X tweet mockup and preview tool
<iframe src="https://aipostmockup.com/widget/twitter"
width="100%" height="680" frameborder="0"
style="border:none;border-radius:12px;box-shadow:0 4px 24px rgba(0,0,0,0.08);"
allow="clipboard-write"
title="Twitter/X Post Mockup Generator - AIPostMockup">
</iframe>
<p style="font-size:12px;text-align:center;margin-top:8px;color:#64748b;">
Powered by <a href="https://aipostmockup.com/widget/twitter" target="_blank" rel="noopener"
style="color:#1da1f2;text-decoration:none;font-weight:500;">AIPostMockup</a>
— Free Twitter/X Mockup Generator
</p><div id="aipostmockup-twitter"></div>
<script>
(function() {
var iframe = document.createElement('iframe');
iframe.src = 'https://aipostmockup.com/widget/twitter';
iframe.width = '100%';
iframe.height = '680';
iframe.frameBorder = '0';
iframe.allow = 'clipboard-write';
iframe.title = 'Twitter/X Post Mockup Generator - AIPostMockup';
iframe.style.cssText = 'border:none;border-radius:12px;box-shadow:0 4px 24px rgba(0,0,0,0.08);';
document.getElementById('aipostmockup-twitter').appendChild(iframe);
})();
</script>Use the JavaScript variant when your CMS strips iframe tags, or when you need dynamic injection.
Facebook Post Mockup
Facebook feed post mockup and preview tool
<iframe src="https://aipostmockup.com/widget/facebook"
width="100%" height="680" frameborder="0"
style="border:none;border-radius:12px;box-shadow:0 4px 24px rgba(0,0,0,0.08);"
allow="clipboard-write"
title="Facebook Post Mockup Generator - AIPostMockup">
</iframe>
<p style="font-size:12px;text-align:center;margin-top:8px;color:#64748b;">
Powered by <a href="https://aipostmockup.com/widget/facebook" target="_blank" rel="noopener"
style="color:#1877f2;text-decoration:none;font-weight:500;">AIPostMockup</a>
— Free Facebook Mockup Generator
</p><div id="aipostmockup-facebook"></div>
<script>
(function() {
var iframe = document.createElement('iframe');
iframe.src = 'https://aipostmockup.com/widget/facebook';
iframe.width = '100%';
iframe.height = '680';
iframe.frameBorder = '0';
iframe.allow = 'clipboard-write';
iframe.title = 'Facebook Post Mockup Generator - AIPostMockup';
iframe.style.cssText = 'border:none;border-radius:12px;box-shadow:0 4px 24px rgba(0,0,0,0.08);';
document.getElementById('aipostmockup-facebook').appendChild(iframe);
})();
</script>Use the JavaScript variant when your CMS strips iframe tags, or when you need dynamic injection.
How to Install (3 Steps)
Choose Your Widget
Select which mockup generator you want to embed — all platforms or a specific one (LinkedIn, Instagram, Twitter/X, Facebook).
Copy the Embed Code
Click "Copy Code" on the iframe snippet above. It includes the iframe and a "Powered by" attribution link.
Paste Into Your Website
Add the code to any HTML page, WordPress post (use Custom HTML block), Wix (use Embed widget), or Squarespace (use Code block).
Platform-Specific Instructions
Gutenberg editor → Add Block → Custom HTML → paste code
Add App → Embed → HTML iFrame → paste code
Edit Block → Code → paste code
HTML card → paste code
Embed element → paste code
/embed → paste the widget URL directly
Online Store → Themes → Edit code → paste in page template
Paste anywhere inside your page's <body> tag
Ready to add value to your website?
Embed our free mockup generator and give your visitors an interactive tool they'll love.