santhoshj/astro-website
1
0
Fork 0
Code Issues Pull Requests Actions 1 Packages Projects Releases Wiki Activity

blog umami fix

Browse Source
This commit is contained in:
Santhosh Janardhanan
2026-02-10 01:34:07 -05:00
parent f056e67eae
commit c1ab51a149
15 changed files with 330 additions and 18 deletions
Download Patch File Download Diff File Expand all files Collapse all files

14
site/src/components/BlogPostCard.astro
View File

@@ -3,9 +3,11 @@ import type { WordpressPost } from "../lib/content/types";
type Props = {
post: WordpressPost;
placement: string;
targetId: string;
};
const { post } = Astro.props;
const { post, placement, targetId } = Astro.props;
function truncate(s: string, n: number) {
if (!s) return "";
@@ -15,11 +17,17 @@ function truncate(s: string, n: number) {
}
---
<a class="blog-card" href={`/blog/post/${post.slug}`}>
<a
class="blog-card"
href={`/blog/post/${post.slug}`}
data-umami-event="click"
data-umami-event-target_id={targetId}
data-umami-event-placement={placement}
data-umami-event-target_url={`/blog/post/${post.slug}`}
>
{post.featuredImageUrl ? <img src={post.featuredImageUrl} alt="" loading="lazy" /> : null}
<div class="blog-card-body">
<h3 class="blog-card-title">{post.title}</h3>
<p class="blog-card-excerpt">{truncate(post.excerpt || "", 180)}</p>
</div>
</a>

28
site/src/components/BlogSecondaryNav.astro
View File

@@ -10,16 +10,36 @@ const { categories, activeCategorySlug } = Astro.props;
---
<nav class="subnav" aria-label="Blog categories">
<a class={!activeCategorySlug ? "active" : ""} href="/blog">
<a
class={!activeCategorySlug ? "active" : ""}
href="/blog"
data-umami-event="click"
data-umami-event-target_id="blog.subnav.all"
data-umami-event-placement="blog.subnav"
data-umami-event-target_url="/blog"
>
All
</a>
<a class={activeCategorySlug === "__pages" ? "active" : ""} href="/blog/pages">
<a
class={activeCategorySlug === "__pages" ? "active" : ""}
href="/blog/pages"
data-umami-event="click"
data-umami-event-target_id="blog.subnav.pages"
data-umami-event-placement="blog.subnav"
data-umami-event-target_url="/blog/pages"
>
Pages
</a>
{categories.map((c) => (
<a class={activeCategorySlug === c.slug ? "active" : ""} href={`/blog/category/${c.slug}`}>
<a
class={activeCategorySlug === c.slug ? "active" : ""}
href={`/blog/category/${c.slug}`}
data-umami-event="click"
data-umami-event-target_id={`blog.subnav.category.${c.slug}`}
data-umami-event-placement="blog.subnav"
data-umami-event-target_url={`/blog/category/${c.slug}`}
>
{c.name}
</a>
))}
</nav>

6
site/src/pages/blog/category/[slug].astro
View File

@@ -44,7 +44,11 @@ if (!activeCategory) {
{posts.length > 0 ? (
<div class="blog-grid">
{posts.map((p) => (
<BlogPostCard post={p} />
<BlogPostCard
post={p}
placement={`blog.category.${activeCategory.slug}`}
targetId={`blog.category.${activeCategory.slug}.card.post.${p.slug}`}
/>
))}
</div>
) : (

22
site/src/pages/blog/index.astro
View File

@@ -25,7 +25,7 @@ const pages = wordpressPages(cache);
{posts.length > 0 ? (
<div class="blog-grid">
{posts.map((p) => (
<BlogPostCard post={p} />
<BlogPostCard post={p} placement="blog.index" targetId={`blog.index.card.post.${p.slug}`} />
))}
</div>
) : (
@@ -37,18 +37,32 @@ const pages = wordpressPages(cache);
<section class="section">
<div class="section-header">
<h2>Pages</h2>
<a class="muted" href="/blog/pages">
<a
class="muted"
href="/blog/pages"
data-umami-event="click"
data-umami-event-target_id="blog.index.pages.browse"
data-umami-event-placement="blog.index.pages_preview"
data-umami-event-target_url="/blog/pages"
>
Browse pages →
</a>
</div>
<div class="empty">
{pages.slice(0, 6).map((p) => (
<div>
<a href={`/blog/page/${p.slug}`}>{p.title}</a>
<a
href={`/blog/page/${p.slug}`}
data-umami-event="click"
data-umami-event-target_id={`blog.index.pages.link.${p.slug}`}
data-umami-event-placement="blog.index.pages_preview"
data-umami-event-target_url={`/blog/page/${p.slug}`}
>
{p.title}
</a>
</div>
))}
</div>
</section>
) : null}
</BlogLayout>

12
site/src/pages/blog/page/[slug].astro
View File

@@ -33,7 +33,16 @@ const metaDescription = (page.excerpt || "").slice(0, 160);
<section class="section">
<div class="section-header">
<h2 style="margin: 0;">{page.title}</h2>
<a class="muted" href="/blog">Back →</a>
<a
class="muted"
href="/blog"
data-umami-event="click"
data-umami-event-target_id="blog.page.back"
data-umami-event-placement="blog.page"
data-umami-event-target_url="/blog"
>
Back →
</a>
</div>
{page.featuredImageUrl ? (
<img
@@ -46,4 +55,3 @@ const metaDescription = (page.excerpt || "").slice(0, 160);
<div class="prose" set:html={page.contentHtml} />
</section>
</BlogLayout>

11
site/src/pages/blog/pages.astro
View File

@@ -25,7 +25,15 @@ const pages = wordpressPages(cache);
<div class="empty">
{pages.map((p) => (
<div style="padding: 6px 0;">
<a href={`/blog/page/${p.slug}`}>{p.title}</a>
<a
href={`/blog/page/${p.slug}`}
data-umami-event="click"
data-umami-event-target_id={`blog.pages.link.${p.slug}`}
data-umami-event-placement="blog.pages.list"
data-umami-event-target_url={`/blog/page/${p.slug}`}
>
{p.title}
</a>
</div>
))}
</div>
@@ -34,4 +42,3 @@ const pages = wordpressPages(cache);
)}
</section>
</BlogLayout>

12
site/src/pages/blog/post/[slug].astro
View File

@@ -33,7 +33,16 @@ const metaDescription = (post.excerpt || "").slice(0, 160);
<section class="section">
<div class="section-header">
<h2 style="margin: 0;">{post.title}</h2>
<a class="muted" href="/blog">Back →</a>
<a
class="muted"
href="/blog"
data-umami-event="click"
data-umami-event-target_id="blog.post.back"
data-umami-event-placement="blog.post"
data-umami-event-target_url="/blog"
>
Back →
</a>
</div>
<p class="muted" style="margin-top: 0;">
{new Date(post.publishedAt).toLocaleDateString()}
@@ -49,4 +58,3 @@ const metaDescription = (post.excerpt || "").slice(0, 160);
<div class="prose" set:html={post.contentHtml} />
</section>
</BlogLayout>