https://github.com/flo-bit/blog-template
minimalistic astro blog template
https://github.com/flo-bit/blog-template
astro blog template
Last synced: about 1 month ago
JSON representation
minimalistic astro blog template
- Host: GitHub
- URL: https://github.com/flo-bit/blog-template
- Owner: flo-bit
- License: mit
- Created: 2024-10-25T23:01:37.000Z (7 months ago)
- Default Branch: main
- Last Pushed: 2025-03-23T19:50:56.000Z (about 2 months ago)
- Last Synced: 2025-03-23T20:33:49.925Z (about 2 months ago)
- Topics: astro, blog, template
- Language: Astro
- Homepage: http://flo-bit.dev/blog-template/
- Size: 5.54 MB
- Stars: 44
- Watchers: 1
- Forks: 8
- Open Issues: 5
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
[
](https://flo-bit.dev/blog-template/)
# astro blog template
minimalistic but opinionated blog template using [astro](https://astro.build/) and [svelte](https://svelte.dev/). aims to be super easy to deploy and use, with a focus on performance and SEO, ease-of-use and design.
See a [live demo here](https://flo-bit.dev/blog-template/) (also doubles as a tutorial on how to use this template).
Features:
- ✅ 100/100 Lighthouse performance
- ✅ SEO-friendly with canonical URLs and OpenGraph data (automatically generated)
- ✅ Sitemap support
- ✅ RSS Feed support
- ✅ Markdown support
- ✅ Pagination
- ✅ Syntax highlighting (+ copy button)
- ✅ Dark and light mode with toggle button or auto-detect
- ✅ Search included
- ✅ Tags for posts
- ✅ Super easy to deploy as a static site
- ✅ Includes some prebuilt components for you to use
- ✅ Easy to edit by editing the markdown directly
- ✅ Comments and likes via bluesky
## tutorials
the demo blog doubles as a tutorial on how to use this template:
- [quick start with github pages](https://flo-bit.dev/blog-template/posts/how-to-use)
- [adding content](https://flo-bit.dev/blog-template/posts/adding-content)
- [comments and likes via bluesky](https://flo-bit.dev/blog-template/posts/comments-via-bluesky)
## quick start with github pages in 5 minutes
1. Fork [the repository of this blog](https://github.com/flo-bit/blog-template)
- Either name your fork `.github.io` if you want your blog to live at `.github.io`
- Or choose any other repo name and it will live at `.github.io/`
2. In your repository settings, set up github pages to deploy using github actions (_SETTINGS_ -> _PAGES_ -> _SOURCE_: **Github Actions**)
3. Set up your blog info in `src/config.ts`, most importantly the `SITE` and `BASE` variables:
- `SITE`: set to `https://.github.io`
- `BASE`: if repo name is `.github.io` set to `/`, otherwise set to `/`
4. Once you push your changes to main your blog should be live in about 1-2 minutes at
`.github.io` or `.github.io/`
5. Set up more info in `src/config.ts` (see [all options here](https://flo-bit.dev/blog-template/posts/configuring-the-blog))
- `SITE_TITLE` is the title of your blog, and will be shown in the header and in search results
- `SITE_DESCRIPTION` is the description of your blog, and will be shown e.g. in search results
- `SITE_FAVICON` is the emoji that will be shown as favicon of your blog (will be shown in the header and as favicon)
- `NAME` is the name of the author of the blog, will be shown in the footer as `(c) - LICENSE`
- `BLUESKY_IDENTIFIER` is your bluesky handle (without the `@`), this is needed for likes and comments to work
(see [comments via bluesky](https://flo-bit.dev/blog-template/posts/comments-via-bluesky))
- `SOCIAL_LINKS` set your social media links here, e.g. `{ BLUESKY_URL: "https://bsky.app/profile/flo-bit.dev" }`
will be shown in the footer of the blog
6. Edit `about.mdx` in `src/content/info/` to add your own about page.
7. Remove all files from `src/content/blog/` and add your own blog posts there. Time to write your first blog post!
(see [adding content](https://flo-bit.dev/blog-template/posts/adding-content) for more info)
8. Anytime you push to the main branch, your blog will automatically be updated (should usually take less than 2 minutes).
You can also go to the github actions tab to check the progress/status.
If you run into any issues, feel free to [open an issue](https://github.com/flo-bit/blog-template/issues) or
[contact me on bluesky](https://bsky.app/profile/flo-bit.dev)
## Notes
Search currently only works in production mode (i.e. when running `npm run build`) not in dev mode (`npm run dev`).
## Credits
Adopted from the default astro blog template when running `npm create astro@latest`.
## License
MIT.