b34f8fc2fb
Add 5 long-form Thai blog posts (1,200-2,500 words each) with SEO + GEO optimization for the dealplustech water-systems site. Each post targets a specific audience (contractors, engineers, project managers) and follows a content-quality workflow: source real product specs, verify Thai text, dedupe images, link back to product pages. ## New blog posts (src/content/blog/) - thermobreak-guide.md (Thermobreak closed-cell insulation overview) - plastic-grilles-guide.md (ABS plastic grilles for HVAC) - ppr-pipe-guide.md (PPR pipe properties + heat-fusion welding) - ppr-vs-hdpe-vs-upvc.md (3-way pipe comparison with PE80/PE100) - thermobreak-series-guide.md (Thermobreak LS vs Solar series) - 10-things-checklist-pipe-ordering.md (10-point pre-order checklist) ## Removed legacy posts - pipe-knowledge.md, valve-guide.md, welcome-post.md (orphans) ## Hero images (public/images/blog/) ~20 product photos sourced from manufacturers (Thermobreak, Thai PPR, thaiconsupply) plus Nano Banana Pro infographics. All resized to 3:2 aspect ratio per user preference. Source folder preserved for re-derivation. ## Astro layout/SEO work - src/components/seo/SEO.astro, JsonLd.astro (new SEO components) - src/layouts/BaseLayout.astro, Layout.astro (OG/Twitter/JSON-LD wiring) - src/pages/404.astro - Product pages (8): added #pricelist anchors + schema work - src/styles/global.css: scroll-padding for sticky-header anchors ## Automation scripts (scripts/) - build_og_image.py (OG image builder) - inject_faq_schema.py, inject_product_schema.py (JSON-LD injection) ## Misc - public/robots.txt, public/images/og/default-og.jpg - .gitignore: exclude scripts/__pycache__/
68 lines
4.2 KiB
Plaintext
68 lines
4.2 KiB
Plaintext
---
|
|
import BaseLayout from '@/layouts/BaseLayout.astro';
|
|
import { getCollection } from 'astro:content';
|
|
|
|
const articles = (await getCollection('blog')).sort(
|
|
(a, b) => b.data.published_at.getTime() - a.data.published_at.getTime()
|
|
);
|
|
---
|
|
|
|
<BaseLayout title="บทความทั้งหมด - ดีล พลัส เทค" description="รวมบทความและความรู้เกี่ยวกับระบบน้ำ ท่อ และอุปกรณ์ต่างๆ จากดีล พลัส เทค">
|
|
<main class="bg-white min-h-screen">
|
|
<!-- Hero -->
|
|
<section class="bg-gradient-to-br from-primary-800 via-primary-700 to-primary-900 text-white py-16 lg:py-24">
|
|
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
|
|
<div class="max-w-3xl">
|
|
<span class="inline-block px-4 py-1.5 bg-white/20 text-white rounded-full text-sm font-medium mb-4">บทความ</span>
|
|
<h1 class="text-3xl sm:text-4xl lg:text-5xl font-bold mb-4">บทความทั้งหมด</h1>
|
|
<p class="text-lg sm:text-xl text-white/80 leading-relaxed">ความรู้และข้อมูลที่เป็นประโยชน์เกี่ยวกับระบบน้ำ ท่อ อุปกรณ์วาล์ว และอื่นๆ</p>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<!-- Articles Grid -->
|
|
<section class="py-16 lg:py-24">
|
|
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
|
|
{articles.length > 0 ? (
|
|
<div class="grid md:grid-cols-2 lg:grid-cols-3 gap-8">
|
|
{articles.map(article => (
|
|
<a href={`/${encodeURI('บทความ')}/${encodeURIComponent(article.id)}`} class="group block bg-white rounded-3xl overflow-hidden border border-slate-100 hover:border-primary-200 hover:shadow-xl transition-all duration-300">
|
|
<div class="aspect-[16/9] bg-slate-100 overflow-hidden">
|
|
{article.data.featured_image ? (
|
|
<img src={article.data.featured_image} alt={article.data.title} class="w-full h-full object-cover group-hover:scale-105 transition-transform duration-500" loading="lazy" />
|
|
) : (
|
|
<div class="w-full h-full flex items-center justify-center text-slate-300">
|
|
<svg class="w-16 h-16" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
|
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" d="M4 16l4.586-4.586a2 2 0 012.828 0L16 16m-2-2l1.586-1.586a2 2 0 012.828 0L20 14m-6-6h.01M6 20h12a2 2 0 002-2V6a2 2 0 00-2-2H6a2 2 0 00-2 2v12a2 2 0 002 2z"/>
|
|
</svg>
|
|
</div>
|
|
)}
|
|
</div>
|
|
<div class="p-6">
|
|
<div class="flex items-center gap-3 text-sm text-slate-500 mb-3">
|
|
{article.data.tags?.[0] && (
|
|
<span class="px-2.5 py-0.5 bg-primary-50 text-primary-600 rounded-full text-xs font-medium">{article.data.tags[0]}</span>
|
|
)}
|
|
</div>
|
|
<h2 class="text-lg font-bold text-slate-900 group-hover:text-primary-600 transition-colors mb-2 line-clamp-2">{article.data.title}</h2>
|
|
<p class="text-sm text-slate-600 line-clamp-2">{article.data.excerpt}</p>
|
|
</div>
|
|
</a>
|
|
))}
|
|
</div>
|
|
) : (
|
|
<div class="text-center py-16">
|
|
<div class="text-slate-300 mb-4">
|
|
<svg class="w-16 h-16 mx-auto" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
|
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" d="M19 20H5a2 2 0 01-2-2V6a2 2 0 012-2h10a2 2 0 012 2v1m2 13a2 2 0 01-2-2V7m2 13a2 2 0 002-2V9a2 2 0 00-2-2h-2m-4-3H9M7 16h6M7 8h6v4H7V8z"/>
|
|
</svg>
|
|
</div>
|
|
<p class="text-xl text-slate-400 mb-2">ยังไม่มีบทความ</p>
|
|
<p class="text-slate-400">กลับมาตรวจสอบอีกครั้งในภายหลัง</p>
|
|
</div>
|
|
)}
|
|
</div>
|
|
</section>
|
|
</main>
|
|
</BaseLayout>
|