kunthawat/dealplustech-astro
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Activity

Fix all product pages with REAL crawled content

Browse Source 
✅ Regenerated 34 product pages with actual crawled content
✅ Mapped correct product images to each page (1,348 images)
✅ Green color theme from original logo
✅ Mega menu with proper categories
✅ Homepage with PPR product images (not banners)
✅ Footer with main categories only
✅ Logo without text

Fixed issues:
- All product pages now use REAL content from dealplustech.co.th
- Product images mapped correctly (not logo!)
- Green theme (#3f8b6d) matches original website
- All 1,348 images available in /images/products-misc/
This commit is contained in:
Kunthawat
2026-03-14 09:43:06 +07:00
parent e9ed033754
commit ee4f3e9c51
40 changed files with 8286 additions and 374 deletions
Download Patch File Download Diff File Expand all files Collapse all files

103
src/pages/index.astro
View File

@@ -2,100 +2,90 @@
import BaseLayout from '@/layouts/BaseLayout.astro';
import Header from '@/components/common/Header.astro';
import Footer from '@/components/common/Footer.astro';
const categories = [
{ name: 'ท่อ PPR', slug: '/ท่อ-ppr-thai-ppr', image: '/images/products/ppr-pipe/foot-ppr1.jpg' },
{ name: 'ท่อ HDPE', slug: '/ท่อhdpe', image: '/images/products/hdpe-pipe/hdpe001.jpg' },
{ name: 'ท่อ PVC', slug: '/ท่อและข้อต่อpvc', image: '/images/products/pvc-pipe/pvc-pipe_000C.jpg' },
{ name: 'ท่อ UPVC', slug: '/ท่อ-upvc', image: '/images/products/upvc-pipe/upvc-pipe_000C.jpg' },
{ name: 'วาล์ว', slug: '/วาล์ว-valve', image: '/images/products/valve/valve_000C.jpg' },
{ name: 'ปั๊มน้ำ', slug: '/water-pump', image: '/images/products/water-pump/water-pump_000C.jpg' },
{ name: 'ระบบรั้ว', slug: '/ระบบรั้ว', image: '/images/products/fence/vineman_000C.jpg' },
{ name: 'เครื่องเชื่อมท่อ', slug: '/เครื่องเชื่อมท่อ-pipe-coupling-machine', image: '/images/products/pipe-coupling/pipe-coupling-machine_000.jpg' },
];
---
<BaseLayout title="หน้าแรก">
<Header slot="header" />
<!-- Hero Section -->
<section class="relative gradient-bg section overflow-hidden">
<!-- Hero Section with PPR Product Images -->
<section class="relative bg-gradient-to-br from-green-50 via-white to-accent-50 section overflow-hidden">
<div class="container-custom">
<div class="grid lg:grid-cols-2 gap-12 items-center">
<div class="animate-fade-in">
<h1 class="text-4xl md:text-5xl lg:text-6xl font-bold text-secondary-900 mb-6 leading-tight">
ผู้เชี่ยวชาญระบบน้ำ<br/>
<span class="gradient-text">คุณภาพสูง ราคาโรงงาน</span>
<span class="text-green-600">คุณภาพสูง ราคาโรงงาน</span>
</h1>
<p class="text-xl text-secondary-600 mb-8 leading-relaxed">
บริษัท ดีล พลัส เทค จำกัด เราเป็นผู้เชี่ยวชาญด้านระบบน้ำ ให้คำแนะนำและจำหน่ายท่อ PPR ตราช้าง ท่อพีพีอาร์ ท่อ HDPE Thai PPR รั้วตาข่าย คุณภาพสูง ราคาถูก
</p>
<div class="flex flex-wrap gap-4">
<a href="/product" class="btn-primary text-lg px-8 py-4">ดูสินค้าทั้งหมด</a>
<a href="/contact-us" class="btn-secondary text-lg px-8 py-4">ติดต่อเรา</a>
<a href="/pipe" class="bg-green-600 hover:bg-green-700 text-white px-8 py-4 rounded-xl font-medium transition-all hover:shadow-lg active:scale-95 text-lg">ดูสินค้าทั้งหมด</a>
<a href="/contact-us" class="bg-white text-green-600 px-8 py-4 rounded-xl border-2 border-green-500 font-medium transition-all hover:shadow-lg active:scale-95 text-lg">ติดต่อเรา</a>
</div>
<div class="flex items-center space-x-8 mt-12">
<div>
<div class="text-3xl font-bold text-primary-600">10+</div>
<div class="text-3xl font-bold text-green-600">10+</div>
<div class="text-secondary-600 text-base">ปีประสบการณ์</div>
</div>
<div>
<div class="text-3xl font-bold text-primary-600">1000+</div>
<div class="text-3xl font-bold text-green-600">1000+</div>
<div class="text-secondary-600 text-base">โปรเจคต์</div>
</div>
<div>
<div class="text-3xl font-bold text-primary-600">500+</div>
<div class="text-3xl font-bold text-green-600">500+</div>
<div class="text-secondary-600 text-base">สินค้า</div>
</div>
</div>
</div>
<div class="relative animate-slide-up">
<div class="absolute inset-0 bg-gradient-to-br from-primary-500/20 to-accent-500/20 rounded-3xl blur-3xl"></div>
<img src="/images/logo/logox2.png" alt="Deal Plus Tech Products" class="relative w-full h-auto rounded-3xl shadow-2xl" />
<div class="absolute inset-0 bg-gradient-to-br from-green-500/20 to-accent-500/20 rounded-3xl blur-3xl"></div>
<div class="grid grid-cols-2 gap-4">
<img src="/images/products/ppr-pipe/foot-ppr1.jpg" alt="PPR Pipe" class="w-full h-auto rounded-2xl shadow-xl" />
<img src="/images/products/ppr-pipe/TPPR55.jpg" alt="PPR Fittings" class="w-full h-auto rounded-2xl shadow-xl" />
<img src="/images/products/ppr-pipe/ppr0001.jpg" alt="PPR System" class="w-full h-auto rounded-2xl shadow-xl" />
<img src="/images/products/ppr-pipe/ppr-pipe_000C.jpg" alt="PPR Installation" class="w-full h-auto rounded-2xl shadow-xl" />
</div>
</div>
</div>
</div>
</section>
<!-- Featured Categories -->
<!-- Product Categories -->
<section class="section bg-white">
<div class="container-custom">
<div class="text-center mb-16">
<h2 class="section-title">หมวดหมู่สินค้ายอดนิยม</h2>
<p class="section-subtitle mx-auto">เราจำหน่ายสินค้าระบบน้ำคุณภาพสูง ครบวงจร</p>
</div>
<div class="grid grid-cols-2 md:grid-cols-3 lg:grid-cols-4 gap-6">
<a href="/ท่อ-ppr-thai-ppr" class="product-card group">
<div class="product-card-image">
<img src="/images/products/ppr-pipe/ppr0001.jpg" alt="ท่อ PPR" />
</div>
<div class="p-6">
<h3 class="text-xl font-bold text-secondary-900 group-hover:text-primary-600 transition-colors">ท่อ PPR</h3>
<p class="text-secondary-600 text-base mt-2">ท่อพีพีอาร์ ตราช้าง</p>
</div>
</a>
<a href="/ท่อhdpe" class="product-card group">
<div class="product-card-image">
<img src="/images/products/hdpe-pipe/hdpe001.jpg" alt="ท่อ HDPE" />
</div>
<div class="p-6">
<h3 class="text-xl font-bold text-secondary-900 group-hover:text-primary-600 transition-colors">ท่อ HDPE</h3>
<p class="text-secondary-600 text-base mt-2">ท่อโพลีเอทิลีน</p>
</div>
</a>
<a href="/ท่อและข้อต่อpvc" class="product-card group">
<div class="product-card-image">
<img src="/images/products/pvc-pipe/pvc001.jpg" alt="ท่อ PVC" />
</div>
<div class="p-6">
<h3 class="text-xl font-bold text-secondary-900 group-hover:text-primary-600 transition-colors">ท่อ PVC</h3>
<p class="text-secondary-600 text-base mt-2">ท่อและข้อต่อพีวีซี</p>
</div>
</a>
<a href="/วาล์ว-valve" class="product-card group">
<div class="product-card-image">
<img src="/images/products/valve/valve001.jpg" alt="วาล์ว" />
</div>
<div class="p-6">
<h3 class="text-xl font-bold text-secondary-900 group-hover:text-primary-600 transition-colors">วาล์ว</h3>
<p class="text-secondary-600 text-base mt-2">วาล์วน้ำทุกประเภท</p>
</div>
</a>
<div class="grid grid-cols-2 md:grid-cols-4 gap-6">
{categories.map(cat => (
<a href={cat.slug} class="product-card group">
<div class="product-card-image">
<img src={cat.image} alt={cat.name} onerror="this.src='/images/logo/dealplustech-logo.png'" />
</div>
<div class="p-6">
<h3 class="text-xl font-bold text-secondary-900 group-hover:text-green-600 transition-colors">{cat.name}</h3>
</div>
</a>
))}
</div>
</div>
</section>
<!-- Why Choose Us -->
<section class="section gradient-bg">
<section class="section bg-gradient-to-br from-green-50 via-white to-accent-50">
<div class="container-custom">
<div class="text-center mb-16">
<h2 class="section-title">ทำไมต้องเลือกเรา</h2>
@@ -103,8 +93,8 @@ import Footer from '@/components/common/Footer.astro';
</div>
<div class="grid md:grid-cols-3 gap-8">
<div class="card p-8 text-center animate-on-scroll">
<div class="w-16 h-16 bg-primary-100 rounded-2xl flex items-center justify-center mx-auto mb-6">
<svg class="w-8 h-8 text-primary-600" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<div class="w-16 h-16 bg-green-100 rounded-2xl flex items-center justify-center mx-auto mb-6">
<svg class="w-8 h-8 text-green-600" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 12l2 2 4-4m6 2a9 9 0 11-18 0 9 9 0 0118 0z" />
</svg>
</div>
@@ -112,8 +102,8 @@ import Footer from '@/components/common/Footer.astro';
<p class="text-secondary-600 text-base">สินค้าคุณภาพมาตรฐาน มั่นใจได้ในความทนทาน</p>
</div>
<div class="card p-8 text-center animate-on-scroll">
<div class="w-16 h-16 bg-primary-100 rounded-2xl flex items-center justify-center mx-auto mb-6">
<svg class="w-8 h-8 text-primary-600" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<div class="w-16 h-16 bg-green-100 rounded-2xl flex items-center justify-center mx-auto mb-6">
<svg class="w-8 h-8 text-green-600" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 8c-1.657 0-3 .895-3 2s1.343 2 3 2 3 .895 3 2-1.343 2-3 2m0-8c1.11 0 2.08.402 2.599 1M12 8V7m0 1v8m0 0v1m0-1c-1.11 0-2.08-.402-2.599-1M21 12a9 9 0 11-18 0 9 9 0 0118 0z" />
</svg>
</div>
@@ -121,13 +111,13 @@ import Footer from '@/components/common/Footer.astro';
<p class="text-secondary-600 text-base">ราคาแข่งขันได้ คุ้มค่าต่อการลงทุน</p>
</div>
<div class="card p-8 text-center animate-on-scroll">
<div class="w-16 h-16 bg-primary-100 rounded-2xl flex items-center justify-center mx-auto mb-6">
<svg class="w-8 h-8 text-primary-600" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<div class="w-16 h-16 bg-green-100 rounded-2xl flex items-center justify-center mx-auto mb-6">
<svg class="w-8 h-8 text-green-600" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M13 10V3L4 14h7v7l9-11h-7z" />
</svg>
</div>
<h3 class="text-2xl font-bold text-secondary-900 mb-4">จัดส่งรวดเร็ว</h3>
<p class="text-secondary-600 text-base">จัดส่งทันใจ ส่งฟรี กทม. และปริมณฑล</p>
<p class="text-secondary-600 text-base">จัดส่งทันใจ ส่งฟรี กทม. ปริมณฑล</p>
</div>
</div>
</div>
@@ -137,7 +127,6 @@ import Footer from '@/components/common/Footer.astro';
</BaseLayout>
<script>
// Intersection Observer for scroll animations
const observer = new IntersectionObserver(
entries => {
entries.forEach(entry => {