Astro LinkSplash is a splash page template built on Astro 4 and Tailwindcss. It serves as a versatile starting template to create your own linktree-styled landing page. You can view a live demo of the template here.
To set up the template, you can either fork or clone the repository. Getting started with Astro is as simple as running two commands.
npm install
npm run dev
Important
Modifying all content in this template can be done through a single configuration file: /src/content.ts
.
This file contains a global variables for all text and images on the site, it's also where you add your links. All variables are typed to help with proper formatting. Below is a list of all configuration variables found in the file.
CONFIG VAR | DESCRIPTION |
---|---|
TITLE |
Name or title of page |
DESCRIPTION |
Short description under the title |
LOCATION |
Optional location tag with icon |
GENDER |
Optional gender tag with icon |
PROFILE_IMAGE |
Profile image above title (size 128x128) |
BANNER |
Full width banner. Either hex color code or image (height of 320px) |
THEME |
Set theme to light or dark |
LINKS |
Array where you add sections of links |
Check the Astro Documentation for comprehensive tutorials on deploying your Astro project to various hosting platforms.
If you'd like, you can test a local production-ready build of your site by running the following command:
npm run build
If you find any issues or have suggestions for improvements, feel free to open an issue or submit a pull request. Any type of contributions are welcome!
Licensed under the MIT license — see the LICENSE file for details.