How to add a LinkedIn feed to an Astro site
In Astro, paste the widget <div> into a page or component and load embed.js with the is:inline directive, so Astro outputs the script exactly as written. If you use view transitions, re-mount widgets on the astro:page-load event.
Step-by-step: add a LinkedIn widget to Astro
- 1
Create your LinkedIn widget
Sign up for free, click New widget, choose Person or Company, and paste your LinkedIn profile or company page URL.
- 2
Customize and copy the embed code
Pick a widget (posts feed, profile card, company page, jobs, recommendations, certifications or projects), match your brand, then open the Integration tab and copy the code.
- 3
Add the placeholder
Paste the widget <div> into the .astro page or component where it should appear. Astro templates accept the class attribute as in plain HTML.
- 4
Load the script without processing
Add <script is:inline src="https://www.linkedinembed.com/embed.js" async></script>. Astro doesn't process a script that has attributes other than src, and is:inline makes that explicit.
- 5
Handle view transitions
Using <ClientRouter />? Add a script that calls window.LinkedEmbed?.mount() on the astro:page-load event, which fires on the first load and after every navigation.
Your embed code looks like this
Copy the exact code, with your widget ID, from the Integration tab in the LinkedInEmbed dashboard.
<div class="linkedembed-widget" data-widget-id="YOUR_WIDGET_ID"></div>
<script src="https://www.linkedinembed.com/embed.js" async></script>Tips for Astro
- Put the script tag in a shared layout once if several pages use widgets. Each page then only needs its own <div>.
- The widget loads in the browser, so a static Astro build doesn't need a rebuild to show new LinkedIn posts.
- No client: directive is needed, because the widget isn't a framework component.
- Prefer no JavaScript on a page? Use the iframe snippet instead; it needs no script.
Widget not showing or not updating? Read the troubleshooting guide.
Ready to add LinkedIn to Astro?
Create your widget for free and get your embed code.
Sources
Astro steps checked against its documentation on October 31, 2026.
LinkedIn on Astro: FAQ
Why did Astro bundle or change my script tag?
Astro processes plain <script> tags by default. A script with any attribute besides src, or with is:inline, is rendered exactly as written, which is what the embed script needs.
Why do widgets disappear after navigating with view transitions?
With <ClientRouter />, pages change without a full reload. Listen for astro:page-load and call window.LinkedEmbed?.mount() so new widget placeholders render.
Do I need to rebuild my Astro site to show new LinkedIn posts?
No. Widget content loads separately from your pages and refreshes on its own schedule, so your static build stays the same.
Which LinkedIn widget will you add to Astro?
Every widget uses the same embed code, so the steps above work for all of them.
Put your LinkedIn on your website today
Create your first widget in about two minutes. Free plan, no credit card required.