kunthawat/moreminimore-astroreal
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Fix blog feature image: use heroImage from frontmatter instead of hardcode

Browse Source
This commit is contained in:
Kunthawat Greethong
2026-07-01 10:24:47 +07:00
parent 54c9b381b9
commit 236edb5f9f
2 changed files with 2 additions and 7 deletions
Download Patch File Download Diff File Expand all files Collapse all files

3
src/pages/blog.astro
View File

@@ -34,13 +34,12 @@ const allCategories = [...new Set(posts.map((p) => p.data.category))].sort();
<div class="blog-grid" id="blog-grid"> <div class="blog-grid" id="blog-grid">
{posts.map((post) => { {posts.map((post) => {
const fmt = new Intl.DateTimeFormat('th-TH', { day: '2-digit', month: 'short', year: '2-digit' }).format(post.data.pubDate); const fmt = new Intl.DateTimeFormat('th-TH', { day: '2-digit', month: 'short', year: '2-digit' }).format(post.data.pubDate);
const imgId = post.id === 'ai-for-sme-start-with-pain' ? 'ai' : post.id === 'marketing-automation-reduce-work' ? 'automation' : post.id === 'sme-website-next-action' ? 'website' : 'marketing';
return ( return (
<a class="blog-card liquid-glass liquidGlass-wrapper" href={`/blog/${post.id}/`} data-cat={post.data.category}> <a class="blog-card liquid-glass liquidGlass-wrapper" href={`/blog/${post.id}/`} data-cat={post.data.category}>
<div class="liquidGlass-effect" aria-hidden="true"></div> <div class="liquidGlass-effect" aria-hidden="true"></div>
<div class="liquidGlass-tint" aria-hidden="true"></div> <div class="liquidGlass-tint" aria-hidden="true"></div>
<div class="liquidGlass-shine" aria-hidden="true"></div> <div class="liquidGlass-shine" aria-hidden="true"></div>
<img class="blog-card-img" src={`/images/blog-${imgId}.jpg`} alt={post.data.title} loading="lazy" /> <img class="blog-card-img" src={post.data.heroImage || '/images/blog-placeholder.svg'} alt={post.data.title} loading="lazy" />
<div class="blog-meta"> <div class="blog-meta">
<span class="eyebrow">{post.data.category}</span> <span class="eyebrow">{post.data.category}</span>
<span class="blog-date eyebrow">{fmt}</span> <span class="blog-date eyebrow">{fmt}</span>

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

@@ -138,11 +138,7 @@ const faqPageJsonLd = faqPairs.length > 0
</header> </header>
<div class="blog-feature-image"> <div class="blog-feature-image">
{['ai-for-sme-start-with-pain', 'marketing-automation-reduce-work', 'sme-website-next-action'].includes(post.id) ? ( <img src={post.data.heroImage || '/images/blog-placeholder.svg'} alt={post.data.title} />
<img src={`/images/blog-${post.id === 'ai-for-sme-start-with-pain' ? 'ai' : post.id === 'marketing-automation-reduce-work' ? 'automation' : 'website'}.jpg`} alt={post.data.title} />
) : (
<img src="/images/blog-marketing.jpg" alt={post.data.title} />
)}
</div> </div>
<div class="blog-article-shell"> <div class="blog-article-shell">