Share Your Links

Share Your Links is an Astro-powered link-in-bio template that renders all your social media and website links on a single, customizable page. Built by SofiDev and listed on the Astro Themes portal, this MIT-licensed project lets you maintain your link collection in one JavaScript data file and publish it as a fast static site.

What is Share Your Links?

Share Your Links is a starter template for building a "link in bio" or "all my links" page with Astro. It takes as input a user-editable JavaScript array of items, each with a title, a destination URL, and an Iconify icon identifier, and produces a static web page with a clean, icon-based list of clickable links. The template runs on the Astro framework, uses custom CSS for styling, and is distributed through the Astro Themes portal and the repository SofiDevO/allmylinks.

Key Features

• Astro framework — The site is built with Astro, generating static HTML output via npm run build and offering a development server with npm run dev.
• Iconify integration — Icons are loaded from the Iconify CDN by specifying an icon identifier like logos:react in the data file, and a single script tag in the HTML head enables them.
• Data-driven links — All links live in the userLinks array inside src/data.js; each object stores a title, a link URL, and an icon string, so no HTML editing is needed to update your links.
• One-command scaffolding — You can start a new project with npm create astro@latest -- --template SofiDevO/allmylinks, avoiding manual cloning.
• Standard npm workflow — The template includes scripts for development (npm run dev), production build (npm run build), preview (npm run preview), and the Astro CLI (npm run astro).
• MIT license — The project is released under the MIT License, permitting free use, modification, and redistribution.

Who is it for?

• Content creators and influencers who want a single, branded page to point their audience to all their social media profiles at once.
• Developers new to Astro who want a minimal, commented project structure to study how data files drive page content.
• Personal brands and freelancers who need a lightweight contact hub combining a website, blog, portfolio, and email link in one place.

What can you do with Share Your Links?

• Showcase social profiles: Add entries for YouTube, Instagram, X, or any platform by using the corresponding Iconify icon identifier and your profile URL.
• Create a contact page: Use a mailto: link in the link field, for example mailto:[email protected], to let visitors start an email directly from the page.
• Learn Astro + Iconify: Use the template as a hands-on example of integrating an external icon library with a CDN script and mapping data to UI components.

How does Share Your Links work?

The workflow is data-driven. First, install dependencies with npm install after cloning or scaffolding the repo. Next, open src/data.js and edit the userLinks array, changing the title, link, and icon properties for each item. Finally, run npm run dev to preview changes locally or npm run build to generate a deployable static site; the Iconify script in the HTML head renders the icons client-side by fetching them from the CDN.