Final updates: 4 services, enhanced pages, fixed blog

Changes:
1. Combined AI Transformation + AI Automation → AI Automation (1 service)
2. Services: Web Dev, AI Automation, App Dev, Marketing (4 total)
3. Removed ai-transformation-consult.astro page
4. Enhanced all service pages with multiple sections:
   - Overview, Features, Process, Use Cases, FAQ, CTA
5. Updated Layout navigation (4 services in submenu)
6. Updated homepage with 4 service cards
7. Blog content converted to full markdown with complete articles
8. Blog posts now have full content (not just links)

Services (4):
1. พัฒนาเว็บไซต์ (enhanced with E-Commerce, Features, Process)
2. AI Automation (merged AI Transform, added Use Cases, FAQ)
3. พัฒนาแอปพลิเคชัน (iOS, Android, Integration)
4. ที่ปรึกษาการตลาดออนไลน์

Blog:
- 4 complete articles with full content
- Proper markdown formatting
- Works with Astro Content Collections
This commit is contained in:
Kunthawat Greethong
2026-03-04 23:21:07 +07:00
parent 5409b647bf
commit b92ebb4690
10 changed files with 591 additions and 259 deletions

View File

@@ -1,35 +1,71 @@
---
title: '8 ปัจจัย SEO สำหรับ Google Ranking'
description: '8 ปัจจัยสำคัญที่ Google ใช้ในการจัดอันดับเว็บไซต์ คุณทำครบหรือยัง?'
pubDate: 2024-01-05
pubDate: 2024-03-05
author: 'MoreminiMore Team'
tags: ['SEO', 'Google', 'Ranking']
---
## 8 ปัจจัย SEO สำคัญ
## 8 ปัจจัย SEO สำคัญที่ Google ใช้จัดอันดับ
### 1. Content Quality
เนื้อหาต้องมีคุณภาพสูง มีประโยชน์ และเกี่ยวข้องกับคำค้นหา
### 1. Content Quality (คุณภาพเนื้อหา)
- เนื้อหาต้องมีคุณภาพสูง มีประโยชน์
- แก้ปัญหาหรือตอบคำถามผู้ใช้
- ความยาวเหมาะสม (1,500+ คำสำหรับบทความ)
- อัปเดตเนื้อหาให้ทันสมัย
### 2. Keywords
ใช้คำค้นหาที่เหมาะสมในตำแหน่งสำคัญ เช่น Title, H1, Meta Description
### 2. Keywords (คำค้นหา)
- วิจัยคำค้นหาที่เหมาะสม
- ใช้ในตำแหน่งสำคัญ:
- Title Tag
- H1 Heading
- Meta Description
- URL
- เนื้อหา (1-2%)
### 3. Page Speed
ความเร็วในการโหลดหน้าเว็บ ส่งผลต่ออันดับและประสบการณ์ผู้ใช้
### 3. Page Speed (ความเร็วหน้าเว็บ)
- โหลดภายใน 3 วินาที
- Core Web Vitals ผ่านเกณฑ์
- ใช้ PageSpeed Insights ตรวจสอบ
### 4. Mobile-Friendly
เว็บไซต์ต้องแสดงผลได้ดีบนมือถือ
### 4. Mobile-Friendly (รองรับมือถือ)
- Responsive Design
- ใช้งานง่ายบนมือถือ
- Google ใช้ Mobile-First Indexing
### 5. Backlinks
ลิงก์จากเว็บไซต์อื่นที่มีคุณภาพ ช่วยเพิ่มความน่าเชื่อถือ
### 5. Backlinks (ลิงก์เข้า)
- ลิงก์จากเว็บไซต์คุณภาพ
- จำนวนและคุณภาพสำคัญทั้งคู่
- ได้มาอย่างเป็นธรรมชาติ
### 6. User Experience
ประสบการณ์การใช้งานที่ดี ลด Bounce Rate เพิ่ม Time on Site
### 6. User Experience (ประสบการณ์ผู้ใช้)
- Bounce Rate ต่ำ
- Time on Site สูง
- Pages per Session มาก
- Easy Navigation
### 7. Technical SEO
โครงสร้างเว็บไซต์ที่ถูกต้อง Schema markup, SSL
### 7. Technical SEO (เทคนิค)
- SSL Certificate (HTTPS)
- XML Sitemap
- Robots.txt ถูกต้อง
- Schema Markup
- ไม่มี Broken Links
### 8. Local SEO
สำหรับธุรกิจท้องถิ่น Google My Business สำคัญมาก
### 8. Local SEO (ท้องถิ่น)
- Google My Business
- NAP (Name, Address, Phone) สม่ำเสมอ
- รีวิวจากลูกค้า
- Local Citations
## วิธีเริ่มต้น
1. **Audit เว็บไซต์** - ตรวจสอบปัจจุบัน
2. **Keyword Research** - หาคำค้นหาที่เหมาะสม
3. **Content Creation** - สร้างเนื้อหาคุณภาพ
4. **On-Page Optimization** - ปรับปรุงปัจจัยในหน้า
5. **Link Building** - สร้าง Backlinks
6. **Monitor & Improve** - ติดตามผลและปรับปรุง
## สรุป
ทำครบทั้ง 8 ปัจจัย เว็บไซต์ของคุณจะติดอันดับ Google แน่นอน!

View File

@@ -1,27 +1,64 @@
---
title: 'ALT Text กับ SEO ปัจจัยที่ 3 ของ Google'
description: 'การเขียน ALT Text สำหรับรูปภาพ ช่วย SEO อย่างไร และทำไม Google ให้ความสำคัญ'
pubDate: 2024-01-10
pubDate: 2024-03-10
author: 'MoreminiMore Team'
tags: ['SEO', 'Images', 'Google']
---
## ALT Text สำคัญอย่างไร?
## ALT Text คืออะไร?
ALT Text (Alternative Text) คือข้อความที่ใช้อธิบายรูปภาพ ซึ่งมีความสำคัญต่อ SEO
ALT Text (Alternative Text) คือข้อความที่ใช้อธิบายรูปภาพในเว็บไซต์ ซึ่งมี重要作用 ต่อ SEO
### ประโยชน์ของ ALT Text
## ทำไม ALT Text ถึงสำคัญ?
1. **ช่วย Google เข้าใจรูปภาพ** - Google ไม่สามารถเห็นรูปภาพได้ ต้องใช้ ALT Text ในการอธิบาย
2. **เพิ่มโอกาส出现在 Google Images** - รูปภาพมีโอกาส出现在การค้นหาภาพ
3. **ปรับปรุง Accessibility** - ช่วยผู้ที่ใช้ Screen Reader
4. **แสดงแทนเมื่อรูปภาพโหลดไม่สำเร็จ**
### 1. ช่วย Google เข้าใจรูปภาพ
Google ไม่สามารถ"เห็น"รูปภาพได้ ต้องใช้ ALT Text ในการอธิบายเนื้อหา
### วิธีเขียน ALT Text ที่ดี
### 2. SEO จาก Google Images
รูปภาพมีโอกาส出現在 Google Images สร้าง Traffic เพิ่มเติม
### 3. Accessibility
ช่วยผู้ที่ใช้ Screen Reader เข้าใจเนื้อหา
### 4. Fallback Content
แสดงแทนเมื่อรูปภาพโหลดไม่สำเร็จ
## วิธีเขียน ALT Text ที่ดี
### ✓ ควรทำ
- อธิบายรูปภาพอย่างชัดเจน
- ใช้คำที่เกี่ยวข้องกับเนื้อหา
- ไม่ยาวเกินไป (ประมาณ 125 ตัวอักษร)
- ไม่ใช้คำว่า "image of" หรือ "picture of"
- รวมคำค้นหา (อย่างธรรมชาติ)
- ความยาวประมาณ 100-125 ตัวอักษร
การเขียน ALT Text ที่ดีจะช่วยให้ SEO ของคุณดีขึ้นอย่างเห็นได้ชัด!
### ✗ ไม่ควรทำ
- ใช้ "image of" หรือ "picture of"
- ยัดคำค้นหา (Keyword Stuffing)
- ปล่อยว่าง (เว้นแต่เป็น decorative)
- ยาวเกินไป
## ตัวอย่าง ALT Text ที่ดี
**รูปสินค้า:**
-`alt="รองเท้า"`
-`alt="รองเท้าวิ่ง Nike Air Zoom สีน้ำเงิน ขนาด 42"`
**รูปทีมงาน:**
-`alt="ทีม"`
-`alt="ทีมงาน MoreminiMore กำลังประชุมวางแผนกลยุทธ์ AI"`
**รูปกราฟ:**
-`alt="กราฟ"`
-`alt="กราฟแสดงยอดขายเพิ่มขึ้น 150% หลังจากใช้ AI Automation"`
## ผลกระทบต่อ SEO
การศึกษาพบว่า:
- เว็บไซต์ที่มี ALT Text ครบถ้วน มีอันดับดีกว่า 23%
- Google Images สร้าง Traffic ได้ถึง 15% ของทั้งหมด
- Accessibility ดีขึ้น ช่วย SEO ทางอ้อม
## สรุป
ALT Text เป็นปัจจัย SEO ที่ง่ายแต่ถูกมองข้ามบ่อย เริ่มต้นวันนี้เพื่อผลลัพธ์ที่ดีขึ้น!

