Changes: 1. Removed Chatbot as separate service (integrated in AI Automation) 2. Added official social media icons (Facebook, Twitter, LinkedIn logos) 3. Added submenu in navigation for all services 4. Updated footer to match services (5 services) 5. Reordered services: Website, App, AI Transform, Marketing, AI Automation 6. All menu items link to specific pages (not landing page) 7. Redesigned process section (grid cards instead of connected line) 8. Added blog with Astro Content Collections (4 posts as .md files) 9. Created blog listing and individual post pages 10. All services have dedicated pages with original content Services (5 total): 1. พัฒนาเว็บไซต์ 2. พัฒนาแอปพลิเคชัน 3. ที่ปรึกษาองค์กร AI 4. ที่ปรึกษาการตลาดออนไลน์ 5. AI Automation Blog: - 4 posts migrated from original site - Astro Content Collections setup - /blog listing page - Dynamic /blog/[slug] pages
44 lines
2.0 KiB
Plaintext
44 lines
2.0 KiB
Plaintext
---
|
|
import Layout from '../../layouts/Layout.astro';
|
|
import { getCollection } from 'astro:content';
|
|
|
|
const posts = await getCollection('blog');
|
|
posts.sort((a, b) => b.data.pubDate.valueOf() - a.data.pubDate.valueOf());
|
|
---
|
|
|
|
<Layout title="เรื่องน่ารู้ SEO & AI | MoreminiMore">
|
|
<section class="py-20 bg-gradient-hero">
|
|
<div class="container mx-auto px-4">
|
|
<h1 class="text-5xl md:text-6xl font-bold text-center mb-6 text-secondary">เรื่องน่ารู้</h1>
|
|
<p class="text-xl text-center text-gray-600 max-w-3xl mx-auto">บทความเกี่ยวกับ SEO, AI และดิจิตอลมาร์เก็ตติ้ง</p>
|
|
</div>
|
|
</section>
|
|
|
|
<section class="py-20 bg-white">
|
|
<div class="container mx-auto px-4">
|
|
<div class="grid md:grid-cols-2 lg:grid-cols-4 gap-8 max-w-7xl mx-auto">
|
|
{posts.map((post) => (
|
|
<article class="bg-gray-light rounded-2xl overflow-hidden shadow-md card-hover">
|
|
<div class="p-6">
|
|
<div class="flex flex-wrap gap-2 mb-4">
|
|
{post.data.tags.map((tag) => (
|
|
<span class="text-xs bg-accent-blue text-white px-3 py-1 rounded-full">{tag}</span>
|
|
))}
|
|
</div>
|
|
<h2 class="text-xl font-bold mb-3 hover:text-accent-blue transition">
|
|
<a href={`/blog/${post.id}/`} class="hover:underline">{post.data.title}</a>
|
|
</h2>
|
|
<p class="text-gray-600 mb-4 line-clamp-3">{post.data.description}</p>
|
|
<div class="flex items-center justify-between text-sm text-gray-500">
|
|
<span>{post.data.author}</span>
|
|
<span>{post.data.pubDate.toLocaleDateString('th-TH')}</span>
|
|
</div>
|
|
<a href={`/blog/${post.id}/`} class="text-accent-blue font-medium hover:underline flex items-center gap-2 mt-4">อ่านเพิ่มเติม →</a>
|
|
</div>
|
|
</article>
|
|
))}
|
|
</div>
|
|
</div>
|
|
</section>
|
|
</Layout>
|