flo-bit.dev
[READ-ONLY] Mirror of https://github.com/flo-bit/blog-template. minimalistic astro blog template
flo-bit.dev/blog-template/
astro
blog
template
update readme
author
Florian
date
(Mar 23, 2025, 8:50 PM +0100)
commit
5e15dad4
5e15dad43f29c33f5fcb2004939fe3f0661f4e62
parent
70943118
70943118b77d4785d7d83d6abba4b48bcd15064a
+37
-12
+34
-9
README.md
+34
-9
README.md
···
21
21
- ✅ Super easy to deploy as a static site
22
22
- ✅ Includes some prebuilt components for you to use
23
23
- ✅ Easy to edit by editing the markdown directly
24
+
- ✅ Comments and likes via bluesky
24
25
25
26
## tutorials
26
27
27
28
the demo blog doubles as a tutorial on how to use this template:
28
29
29
-
- [minimal setup with github pages](https://flo-bit.dev/blog-template/posts/how-to-use)
30
+
- [quick start with github pages](https://flo-bit.dev/blog-template/posts/how-to-use)
30
31
31
32
- [adding content](https://flo-bit.dev/blog-template/posts/adding-content)
32
33
33
-
- [supported markdown features](https://flo-bit.dev/blog-template/posts/markdown-style-guide)
34
+
- [comments and likes via bluesky](https://flo-bit.dev/blog-template/posts/comments-via-bluesky)
35
+
36
+
## quick start with github pages in 5 minutes
34
37
35
-
## Minimal setup with github pages
38
+
1. Fork [the repository of this blog](https://github.com/flo-bit/blog-template)
36
39
37
-
1. Fork this repository by clicking on "Use template" (note: this repository per default uses github actions which are only free for public repositories).
40
+
- Either name your fork `<github-username>.github.io` if you want your blog to live at `<github-username>.github.io`
41
+
42
+
- Or choose any other repo name and it will live at `<github-username>.github.io/<repo-name>`
38
43
39
44
2. In your repository settings, set up github pages to deploy using github actions (_SETTINGS_ -> _PAGES_ -> _SOURCE_: **Github Actions**)
40
45
41
-
3. Set up your blog info in `src/config.ts` (most importantly change `SITE` to your deployment url, e.g. for github pages `https://<your-github-username>.github.io/` and `BASE` to your base path, e.g. for github pages `/<your-repo-name>`)
46
+
3. Set up your blog info in `src/config.ts`, most importantly the `SITE` and `BASE` variables:
47
+
48
+
- `SITE`: set to `https://<github-username>.github.io`
49
+
- `BASE`: if repo name is `<github-username>.github.io` set to `/`, otherwise set to `/<repo-name>`
50
+
51
+
4. Once you push your changes to main your blog should be live in about 1-2 minutes at
52
+
`<github-username>.github.io` or `<github-username>.github.io/<repo-name>`
53
+
54
+
5. Set up more info in `src/config.ts` (see [all options here](https://flo-bit.dev/blog-template/posts/configuring-the-blog))
55
+
56
+
- `SITE_TITLE` is the title of your blog, and will be shown in the header and in search results
57
+
- `SITE_DESCRIPTION` is the description of your blog, and will be shown e.g. in search results
58
+
- `SITE_FAVICON` is the emoji that will be shown as favicon of your blog (will be shown in the header and as favicon)
59
+
- `NAME` is the name of the author of the blog, will be shown in the footer as `(c) <YEAR> <NAME> - LICENSE`
60
+
- `BLUESKY_IDENTIFIER` is your bluesky handle (without the `@`), this is needed for likes and comments to work
61
+
(see [comments via bluesky](https://flo-bit.dev/blog-template/posts/comments-via-bluesky))
62
+
- `SOCIAL_LINKS` set your social media links here, e.g. `{ BLUESKY_URL: "https://bsky.app/profile/flo-bit.dev" }`
63
+
will be shown in the footer of the blog
42
64
43
-
4. Your blog should be live in about 1 minute at `https://<your-github-username>.github.io/<your-repo-name>`
65
+
6. Edit `about.mdx` in `src/content/info/` to add your own about page.
44
66
45
-
5. Add your blog posts in `src/content/blog/`
67
+
7. Remove all files from `src/content/blog/` and add your own blog posts there. Time to write your first blog post!
68
+
(see [adding content](https://flo-bit.dev/blog-template/posts/adding-content) for more info)
46
69
47
-
6. Add your info in `src/content/info/`:
70
+
8. Anytime you push to the main branch, your blog will automatically be updated (should usually take less than 2 minutes).
71
+
You can also go to the github actions tab to check the progress/status.
48
72
49
-
- `about.md` is used for the about page
73
+
If you run into any issues, feel free to [open an issue](https://github.com/flo-bit/blog-template/issues) or
74
+
[contact me on bluesky](https://bsky.app/profile/flo-bit.dev)
50
75
51
76
## Notes
52
77
+3
-3
src/content/blog/configuring-the-blog.mdx
+3
-3
src/content/blog/configuring-the-blog.mdx
···
38
38
39
39
## BASE_COLOR
40
40
41
-
shade of gray for the background one of 'gray', 'neutral', 'stone', 'zinc', 'slate'
41
+
shade of gray for the background one of `gray`, `neutral`, `stone`, `zinc`, `slate`
42
42
43
43
(see [tailwind css colors](https://tailwindcss.com/docs/customizing-colors))
44
44
45
45
## ACCENT_COLOR
46
46
47
47
color of links, etc.
48
-
one of 'red', 'orange', 'amber', 'yellow', 'lime', 'green', 'emerald', 'teal',
49
-
'cyan', 'sky', 'blue', 'indigo', 'violet', 'purple', 'fuchsia', 'pink', 'rose'
48
+
one of `red`, `orange`, `amber`, `yellow`, `lime`, `green`, `emerald`, `teal`,
49
+
`cyan`, `sky`, `blue`, `indigo`, `violet`, `purple`, `fuchsia`, `pink`, `rose`
50
50
51
51
(see [tailwind css colors](https://tailwindcss.com/docs/customizing-colors))
52
52