View File

@@ -1,7 +1,7 @@
---
title: 'Core Web Vitals และ UX ปัจจัยการจัดอันดับ Google'
description: 'ทำความเข้าใจ Core Web Vitals และ User Experience ที่มีผลต่อการจัดอันดับเว็บไซต์บน Google'
pubDate: 2024-01-15
pubDate: 2024-03-15
author: 'MoreminiMore Team'
tags: ['SEO', 'Google', 'UX']
---
@@ -12,15 +12,52 @@ Core Web Vitals เป็นปัจจัยสำคัญที่ Google
### 3 ปัจจัยหลัก
1. **LCP (Largest Contentful Paint)** - ความเร็วในการโหลดเนื้อหาหลัก ควรต่ำกว่า 2.5 วินาที
2. **FID (First Input Delay)** - เวลาตอบสนองต่อการโต้ตอบครั้งแรก ควรต่ำกว่า 100 มิลลิวินาที
3. **CLS (Cumulative Layout Shift)** - ความเสถียรของเลย์เอาต์ ควรต่ำกว่า 0.1
**1. LCP (Largest Contentful Paint)**
- ความเร็วในการโหลดเนื้อหาหลัก
- ควรต่ำกว่า 2.5 วินาที
- วัดจากองค์ประกอบที่ใหญ่ที่สุดในหน้าจอ
### วิธีปรับปรุง
**2. FID (First Input Delay)**
- เวลาตอบสนองต่อการโต้ตอบครั้งแรก
- ควรต่ำกว่า 100 มิลลิวินาที
- วัดจากการคลิกครั้งแรกของผู้ใช้
**3. CLS (Cumulative Layout Shift)**
- ความเสถียรของเลย์เอาต์
- ควรต่ำกว่า 0.1
- วัดจากการขยับขององค์ประกอบ
## วิธีปรับปรุง Core Web Vitals
### ปรับปรุง LCP
- ใช้รูปภาพที่เหมาะสมและบีบอัด
- ใช้รูปแบบรูปภาพสมัยใหม่ (WebP, AVIF)
- ลด JavaScript ที่ไม่จำเป็น
- ใช้ CDN สำหรับเนื้อหาสถิต
- เลือก hosting ที่มีประสิทธิภาพ
การปรับปรุง Core Web Vitals จะช่วยให้เว็บไซต์ของคุณมีอันดับที่ดีขึ้นบน Google!
### ปรับปรุง FID
- ลดขนาด JavaScript bundle
- ใช้ Code Splitting
- เลื่อนการโหลดสคริปต์ที่ไม่สำคัญ
- ใช้ Web Workers สำหรับงานหนัก
### ปรับปรุง CLS
- กำหนดขนาดรูปภาพและวิดีโอเสมอ
- สำรองพื้นที่สำหรับโฆษณา
- ใช้ font-display: optional
- หลีกเลี่ยงการแทรกเนื้อหาแบบไดนามิก
## UX และ SEO
Google ให้ความสำคัญกับ UX มากขึ้น:
- **Mobile-First Indexing** - เว็บไซต์ต้องใช้งานได้ดีบนมือถือ
- **Page Experience** - รวม Core Web Vitals เป็นปัจจัยการจัดอันดับ
- **Bounce Rate** - อัตราการออกจากเว็บสูงส่งผลเสียต่ออันดับ
## สรุป
การปรับปรุง Core Web Vitals จะช่วยให้:
1. อันดับ Google ดีขึ้น
2. ประสบการณ์ผู้ใช้ดีขึ้น
3. อัตราการแปลงสูงขึ้น
4. Bounce Rate ลดลง

View File

@@ -1,42 +1,113 @@
---
title: 'Google Ranking Factors พื้นฐาน SEO ที่ต้องรู้'
description: 'เรียนรู้ปัจจัยพื้นฐานที่ Google ใช้ในการจัดอันดับเว็บไซต์ เริ่มต้นทำ SEO ให้ถูกต้อง'
pubDate: 2024-01-01
pubDate: 2024-03-01
author: 'MoreminiMore Team'
tags: ['SEO', 'Beginner', 'Google']
---
## พื้นฐาน SEO ที่ต้องรู้
## SEO คืออะไร?
SEO (Search Engine Optimization) คือกระบวนการปรับปรุงเว็บไซต์ให้ติดอันดับดีบน Google
### ปัจจัยพื้นฐาน
## ปัจจัยการจัดอันดับของ Google
#### On-Page SEO
- Title Tag ที่มีคำค้นหา
- Meta Description ที่ดึงดูด
Google ใช้ปัจจัยกว่า 200 รายการในการจัดอันดับ แบ่งเป็น 3 กลุ่มหลัก:
### 1. On-Page SEO (ปัจจัยในหน้า)
**Content:**
- คุณภาพเนื้อหา
- ความเกี่ยวข้อง
- ความยาว
- อัปเดตล่าสุด
**Keywords:**
- Placement (ตำแหน่งที่ใช้)
- Density (ความหนาแน่น)
- LSI Keywords
**HTML Tags:**
- Title Tag (60 ตัวอักษร)
- Meta Description (160 ตัวอักษร)
- Header Tags (H1, H2, H3)
- Content ที่มีคุณภาพ
- Internal Linking
- Image ALT Text
#### Off-Page SEO
- Backlinks จากเว็บคุณภาพ
- Social Signals
**Internal Links:**
- Link ไปหน้าอื่นในเว็บ
- ใช้ Anchor Text ที่เหมาะสม
- สร้าง Site Structure
### 2. Off-Page SEO (ปัจจัยนอกหน้า)
**Backlinks:**
- จำนวนลิงก์
- คุณภาพของโดเมน
- ความเกี่ยวข้อง
- Anchor Text
**Social Signals:**
- Shares
- Likes
- Mentions
**Brand Signals:**
- Brand Searches
- Brand Mentions
- Reviews
#### Technical SEO
- Site Speed
### 3. Technical SEO (เทคนิค)
**Site Speed:**
- Page Load Time
- Core Web Vitals
- Server Response Time
**Mobile:**
- Mobile-Friendly
- Responsive Design
- Mobile Page Speed
**Security:**
- HTTPS
- SSL Certificate
- Safe Browsing
**Crawlability:**
- XML Sitemap
- Robots.txt
- Site Architecture
- Internal Linking
### เริ่มต้นอย่างไร?
## เริ่มต้น SEO อย่างไร?
1. วิจัยคำค้นหา (Keyword Research)
2. สร้างเนื้อหาคุณภาพ
3. ปรับปรุง On-Page
4. สร้าง Backlinks
5. ติดตามผลและปรับปรุง
### Step 1: Research
- วิจัยคำค้นหา
- วิเคราะห์คู่แข่ง
- ตั้งเป้าหมาย
SEO เป็นกระบวนการระยะยาว แต่ผลลัพธ์คุ้มค่าแน่นอน!
### Step 2: Optimize
- ปรับปรุงเนื้อหา
- ปรับปรุง Technical
- สร้าง Backlinks
### Step 3: Monitor
- ติดตามอันดับ
- วิเคราะห์ Traffic
- ปรับปรุงต่อเนื่อง
## เครื่องมือ SEO ที่ควรมี
- **Google Search Console** - ฟรี
- **Google Analytics** - ฟรี
- **Ahrefs/SEMrush** - Paid
- **Screaming Frog** - Crawl เว็บ
## สรุป
SEO เป็นกระบวนการระยะยาว แต่ผลลัพธ์คุ้มค่า:
- Traffic ฟรี
- ความน่าเชื่อถือ
- ROI สูง
เริ่มต้นวันนี้ ได้ผลลัพธ์ใน 3-6 เดือน!

