gb/mercury
Template
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Activity Actions

Compare commits

base: gb:41e1a4abee144d0dcdcd950169533aafeea62dc9
Branches Tags
gb:master
...
compare: gb:7ff2d1fd6cfe164b32365793db91b88795cd8434
Branches Tags
gb:master

2 commits
41e1a4abee ... 7ff2d1fd6c

Author SHA1 Message Date
grassblock
7ff2d1fd6c feat: more friendly meta tags 2025-05-13 22:05:28 +08:00
grassblock
2c7b0edaf7 feat: custom navbar items and footer 2025-05-13 21:28:08 +08:00
5 changed files with 46 additions and 3 deletions
Download patch file Download diff file Expand all files Collapse all files

21
src/components/helper/head/Meta.astro Normal file
View file

@ -0,0 +1,21 @@
---
const { title, description, ogImage = "" } = Astro.props
const canonicalURL = new URL(Astro.url.pathname, Astro.site);
---
<meta name="title" content={title} />
<meta name="description" content={description} />
{/* Open Graph / Facebook */}
<meta name="og:title" content={title} />
<meta name="og:description" content={description} />
{ogImage && <meta name="og:image" content={ogImage} />}
<meta property="og:locale" content="en_US"/>
<meta property="og:type" content="website" />
<meta property="og:url" content={canonicalURL} />
{/* Twitter */}
<meta name="twitter:card" content="summary"></meta>
<meta name="twitter:title" content={title} />
<meta name="twitter:description" content={description} />
{ogImage && <meta name="twitter:image" content={ogImage} />}

13
src/config.ts
View file

@ -1,6 +1,19 @@
export const siteConfig = {
// site meta info
title: '/var/log/mercury',
description: 'A blog about software development, technology, and life.',
homepageOgImage: '',
// site components
navBarItems: [
// additional items in the navbar
// the order of the items will be the same as the order in the array
// format is { text: string, link: string }
{ text: "RSS", link: "/rss.xml" },
{ text: "GitHub", link: "https://github.com/GrassBlock1/mercury" },
],
// footer
// yes you can write html safely here
customFooter: '<i>I have no mouth, and I must SCREAM</i>',
comments: {
type: 'fediverse', // 'artalk','giscus','fediverse','hatsu'
artalk: {

12
src/layouts/Layout.astro
View file

@ -4,16 +4,21 @@ import Search from '../components/Search.astro';
import ThemeSwitcher from '../components/ThemeSwitcher.astro';
import BackToTop from "../components/BackToTop.astro";
import { siteConfig } from "../config";
import Meta from "../components/helper/head/Meta.astro";
interface Props {
title: string;
description: string;
path?: string;
}
const defaultTitle = siteConfig.title
const formattedPath = defaultTitle.toLowerCase().replace(/\s+/g, '-');
const { title, path = formattedPath } = Astro.props;
const navBarItems = siteConfig.navBarItems
const customFooter = siteConfig.customFooter
const { title, path = formattedPath, description = siteConfig.description } = Astro.props;
// TODO: make the path dynamic
---
@ -24,6 +29,7 @@ const { title, path = formattedPath } = Astro.props;
<meta name="viewport" content="width=device-width" />
<link rel="icon" type="image/svg+xml" href="/favicon.svg" />
<meta name="generator" content={Astro.generator} />
<Meta title={title} description={description}/>
<title>{title}</title>
</head>
<body>
@ -36,6 +42,7 @@ const { title, path = formattedPath } = Astro.props;
<nav class="nav">
<a href="/">Home</a>
<a href="/blog">Blog</a>
{navBarItems.map((item) => <a href={item.link}>{item.text}</a>)}
</nav>
<Search />
@ -52,7 +59,8 @@ const { title, path = formattedPath } = Astro.props;
<ThemeSwitcher/>
</div>
<div class="container">
Powered by <a href="https://git.gb0.dev/gb/mercury"><img src="/mercury.svg" width="16px" alt="mercury logo" /> mercury</a>
<Fragment set:html={customFooter} />
<p>Powered by <a href="https://git.gb0.dev/gb/mercury"><img src="/mercury.svg" width="16px" alt="mercury logo" /> mercury</a></p>
</div>
</footer>
</body>

2
src/pages/[...slug].astro
View file

@ -13,7 +13,7 @@ const { Content } = await entry.render();
---
<Layout title={`${entry.data.title} | Terminal Blog`} path={`/var/log/${entry.slug}`}>
<Layout title={`${entry.data.title} | Terminal Blog`} path={`/var/log/${entry.slug}`} description={entry.data.description} >
<h1 class="post-title">{entry.data.title}</h1>
<div class="post-content">
<Content/>

1
src/pages/post/[...slug].astro
View file

@ -19,6 +19,7 @@ const slug = Astro.params.slug;
<Layout
title={entry.data.title}
path={`~/grassblock/micr0blog/blog/${slug}`}
description={entry.data.description}
>
<h1 class="post-title">{entry.data.title}</h1>
<span class="post-date">{new Date(entry.data.pubDate).toISOString().split('T')[0]}</span>