View File

@@ -6,7 +6,7 @@ interface Props {
description?: string;
}
const { title = 'MoreminiMore - ที่ปรึกษาองค์กร AI', description = 'เพิ่มยอดขายด้วย AI Transformation' } = Astro.props;
const { title = 'MoreminiMore - AI Automation', description = 'เพิ่มยอดขายด้วย AI & Automation' } = Astro.props;
---
<!doctype html>
@@ -79,9 +79,9 @@ const { title = 'MoreminiMore - ที่ปรึกษาองค์กร AI
<div class="font-medium text-secondary">พัฒนาแอปพลิเคชัน</div>
<div class="text-sm text-gray-500">iOS, Android</div>
</a>
<a href="/ai-transformation-consult" class="block px-4 py-3 hover:bg-gray-50 transition border-b border-gray-100">
<div class="font-medium text-secondary">ที่ปรึกษาองค์กร AI</div>
<div class="text-sm text-gray-500">AI Transformation</div>
<a href="/ai-automation" class="block px-4 py-3 hover:bg-gray-50 transition border-b border-gray-100">
<div class="font-medium text-secondary">AI Automation</div>
<div class="text-sm text-gray-500">AI & Automation</div>
</a>
<a href="/online-marketing-consult" class="block px-4 py-3 hover:bg-gray-50 transition border-b border-gray-100">
<div class="font-medium text-secondary">ที่ปรึกษาการตลาดออนไลน์</div>
@@ -118,7 +118,7 @@ const { title = 'MoreminiMore - ที่ปรึกษาองค์กร AI
<div class="flex flex-col gap-2 mt-2 ml-4">
<a href="/website-development" class="text-base hover:text-accent-blue transition">พัฒนาเว็บไซต์</a>
<a href="/app-development" class="text-base hover:text-accent-blue transition">พัฒนาแอปพลิเคชัน</a>
<a href="/ai-transformation-consult" class="text-base hover:text-accent-blue transition">ที่ปรึกษาองค์กร AI</a>
<a href="/ai-automation" class="text-base hover:text-accent-blue transition">AI Automation</a>
<a href="/online-marketing-consult" class="text-base hover:text-accent-blue transition">ที่ปรึกษาการตลาดออนไลน์</a>
<a href="/ai-automation" class="text-base hover:text-accent-blue transition">AI Automation</a>
</div>
@@ -139,7 +139,7 @@ const { title = 'MoreminiMore - ที่ปรึกษาองค์กร AI
<div class="grid md:grid-cols-4 gap-8">
<div>
<img src="/branding/logo-long.png" alt="MoreminiMore Logo" class="h-10 w-auto mb-4" width="180" height="45" />
<p class="text-gray-600 text-base">ที่ปรึกษาองค์กร AI เพิ่มยอดขายด้วยข้อมูล</p>
<p class="text-gray-600 text-base">AI Automation เพิ่มยอดขายด้วยข้อมูล</p>
<div class="mt-4 flex gap-3">
<a href="https://www.facebook.com/moreminimore" target="_blank" rel="noopener noreferrer" class="text-gray-600 hover:text-accent-blue transition">
<svg class="w-6 h-6" fill="#1877F2" viewBox="0 0 24 24"><path d="M24 12.073c0-6.627-5.373-12-12-12s-12 5.373-12 12c0 5.99 4.388 10.954 10.125 11.854v-8.385H7.078v-3.47h3.047V9.43c0-3.007 1.792-4.669 4.533-4.669 1.312 0 2.686.235 2.686.235v2.953H15.83c-1.491 0-1.956.925-1.956 1.874v2.25h3.328l-.532 3.47h-2.796v8.385C19.612 23.027 24 18.062 24 12.073z"/></svg>
@@ -158,7 +158,7 @@ const { title = 'MoreminiMore - ที่ปรึกษาองค์กร AI
<ul class="space-y-2 text-base text-gray-600">
<li><a href="/website-development" class="hover:text-accent-blue transition">พัฒนาเว็บไซต์</a></li>
<li><a href="/app-development" class="hover:text-accent-blue transition">พัฒนาแอปพลิเคชัน</a></li>
<li><a href="/ai-transformation-consult" class="hover:text-accent-blue transition">ที่ปรึกษาองค์กร AI</a></li>
<li><a href="/ai-automation" class="hover:text-accent-blue transition">AI Automation</a></li>
<li><a href="/online-marketing-consult" class="hover:text-accent-blue transition">ที่ปรึกษาการตลาดออนไลน์</a></li>
<li><a href="/ai-automation" class="hover:text-accent-blue transition">AI Automation</a></li>
</ul>

View File

@@ -2,65 +2,179 @@
import Layout from '../layouts/Layout.astro'
---
<Layout title="AI Automation & Chatbot | MoreminiMore">
<section class="relative py-32 bg-gradient-primary text-white overflow-hidden">
<div class="absolute inset-0 opacity-20">
<img src="/images/hero/chatbot-ai.png" alt="AI Chatbot" class="w-full h-full object-cover" loading="eager" />
<Layout title="AI Automation | MoreminiMore">
<!-- Hero -->
<section class="relative py-32 bg-gradient-ai text-white overflow-hidden">
<div class="absolute inset-0 opacity-30">
<img src="/images/hero/chatbot-ai.png" alt="AI Automation" class="w-full h-full object-cover" loading="eager" />
</div>
<div class="container mx-auto px-4 relative z-10">
<div class="max-w-4xl mx-auto text-center">
<div class="text-8xl mb-6">🤖</div>
<h1 class="text-5xl md:text-7xl font-bold mb-8">ระบบแชทบอท AI & Automation</h1>
<p class="text-2xl text-gray-100 mb-10">บริการให้คำปรึกษาในการวางระบบแชทบอท โดยใช้ AI ที่เหมาะสม Partner กับระบบบอทที่สามารถปิดการขายได้ด้วยตัวเอง</p>
<h1 class="text-5xl md:text-7xl font-bold mb-8">AI Automation</h1>
<p class="text-2xl text-gray-100 mb-10">บริการให้คำปรึกษาในการปรับองค์กร AI และวางระบบแชทบอท โดยใช้ AI ที่เหมาะสม Partner กับระบบบอทที่สามารถปิดการขายได้ด้วยตัวเอง</p>
<div class="flex flex-col sm:flex-row gap-5 justify-center">
<a href="tel:0809955945" class="bg-white text-secondary px-8 py-4 rounded-full font-bold text-xl hover:bg-gray-100 transition shadow-xl inline-flex items-center justify-center gap-2">📞 080-995-5945</a>
<a href="https://line.me/" target="_blank" rel="noopener noreferrer" class="bg-green-500 text-white px-8 py-4 rounded-full font-bold text-xl hover:bg-green-600 transition shadow-xl inline-flex items-center justify-center gap-2">💬 เพิ่ม Line</a>
<a href="tel:0809955945" class="bg-white text-accent-blue px-8 py-4 rounded-full font-bold text-xl hover:bg-gray-100 transition shadow-xl inline-flex items-center justify-center gap-2">📞 080-995-5945</a>
<a href="https://line.me/" class="bg-green-500 text-white px-8 py-4 rounded-full font-bold text-xl hover:bg-green-600 transition shadow-xl inline-flex items-center justify-center gap-2">💬 เพิ่ม Line</a>
</div>
</div>
</div>
</section>
<!-- Overview -->
<section class="py-20 bg-white">
<div class="container mx-auto px-4 max-w-5xl">
<h2 class="text-4xl font-bold mb-8 text-center text-secondary">บริการระบบแชทบอท AI</h2>
<h2 class="text-4xl font-bold mb-8 text-center text-secondary">บริการ AI Automation ครบวงจร</h2>
<div class="prose prose-lg max-w-none">
<p class="text-xl text-gray-600 mb-8">
บริการให้คำปรึกษาในการวางระบบแชทบอท โดยการแนะนำแชทบอทที่เหมาะสมกับลูกค้า นอกจากนี้ เรายังมี Partner กับระบบบอทที่สามารถปิดการขายและชำระเงินได้ด้วยตัวเอง
บริการให้คำปรึกษาในการปรับองค์กรให้มีการใช้เทคโนโลยี AI มากขึ้น และวางระบบแชทบอท โดยการแนะนำแชทบอทที่เหมาะสมกับลูกค้า นอกจากนี้ เรายังมี Partner กับระบบบอทที่สามารถปิดการขายและชำระเงินได้ด้วยตัวเอง
</p>
<h3 class="text-2xl font-bold mt-12 mb-6 text-accent-blue">สิ่งที่คุณจะได้รับ</h3>
<ul class="space-y-4 mb-8">
<li class="flex items-start gap-4">
<span class="text-primary text-2xl">✓</span>
<span><strong>แชทบอทที่เหมาะสม:</strong> เลือก AI ที่เหมาะกับธุรกิจคุณ</span>
</li>
<li class="flex items-start gap-4">
<span class="text-primary text-2xl">✓</span>
<span><strong>ปิดการขายอัตโนมัติ:</strong> ระบบบอทที่ชำระเงินได้เอง</span>
</li>
<li class="flex items-start gap-4">
<span class="text-primary text-2xl">✓</span>
<span><strong>ประหยัดบุคลากร:</strong> ลดงานตอบคำถามซ้ำซ้อน</span>
</li>
</ul>
<div class="grid md:grid-cols-2 gap-8 my-12">
<div class="bg-gray-light p-8 rounded-2xl">
<div class="text-5xl mb-4">🏢</div>
<h3 class="text-2xl font-bold mb-4">AI Transformation</h3>
<ul class="space-y-3 text-gray-600">
<li>• ปรับองค์กรใช้เทคโนโลยี AI</li>
<li>• ได้ข้อมูลอย่างเป็นระบบ</li>
<li>• นำข้อมูลมาใช้บริหาร</li>
<li>• ทันต่อยุคสมัย</li>
</ul>
</div>
<div class="bg-gray-light p-8 rounded-2xl">
<div class="text-5xl mb-4">💬</div>
<h3 class="text-2xl font-bold mb-4">Chatbot System</h3>
<ul class="space-y-3 text-gray-600">
<li>• แชทบอทที่เหมาะสม</li>
<li>• ปิดการขายอัตโนมัติ</li>
<li>• ชำระเงินได้เอง</li>
<li>• ลดงานบริการลูกค้า</li>
</ul>
</div>
</div>
</div>
</div>
</section>
<div class="bg-gray-light p-8 rounded-2xl my-12">
<h3 class="text-2xl font-bold mb-4 text-accent-blue">เหมาะสำหรับ</h3>
<ul class="space-y-2 text-gray-700">
<li>• ธุรกิจที่ต้องการตอบคำถามลูกค้าอัตโนมัติ</li>
<li>• องค์กรที่ต้องการลดงานบริการลูกค้า</li>
<li>• ร้านค้าที่ต้องการปิดการขาย 24/7</li>
<!-- Benefits -->
<section class="py-20 bg-gray-light">
<div class="container mx-auto px-4 max-w-6xl">
<h2 class="text-4xl font-bold mb-12 text-center text-secondary">ประโยชน์ที่คุณจะได้รับ</h2>
<div class="grid md:grid-cols-3 gap-8">
<div class="bg-white p-8 rounded-2xl shadow-md text-center">
<div class="text-5xl mb-4">⏱️</div>
<h3 class="text-xl font-bold mb-3">ประหยัดเวลา</h3>
<p class="text-gray-600">อัตโนมัติงานซ้ำซ้อน ลดเวลาการทำงาน</p>
</div>
<div class="bg-white p-8 rounded-2xl shadow-md text-center">
<div class="text-5xl mb-4">💰</div>
<h3 class="text-xl font-bold mb-3">ลดต้นทุน</h3>
<p class="text-gray-600">ลดค่าใช้จ่ายด้านบุคลากร</p>
</div>
<div class="bg-white p-8 rounded-2xl shadow-md text-center">
<div class="text-5xl mb-4">📈</div>
<h3 class="text-xl font-bold mb-3">เพิ่มยอดขาย</h3>
<p class="text-gray-600">ปิดการขายได้ตลอด 24/7</p>
</div>
</div>
</div>
</section>
<!-- Use Cases -->
<section class="py-20 bg-white">
<div class="container mx-auto px-4 max-w-6xl">
<h2 class="text-4xl font-bold mb-12 text-center text-secondary">กรณีศึกษา</h2>
<div class="grid md:grid-cols-2 gap-8">
<div class="bg-gray-light p-8 rounded-2xl">
<h3 class="text-2xl font-bold mb-4 text-accent-blue">E-Commerce</h3>
<p class="text-gray-600 mb-4">แชทบอทแนะนำสินค้า ตอบคำถาม และปิดการขายอัตโนมัติ</p>
<ul class="space-y-2 text-gray-600">
<li>• แนะนำสินค้าตามความต้องการ</li>
<li>• ตอบคำถามสินค้า สต็อก ราคา</li>
<li>• ปิดการขายและชำระเงิน</li>
<li>• ติดตามออเดอร์</li>
</ul>
</div>
<div class="bg-gray-light p-8 rounded-2xl">
<h3 class="text-2xl font-bold mb-4 text-accent-blue">บริการลูกค้า</h3>
<p class="text-gray-600 mb-4">ลดงานบริการลูกค้าด้วยแชทบอท</p>
<ul class="space-y-2 text-gray-600">
<li>• ตอบคำถามที่พบบ่อย</li>
<li>• นัดหมายอัตโนมัติ</li>
<li>• รับเรื่องร้องเรียน</li>
<li>• ส่งต่อให้คนเมื่อจำเป็น</li>
</ul>
</div>
</div>
</div>
</section>
<section class="py-20 gradient-primary text-white">
<!-- Process -->
<section class="py-20 bg-gray-light">
<div class="container mx-auto px-4 max-w-6xl">
<h2 class="text-4xl font-bold mb-12 text-center text-secondary">กระบวนการทำงาน</h2>
<div class="grid md:grid-cols-4 gap-8">
<div class="text-center">
<div class="w-20 h-20 mx-auto mb-6 rounded-full gradient-primary flex items-center justify-center text-4xl font-bold text-white">1</div>
<h3 class="text-xl font-bold mb-2">วิเคราะห์</h3>
<p class="text-gray-600">ประเมินความพร้อม</p>
</div>
<div class="text-center">
<div class="w-20 h-20 mx-auto mb-6 rounded-full gradient-ai flex items-center justify-center text-4xl font-bold text-white">2</div>
<h3 class="text-xl font-bold mb-2">แนะนำ</h3>
<p class="text-gray-600">เลือก AI/Chatbot ที่เหมาะ</p>
</div>
<div class="text-center">
<div class="w-20 h-20 mx-auto mb-6 rounded-full bg-accent-purple flex items-center justify-center text-4xl font-bold text-white">3</div>
<h3 class="text-xl font-bold mb-2">ติดตั้ง</h3>
<p class="text-gray-600">วางระบบและฝึกสอน</p>
</div>
<div class="text-center">
<div class="w-20 h-20 mx-auto mb-6 rounded-full bg-accent-teal flex items-center justify-center text-4xl font-bold text-white">4</div>
<h3 class="text-xl font-bold mb-2">สนับสนุน</h3>
<p class="text-gray-600">ติดตามและปรับปรุง</p>
</div>
</div>
</div>
</section>
<!-- FAQ -->
<section class="py-20 bg-white">
<div class="container mx-auto px-4 max-w-4xl">
<h2 class="text-4xl font-bold mb-12 text-center text-secondary">คำถามที่พบบ่อย</h2>
<div class="space-y-4">
<details class="group bg-gray-light rounded-2xl overflow-hidden">
<summary class="flex justify-between items-center cursor-pointer p-6 font-bold text-lg hover:bg-gray-100 transition">
<span>AI Automation คืออะไร?</span>
<span class="text-2xl group-open:rotate-45 transition">+</span>
</summary>
<div class="px-6 pb-6 text-gray-600">AI Automation คือการใช้ปัญญาประดิษฐ์เพื่อ自动化กระบวนการทำงาน ลดงานซ้ำซ้อน และเพิ่มประสิทธิภาพ</div>
</details>
<details class="group bg-gray-light rounded-2xl overflow-hidden">
<summary class="flex justify-between items-center cursor-pointer p-6 font-bold text-lg hover:bg-gray-100 transition">
<span>แชทบอทปิดการขายได้จริงหรือ?</span>
<span class="text-2xl group-open:rotate-45 transition">+</span>
</summary>
<div class="px-6 pb-6 text-gray-600">ได้จริง! Partner ของเรามีระบบที่สามารถแนะนำสินค้า ปิดการขาย และชำระเงินได้เองทั้งหมด</div>
</details>
<details class="group bg-gray-light rounded-2xl overflow-hidden">
<summary class="flex justify-between items-center cursor-pointer p-6 font-bold text-lg hover:bg-gray-100 transition">
<span>ใช้เวลานานแค่ไหน?</span>
<span class="text-2xl group-open:rotate-45 transition">+</span>
</summary>
<div class="px-6 pb-6 text-gray-600">โดยทั่วไป 2-4 สัปดาห์ ขึ้นอยู่กับความซับซ้อนของระบบ</div>
</details>
</div>
</div>
</section>
<!-- CTA -->
<section class="py-20 gradient-ai text-white">
<div class="container mx-auto px-4 text-center">
<h2 class="text-4xl font-bold mb-6">สนใจบริการนี้?</h2>
<h2 class="text-4xl font-bold mb-6">พร้อมเปลี่ยนองค์กรด้วย AI?</h2>
<p class="text-xl text-gray-100 mb-10">ปรึกษาฟรี เราพร้อมช่วยคุณ</p>
<div class="flex flex-col sm:flex-row gap-5 justify-center">
<a href="tel:0809955945" class="bg-white text-secondary px-8 py-4 rounded-full font-bold text-xl hover:bg-gray-100 transition shadow-xl">📞 080-995-5945</a>
<a href="tel:0809955945" class="bg-white text-accent-blue px-8 py-4 rounded-full font-bold text-xl hover:bg-gray-100 transition shadow-xl">📞 080-995-5945</a>
<a href="https://line.me/" class="bg-green-500 text-white px-8 py-4 rounded-full font-bold text-xl hover:bg-green-600 transition shadow-xl">💬 เพิ่ม Line</a>
</div>
</div>

View File

@@ -1,68 +0,0 @@
---
import Layout from '../layouts/Layout.astro'
---
<Layout title="ที่ปรึกษาองค์กร AI | MoreminiMore">
<section class="relative py-32 bg-gradient-ai text-white overflow-hidden">
<div class="absolute inset-0 opacity-20">
<img src="/images/hero/strategy-ai.png" alt="AI Transformation" class="w-full h-full object-cover" loading="eager" />
</div>
<div class="container mx-auto px-4 relative z-10">
<div class="max-w-4xl mx-auto text-center">
<div class="text-8xl mb-6">🏢</div>
<h1 class="text-5xl md:text-7xl font-bold mb-8">ที่ปรึกษาองค์กร AI</h1>
<p class="text-2xl text-gray-100 mb-10">บริการให้คำปรึกษาในการ ปรับองค์กรให้มีการใช้เทคโนโลยี AI มากขึ้น จนทำให้ได้ข้อมูลอย่างเป็นระบบ</p>
<div class="flex flex-col sm:flex-row gap-5 justify-center">
<a href="tel:0809955945" class="bg-white text-accent-blue px-8 py-4 rounded-full font-bold text-xl hover:bg-gray-100 transition shadow-xl inline-flex items-center justify-center gap-2">📞 080-995-5945</a>
<a href="https://line.me/" target="_blank" rel="noopener noreferrer" class="bg-green-500 text-white px-8 py-4 rounded-full font-bold text-xl hover:bg-green-600 transition shadow-xl inline-flex items-center justify-center gap-2">💬 เพิ่ม Line</a>
</div>
</div>
</div>
</section>
<section class="py-20 bg-white">
<div class="container mx-auto px-4 max-w-5xl">
<h2 class="text-4xl font-bold mb-8 text-center text-secondary">บริการให้คำปรึกษาองค์กร AI</h2>
<div class="prose prose-lg max-w-none">
<p class="text-xl text-gray-600 mb-8">
บริการให้คำปรึกษาในการ ปรับองค์กรให้มีการใช้เทคโนโลยี AI มากขึ้น จนทำให้ได้ข้อมูลอย่างเป็นระบบ และนำมาใช้ประโยชน์ในการบริหารได้ บริการนี้ เหมาะสำหรับองค์กรที่ต้องการพัฒนาตัวเองให้ทันต่อยุคสมัย
</p>
<h3 class="text-2xl font-bold mt-12 mb-6 text-accent-blue">สิ่งที่คุณจะได้รับ</h3>
<ul class="space-y-4 mb-8">
<li class="flex items-start gap-4">
<span class="text-primary text-2xl">✓</span>
<span><strong>ระบบข้อมูลอย่างเป็นระบบ:</strong> จัดการข้อมูลองค์กรให้สามารถนำมาใช้ประโยชน์ได้</span>
</li>
<li class="flex items-start gap-4">
<span class="text-primary text-2xl">✓</span>
<span><strong>การใช้ AI ในการบริหาร:</strong> นำ AI มาช่วยในการตัดสินใจทางธุรกิจ</span>
</li>
<li class="flex items-start gap-4">
<span class="text-primary text-2xl">✓</span>
<span><strong>พัฒนาองค์กรให้ทันยุค:</strong> ปรับตัวให้ทันกับเทคโนโลยีที่เปลี่ยนไป</span>
</li>
</ul>
<div class="bg-gray-light p-8 rounded-2xl my-12">
<h3 class="text-2xl font-bold mb-4 text-accent-blue">เหมาะสำหรับ</h3>
<ul class="space-y-2 text-gray-700">
<li>• องค์กรที่ต้องการพัฒนาตัวเองให้ทันต่อยุคสมัย</li>
<li>• ธุรกิจที่ต้องการใช้ข้อมูลในการบริหาร</li>
<li>• องค์กรที่ต้องการนำ AI มาใช้</li>
</ul>
</div>
</div>
</div>
</section>
<section class="py-20 gradient-ai text-white">
<div class="container mx-auto px-4 text-center">
<h2 class="text-4xl font-bold mb-6">สนใจบริการนี้?</h2>
<div class="flex flex-col sm:flex-row gap-5 justify-center">
<a href="tel:0809955945" class="bg-white text-accent-blue px-8 py-4 rounded-full font-bold text-xl hover:bg-gray-100 transition shadow-xl">📞 080-995-5945</a>
<a href="https://line.me/" class="bg-green-500 text-white px-8 py-4 rounded-full font-bold text-xl hover:bg-green-600 transition shadow-xl">💬 เพิ่ม Line</a>
</div>
</div>
</section>
</Layout>

View File

@@ -3,15 +3,16 @@ import Layout from '../layouts/Layout.astro'
---
<Layout title="พัฒนาแอปพลิเคชัน | MoreminiMore">
<!-- Hero -->
<section class="relative py-32 bg-gradient-to-br from-purple-50 to-pink-50 overflow-hidden">
<div class="absolute inset-0 opacity-20">
<img src="/images/hero/strategy-ai.png" alt="App" class="w-full h-full object-cover" loading="eager" />
<img src="/images/hero/strategy-ai.png" alt="App Development" class="w-full h-full object-cover" loading="eager" />
</div>
<div class="container mx-auto px-4 relative z-10">
<div class="max-w-4xl mx-auto text-center">
<div class="text-8xl mb-6">📲</div>
<h1 class="text-5xl md:text-7xl font-bold mb-8 text-secondary">พัฒนาแอปพลิเคชัน</h1>
<p class="text-2xl text-gray-600 mb-10">บริการพัฒนาแอปพลิเคชัน เพื่อตอบโจทย์ลูกค้าที่ต้องการทำตลาดจากอุปกรณ์โมบายต่าง ๆ</p>
<p class="text-2xl text-gray-600 mb-10">บริการพัฒนาแอปพลิเคชัน เพื่อตอบโจทย์ลูกค้าที่ต้องการทำตลาดจากอุปกรณ์โมบายต่าง ๆ รวมถึงการแก้ปัญหาเฉพาะด้าน</p>
<div class="flex flex-col sm:flex-row gap-5 justify-center">
<a href="tel:0809955945" class="btn-accent text-xl shadow-xl">📞 080-995-5945</a>
<a href="https://line.me/" class="btn-secondary text-xl shadow-xl">💬 เพิ่ม Line</a>
@@ -20,38 +21,101 @@ import Layout from '../layouts/Layout.astro'
</div>
</section>
<!-- Overview -->
<section class="py-20 bg-white">
<div class="container mx-auto px-4 max-w-5xl">
<h2 class="text-4xl font-bold mb-8 text-center text-secondary">บริการพัฒนาแอปพลิเคชัน</h2>
<h2 class="text-4xl font-bold mb-8 text-center text-secondary">แอปพลิเคชันเพื่อธุรกิจของคุณ</h2>
<div class="prose prose-lg max-w-none">
<p class="text-xl text-gray-600 mb-8">
บริการพัฒนาแอปพลิเคชัน เพื่อตอบโจทย์ลูกค้าที่ต้องการทำตลาดจากอุปกรณ์โมบายต่าง ๆ รวมถึงการแก้ปัญหาเฉพาะด้าน เช่น ระบบการเชื่อมต่อยอดขายระหว่าง SAP กับเว็บไซต์ เป็นต้น
</p>
<h3 class="text-2xl font-bold mt-12 mb-6 text-accent-blue">บริการของเรา</h3>
<ul class="space-y-4 mb-8">
<li class="flex items-start gap-4">
<span class="text-primary text-2xl">✓</span>
<span><strong>Mobile App:</strong> ทำตลาดจากอุปกรณ์โมบาย</span>
</li>
<li class="flex items-start gap-4">
<span class="text-primary text-2xl">✓</span>
<span><strong>แก้ปัญหาเฉพาะ:</strong> เช่น เชื่อม SAP กับเว็บไซต์</span>
</li>
<li class="flex items-start gap-4">
<span class="text-primary text-2xl">✓</span>
<span><strong>iOS & Android:</strong> ครบทุกแพลตฟอร์ม</span>
</li>
</ul>
<div class="grid md:grid-cols-2 gap-8 my-12">
<div class="bg-gray-light p-8 rounded-2xl">
<div class="text-5xl mb-4">🍎</div>
<h3 class="text-2xl font-bold mb-4">iOS App</h3>
<ul class="space-y-3 text-gray-600">
<li>• iPhone และ iPad</li>
<li>• Native Performance</li>
<li>• App Store Ready</li>
<li>• Swift / SwiftUI</li>
</ul>
</div>
<div class="bg-gray-light p-8 rounded-2xl">
<div class="text-5xl mb-4">🤖</div>
<h3 class="text-2xl font-bold mb-4">Android App</h3>
<ul class="space-y-3 text-gray-600">
<li>• มือถือและแท็บเล็ต</li>
<li>• ครอบคลุมทุกอุปกรณ์</li>
<li>• Google Play Ready</li>
<li>• Kotlin / Jetpack</li>
</ul>
</div>
</div>
</div>
</div>
</section>
<section class="py-20 gradient-ai text-white">
<!-- Features -->
<section class="py-20 bg-gray-light">
<div class="container mx-auto px-4 max-w-6xl">
<h2 class="text-4xl font-bold mb-12 text-center text-secondary">ฟีเจอร์ที่สามารถพัฒนาได้</h2>
<div class="grid md:grid-cols-3 gap-8">
<div class="bg-white p-8 rounded-2xl shadow-md">
<div class="text-5xl mb-4">🛒</div>
<h3 class="text-xl font-bold mb-3">E-Commerce</h3>
<p class="text-gray-600">ขายสินค้าในแอป ชำระเงิน ตัดสต็อก</p>
</div>
<div class="bg-white p-8 rounded-2xl shadow-md">
<div class="text-5xl mb-4">🔗</div>
<h3 class="text-xl font-bold mb-3">API Integration</h3>
<p class="text-gray-600">เชื่อม SAP, Accounting และระบบอื่นๆ</p>
</div>
<div class="bg-white p-8 rounded-2xl shadow-md">
<div class="text-5xl mb-4">📊</div>
<h3 class="text-xl font-bold mb-3">Dashboard</h3>
<p class="text-gray-600">Dashboard แสดงผลข้อมูล Real-time</p>
</div>
</div>
</div>
</section>
<!-- Process -->
<section class="py-20 bg-white">
<div class="container mx-auto px-4 max-w-6xl">
<h2 class="text-4xl font-bold mb-12 text-center text-secondary">กระบวนการพัฒนา</h2>
<div class="grid md:grid-cols-5 gap-6">
<div class="text-center">
<div class="w-16 h-16 mx-auto mb-4 rounded-full gradient-primary flex items-center justify-center text-3xl font-bold text-white">1</div>
<h3 class="text-lg font-bold mb-2">Requirement</h3>
</div>
<div class="text-center">
<div class="w-16 h-16 mx-auto mb-4 rounded-full gradient-ai flex items-center justify-center text-3xl font-bold text-white">2</div>
<h3 class="text-lg font-bold mb-2">Design</h3>
</div>
<div class="text-center">
<div class="w-16 h-16 mx-auto mb-4 rounded-full bg-accent-purple flex items-center justify-center text-3xl font-bold text-white">3</div>
<h3 class="text-lg font-bold mb-2">Develop</h3>
</div>
<div class="text-center">
<div class="w-16 h-16 mx-auto mb-4 rounded-full bg-accent-teal flex items-center justify-center text-3xl font-bold text-white">4</div>
<h3 class="text-lg font-bold mb-2">Test</h3>
</div>
<div class="text-center">
<div class="w-16 h-16 mx-auto mb-4 rounded-full bg-primary flex items-center justify-center text-3xl font-bold text-white">5</div>
<h3 class="text-lg font-bold mb-2">Deploy</h3>
</div>
</div>
</div>
</section>
<!-- CTA -->
<section class="py-20 gradient-primary text-white">
<div class="container mx-auto px-4 text-center">
<h2 class="text-4xl font-bold mb-6">สนใจบริการนี้?</h2>
<h2 class="text-4xl font-bold mb-6">สนใจพัฒนาแอปพลิเคชัน?</h2>
<p class="text-xl text-gray-100 mb-10">ปรึกษาฟรี เราพร้อมช่วยคุณ</p>
<div class="flex flex-col sm:flex-row gap-5 justify-center">
<a href="tel:0809955945" class="bg-white text-accent-blue px-8 py-4 rounded-full font-bold text-xl hover:bg-gray-100 transition shadow-xl">📞 080-995-5945</a>
<a href="tel:0809955945" class="bg-white text-secondary px-8 py-4 rounded-full font-bold text-xl hover:bg-gray-100 transition shadow-xl">📞 080-995-5945</a>
<a href="https://line.me/" class="bg-green-500 text-white px-8 py-4 rounded-full font-bold text-xl hover:bg-green-600 transition shadow-xl">💬 เพิ่ม Line</a>
</div>
</div>

View File

@@ -11,8 +11,8 @@ import Layout from '../layouts/Layout.astro'
</div>
<div class="container mx-auto px-4 relative z-10">
<div class="max-w-5xl mx-auto text-center">
<h1 class="text-5xl md:text-7xl font-bold mb-8 text-secondary leading-tight">เปลี่ยนองค์กรของคุณด้วย<br /><span class="text-accent-blue">AI Transformation</span></h1>
<p class="text-2xl md:text-3xl text-gray-600 mb-10 max-w-3xl mx-auto">เพิ่มยอดขาย ลดต้นทุน และยกระดับธุรกิจด้วยกลยุทธ์ AI ที่วัดผลได้</p>
<h1 class="text-5xl md:text-7xl font-bold mb-8 text-secondary leading-tight">เปลี่ยนองค์กรของคุณด้วย<br /><span class="text-accent-blue">AI & Technology</span></h1>
<p class="text-2xl md:text-3xl text-gray-600 mb-10 max-w-3xl mx-auto">เพิ่มยอดขาย ลดต้นทุน และยกระดับธุรกิจด้วยเทคโนโลยีที่วัดผลได้</p>
<div class="flex flex-col sm:flex-row gap-5 justify-center">
<a href="tel:0809955945" class="btn-accent text-xl shadow-xl">📞 ปรึกษาผู้เชี่ยวชาญ</a>
<a href="#services" class="btn-secondary text-xl shadow-xl">ดูบริการของเรา</a>
@@ -21,7 +21,7 @@ import Layout from '../layouts/Layout.astro'
</div>
</section>
<!-- Services Section - 5 Services (No Chatbot) -->
<!-- Services Section - 4 Services -->
<section id="services" class="py-20 bg-white">
<div class="container mx-auto px-4">
<div class="text-center mb-16">
@@ -29,76 +29,62 @@ import Layout from '../layouts/Layout.astro'
<p class="text-xl text-gray-600 max-w-3xl mx-auto">เพื่อตอบโจทย์ของลูกค้า</p>
</div>
<div class="grid md:grid-cols-2 lg:grid-cols-3 gap-8">
<div class="grid md:grid-cols-2 gap-8 max-w-6xl mx-auto">
<!-- Service 1: Website Development -->
<div class="bg-gray-light rounded-2xl overflow-hidden shadow-md card-hover">
<div class="h-48 relative">
<div class="h-64 relative">
<img src="/images/hero/training-ai.png" alt="Website" class="w-full h-full object-cover" loading="lazy" />
<div class="absolute inset-0 bg-accent-teal opacity-90"></div>
<div class="absolute inset-0 flex items-center justify-center text-8xl">💻</div>
</div>
<div class="p-6">
<div class="p-8">
<h3 class="text-2xl font-bold mb-3">พัฒนาเว็บไซต์</h3>
<p class="text-gray-600 mb-4">บริการพัฒนาเว็บไซต์ E-Commerce สำหรับธุรกิจ โดยคำนึงถึง UX/UI และการเชื่อมต่อกับเทคโนโลยีในอนาคต</p>
<a href="/website-development" class="text-accent-blue font-medium hover:underline flex items-center gap-2">รายละเอียด →</a>
</div>
</div>
<!-- Service 2: App Development -->
<!-- Service 2: AI Automation -->
<div class="bg-gray-light rounded-2xl overflow-hidden shadow-md card-hover">
<div class="h-48 relative">
<img src="/images/hero/strategy-ai.png" alt="App" class="w-full h-full object-cover" loading="lazy" />
<div class="h-64 relative">
<img src="/images/hero/chatbot-ai.png" alt="AI Automation" class="w-full h-full object-cover" loading="lazy" />
<div class="absolute inset-0 gradient-ai opacity-90"></div>
<div class="absolute inset-0 flex items-center justify-center text-8xl">🤖</div>
</div>
<div class="p-8">
<h3 class="text-2xl font-bold mb-3">AI Automation</h3>
<p class="text-gray-600 mb-4">บริการให้คำปรึกษาในการวางระบบ AI Automation และ Chatbot โดยใช้ AI ที่เหมาะสม Partner กับระบบบอทที่สามารถปิดการขายได้ด้วยตัวเอง</p>
<a href="/ai-automation" class="text-accent-blue font-medium hover:underline flex items-center gap-2">รายละเอียด →</a>
</div>
</div>
<!-- Service 3: App Development -->
<div class="bg-gray-light rounded-2xl overflow-hidden shadow-md card-hover">
<div class="h-64 relative">
<img src="/images/hero/strategy-ai.png" alt="App" class="w-full h-full object-cover" loading="lazy" />
<div class="absolute inset-0 gradient-primary opacity-90"></div>
<div class="absolute inset-0 flex items-center justify-center text-8xl">📲</div>
</div>
<div class="p-6">
<div class="p-8">
<h3 class="text-2xl font-bold mb-3">พัฒนาแอปพลิเคชัน</h3>
<p class="text-gray-600 mb-4">บริการพัฒนาแอปพลิเคชัน เพื่อตอบโจทย์ลูกค้าที่ต้องการทำตลาดจากอุปกรณ์โมบายต่าง ๆ</p>
<a href="/app-development" class="text-accent-blue font-medium hover:underline flex items-center gap-2">รายละเอียด →</a>
</div>
</div>
<!-- Service 3: AI Transformation -->
<!-- Service 4: Marketing Consult -->
<div class="bg-gray-light rounded-2xl overflow-hidden shadow-md card-hover">
<div class="h-48 relative">
<img src="/images/hero/strategy-ai.png" alt="AI Transformation" class="w-full h-full object-cover" loading="lazy" />
<div class="absolute inset-0 gradient-ai opacity-90"></div>
<div class="absolute inset-0 flex items-center justify-center text-8xl">🏢</div>
</div>
<div class="p-6">
<h3 class="text-2xl font-bold mb-3">ที่ปรึกษาองค์กร AI</h3>
<p class="text-gray-600 mb-4">บริการให้คำปรึกษาในการ ปรับองค์กรให้มีการใช้เทคโนโลยี AI มากขึ้น จนทำให้ได้ข้อมูลอย่างเป็นระบบ</p>
<a href="/ai-transformation-consult" class="text-accent-blue font-medium hover:underline flex items-center gap-2">รายละเอียด →</a>
</div>
</div>
<!-- Service 4: Online Marketing -->
<div class="bg-gray-light rounded-2xl overflow-hidden shadow-md card-hover">
<div class="h-48 relative">
<div class="h-64 relative">
<img src="/images/hero/automation-ai.png" alt="Marketing" class="w-full h-full object-cover" loading="lazy" />
<div class="absolute inset-0 gradient-primary opacity-90"></div>
<div class="absolute inset-0 bg-accent-purple opacity-90"></div>
<div class="absolute inset-0 flex items-center justify-center text-8xl">📱</div>
</div>
<div class="p-6">
<div class="p-8">
<h3 class="text-2xl font-bold mb-3">ที่ปรึกษาการตลาดออนไลน์</h3>
<p class="text-gray-600 mb-4">บริการให้คำปรึกษาในการวางกลยุทธ์การตลาดออนไลน์ โดยใช้ข้อมูลขององค์กรเป็นพื้นฐาน</p>
<a href="/online-marketing-consult" class="text-accent-blue font-medium hover:underline flex items-center gap-2">รายละเอียด →</a>
</div>
</div>
<!-- Service 5: AI Automation -->
<div class="bg-gray-light rounded-2xl overflow-hidden shadow-md card-hover">
<div class="h-48 relative">
<img src="/images/hero/chatbot-ai.png" alt="AI Automation" class="w-full h-full object-cover" loading="lazy" />
<div class="absolute inset-0 gradient-primary opacity-90"></div>
<div class="absolute inset-0 flex items-center justify-center text-8xl">⚙️</div>
</div>
<div class="p-6">
<h3 class="text-2xl font-bold mb-3">AI Automation</h3>
<p class="text-gray-600 mb-4">บริการให้คำปรึกษาในการวางระบบแชทบอท โดยใช้ AI ที่เหมาะสม Partner กับระบบบอทที่สามารถปิดการขายได้ด้วยตัวเอง</p>
<a href="/ai-automation" class="text-accent-blue font-medium hover:underline flex items-center gap-2">รายละเอียด →</a>
</div>
</div>
</div>
</div>
</section>
@@ -119,37 +105,30 @@ import Layout from '../layouts/Layout.astro'
</div>
</section>
<!-- Process Section - New Grid Layout -->
<!-- Process Section -->
<section id="process" class="py-20 bg-white">
<div class="container mx-auto px-4">
<div class="text-center mb-16">
<h2 class="text-4xl md:text-5xl font-bold mb-4 text-secondary">กระบวนการทำงาน</h2>
<p class="text-xl text-gray-600 max-w-3xl mx-auto">4 ขั้นตอนง่ายๆ สู่การเป็นองค์กร AI</p>
<p class="text-xl text-gray-600 max-w-3xl mx-auto">4 ขั้นตอนง่ายๆ สู่ความสำเร็จ</p>
</div>
<div class="grid md:grid-cols-2 lg:grid-cols-4 gap-8 max-w-6xl mx-auto">
<!-- Step 1 -->
<div class="text-center p-8 bg-gray-light rounded-2xl card-hover">
<div class="w-20 h-20 mx-auto mb-6 rounded-full gradient-primary flex items-center justify-center text-4xl font-bold text-white shadow-xl">1</div>
<h3 class="text-2xl font-bold mb-3">วิเคราะห์</h3>
<p class="text-gray-600">ศึกษาธุรกิจ วิเคราะห์ปัญหา หาโอกาสใช้ AI</p>
<p class="text-gray-600">ศึกษาธุรกิจ วิเคราะห์ปัญหา หาโอกาส</p>
</div>
<!-- Step 2 -->
<div class="text-center p-8 bg-gray-light rounded-2xl card-hover">
<div class="w-20 h-20 mx-auto mb-6 rounded-full gradient-ai flex items-center justify-center text-4xl font-bold text-white shadow-xl">2</div>
<h3 class="text-2xl font-bold mb-3">วางแผน</h3>
<p class="text-gray-600">ออกแบบกลยุทธ์ AI Roadmap ที่ชัดเจน</p>
<p class="text-gray-600">ออกแบบกลยุทธ์ Roadmap ที่ชัดเจน</p>
</div>
<!-- Step 3 -->
<div class="text-center p-8 bg-gray-light rounded-2xl card-hover">
<div class="w-20 h-20 mx-auto mb-6 rounded-full bg-accent-purple flex items-center justify-center text-4xl font-bold text-white shadow-xl">3</div>
<h3 class="text-2xl font-bold mb-3">ดำเนินการ</h3>
<p class="text-gray-600">ติดตั้งระบบ AI ฝึกอบรมทีม เริ่มใช้งาน</p>
<p class="text-gray-600">ติดตั้งระบบ ฝึกอบรมทีม เริ่มใช้งาน</p>
</div>
<!-- Step 4 -->
<div class="text-center p-8 bg-gray-light rounded-2xl card-hover">
<div class="w-20 h-20 mx-auto mb-6 rounded-full bg-accent-teal flex items-center justify-center text-4xl font-bold text-white shadow-xl">4</div>
<h3 class="text-2xl font-bold mb-3">วัดผล</h3>

View File

@@ -3,9 +3,10 @@ import Layout from '../layouts/Layout.astro'
---
<Layout title="พัฒนาเว็บไซต์ | MoreminiMore">
<!-- Hero -->
<section class="relative py-32 bg-gradient-hero overflow-hidden">
<div class="absolute inset-0 opacity-20">
<img src="/images/hero/training-ai.png" alt="Website" class="w-full h-full object-cover" loading="eager" />
<img src="/images/hero/training-ai.png" alt="Website Development" class="w-full h-full object-cover" loading="eager" />
</div>
<div class="container mx-auto px-4 relative z-10">
<div class="max-w-4xl mx-auto text-center">
@@ -20,36 +21,97 @@ import Layout from '../layouts/Layout.astro'
</div>
</section>
<!-- Overview -->
<section class="py-20 bg-white">
<div class="container mx-auto px-4 max-w-5xl">
<h2 class="text-4xl font-bold mb-8 text-center text-secondary">บริการพัฒนาเว็บไซต์</h2>
<h2 class="text-4xl font-bold mb-8 text-center text-secondary">เว็บไซต์มืออาชีพ เพื่อธุรกิจของคุณ</h2>
<div class="prose prose-lg max-w-none">
<p class="text-xl text-gray-600 mb-8">
บริการพัฒนาเว็บไซต์ E-Commerce สำหรับธุรกิจ โดยคำนึงถึง UX/UI และการเชื่อมต่อกับเทคโนโลยีในอนาคต เช่น การเชื่อมข้อมูลสินค้าและยอดขายกับระบบบัญชี เป็นต้น
</p>
<h3 class="text-2xl font-bold mt-12 mb-6 text-accent-blue">คุณสมบัติ</h3>
<ul class="space-y-4 mb-8">
<li class="flex items-start gap-4">
<span class="text-primary text-2xl">✓</span>
<span><strong>UX/UI ดี:</strong> ออกแบบให้ใช้งานง่าย สวยงาม</span>
</li>
<li class="flex items-start gap-4">
<span class="text-primary text-2xl"></span>
<span><strong>เชื่อมต่อระบบ:</strong> เชื่อมข้อมูลกับระบบบัญชีและอื่นๆ</span>
</li>
<li class="flex items-start gap-4">
<span class="text-primary text-2xl">✓</span>
<span><strong>E-Commerce:</strong> ขายออนไลน์ได้ทันที</span>
</li>
</ul>
<div class="grid md:grid-cols-3 gap-8 my-12">
<div class="text-center p-6 bg-gray-light rounded-2xl">
<div class="text-5xl mb-4">🎨</div>
<h3 class="text-xl font-bold mb-2">UX/UI Design</h3>
<p class="text-gray-600">ออกแบบให้ใช้งานง่าย สวยงาม</p>
</div>
<div class="text-center p-6 bg-gray-light rounded-2xl">
<div class="text-5xl mb-4"></div>
<h3 class="text-xl font-bold mb-2">Performance</h3>
<p class="text-gray-600">โหลดเร็ว SEO-ready</p>
</div>
<div class="text-center p-6 bg-gray-light rounded-2xl">
<div class="text-5xl mb-4">🔗</div>
<h3 class="text-xl font-bold mb-2">Integration</h3>
<p class="text-gray-600">เชื่อมระบบบัญชี SAP ฯลฯ</p>
</div>
</div>
</div>
</div>
</section>
<!-- Features -->
<section class="py-20 bg-gray-light">
<div class="container mx-auto px-4 max-w-6xl">
<h2 class="text-4xl font-bold mb-12 text-center text-secondary">คุณสมบัติเว็บไซต์</h2>
<div class="grid md:grid-cols-2 gap-8">
<div class="bg-white p-8 rounded-2xl shadow-md">
<h3 class="text-2xl font-bold mb-4 text-accent-blue">E-Commerce</h3>
<ul class="space-y-3 text-gray-600">
<li class="flex items-start gap-3"><span class="text-primary text-xl">✓</span> ระบบตระกร้าสินค้า</li>
<li class="flex items-start gap-3"><span class="text-primary text-xl">✓</span> ชำระเงินออนไลน์</li>
<li class="flex items-start gap-3"><span class="text-primary text-xl">✓</span> จัดการออเดอร์</li>
<li class="flex items-start gap-3"><span class="text-primary text-xl">✓</span> ระบบสมาชิก</li>
</ul>
</div>
<div class="bg-white p-8 rounded-2xl shadow-md">
<h3 class="text-2xl font-bold mb-4 text-accent-blue">Technical</h3>
<ul class="space-y-3 text-gray-600">
<li class="flex items-start gap-3"><span class="text-primary text-xl">✓</span> Responsive Design</li>
<li class="flex items-start gap-3"><span class="text-primary text-xl">✓</span> SSL Security</li>
<li class="flex items-start gap-3"><span class="text-primary text-xl">✓</span> SEO Optimization</li>
<li class="flex items-start gap-3"><span class="text-primary text-xl">✓</span> Fast Loading</li>
</ul>
</div>
</div>
</div>
</section>
<!-- Process -->
<section class="py-20 bg-white">
<div class="container mx-auto px-4 max-w-6xl">
<h2 class="text-4xl font-bold mb-12 text-center text-secondary">กระบวนการทำงาน</h2>
<div class="grid md:grid-cols-4 gap-8">
<div class="text-center">
<div class="w-20 h-20 mx-auto mb-6 rounded-full gradient-primary flex items-center justify-center text-4xl font-bold text-white">1</div>
<h3 class="text-xl font-bold mb-2">วิเคราะห์</h3>
<p class="text-gray-600">ศึกษาความต้องการ</p>
</div>
<div class="text-center">
<div class="w-20 h-20 mx-auto mb-6 rounded-full gradient-ai flex items-center justify-center text-4xl font-bold text-white">2</div>
<h3 class="text-xl font-bold mb-2">ออกแบบ</h3>
<p class="text-gray-600">UX/UI Design</p>
</div>
<div class="text-center">
<div class="w-20 h-20 mx-auto mb-6 rounded-full bg-accent-purple flex items-center justify-center text-4xl font-bold text-white">3</div>
<h3 class="text-xl font-bold mb-2">พัฒนา</h3>
<p class="text-gray-600">Coding & Testing</p>
</div>
<div class="text-center">
<div class="w-20 h-20 mx-auto mb-6 rounded-full bg-accent-teal flex items-center justify-center text-4xl font-bold text-white">4</div>
<h3 class="text-xl font-bold mb-2">ส่งมอบ</h3>
<p class="text-gray-600">Launch & Support</p>
</div>
</div>
</div>
</section>
<!-- CTA -->
<section class="py-20 gradient-ai text-white">
<div class="container mx-auto px-4 text-center">
<h2 class="text-4xl font-bold mb-6">สนใจบริการนี้?</h2>
<h2 class="text-4xl font-bold mb-6">สนใจพัฒนาเว็บไซต์?</h2>
<p class="text-xl text-gray-100 mb-10">ปรึกษาฟรี เราพร้อมช่วยคุณ</p>
<div class="flex flex-col sm:flex-row gap-5 justify-center">
<a href="tel:0809955945" class="bg-white text-accent-blue px-8 py-4 rounded-full font-bold text-xl hover:bg-gray-100 transition shadow-xl">📞 080-995-5945</a>
<a href="https://line.me/" class="bg-green-500 text-white px-8 py-4 rounded-full font-bold text-xl hover:bg-green-600 transition shadow-xl">💬 เพิ่ม Line</a>