Files
dealplustech-astroreal/src/pages/วาล์ว-valve.astro
Kunthawat Greethong ea36f28c17 fix(hero): remove duplicate old CTAs from 19 product pages
Old CTAs (e.g. 'สนใจสินค้าของเรา?', 'สอบถามราคาและสั่งซื้อ',
'sนใจรั้วเทวดา?') were still present above the canonical CTA
section added in 17f4eb7. Each page now has exactly one CTA.

Deleted section types:
  - 12x section gradient (สนใจสินค้าของเรา?)
  -  5x section gradient (สนใจสินค้านี้? — different buttons)
  -  3x box bg-primary-50 (สอบถามราคาและสั่งซื้อ)
  -  2x accent gradient sections
  -  1x div-based (ตู้ดับเพลิง — special format)

Verified: new CTA intact, no duplicate headings, build 40/40 OK,
HTML render: 20/20 have correct single CTA with 2 buttons.
2026-06-10 10:30:00 +07:00

240 lines
22 KiB
Plaintext

---
import BaseLayout from '@/layouts/BaseLayout.astro';
---
<BaseLayout title="วาล์ว (Valve) - วาล์วน้ำทุกประเภท" description="จำหน่ายวาล์ว (Valve) - วาล์วน้ำทุกประเภทคุณภาพสูง ราคาโรงงาน ส่งฟรี กทม. ปริมณฑล"
product={{
name: 'วาล์ว (Valve) - วาล์วน้ำทุกประเภท',
image: '/images/products-cropped/valve_000C.jpg',
brand: 'Generic',
}}
faq={[
{ question: 'Ball Valve กับ Gate Valve ต่างกันอย่างไร?', answer: 'Ball Valve เปิด-ปิดเร็วด้วยการหมุน 90 องศา ส่วน Gate Valve เปิด-ปิดค่อยเป็นค่อยไปด้วยการหมุนบังคับหลายรอบ Gate Valve กันย้อนได้ดีกว่า' },
{ question: 'วาล์วขนาดเลือกอย่างไร?', answer: 'ขนาดวาล์วควรเท่ากับขนาดท่อ หรือเล็กกว่าหนึ่งขนาดสำหรับงานควบคุม' },
{ question: 'วาล์ว Brass กับ PVC ต่างกันอย่างไร?', answer: 'Brass แข็งแรงทนแรงดันสูง เหมาะกับงานที่ต้องการความทนทาน PVC ราคาถูกกว่า เหมาะกับงานทั่วไปแรงดันต่ำ' },
]}>
<main class="bg-white min-h-screen">
<!-- Product Hero Section -->
<!-- Hero Section -->
<section class="relative bg-gradient-to-br from-primary-800 via-primary-700 to-primary-900 text-white py-16 lg:py-24 overflow-hidden">
<div class="absolute inset-0 overflow-hidden pointer-events-none">
<div class="absolute top-1/2 left-1/2 -translate-x-1/2 -translate-y-1/2 w-[800px] h-[800px] bg-gradient-to-br from-primary-400/30 via-primary-500/15 to-transparent rounded-full blur-[100px] animate-mesh-1"></div>
<div class="absolute top-1/4 left-1/4 w-2 h-2 bg-white/30 rounded-full animate-float"></div>
<div class="absolute top-1/3 right-1/4 w-3 h-3 bg-primary-300/20 rounded-full animate-float-delayed-1"></div>
<div class="absolute top-2/3 left-1/3 w-2 h-2 bg-primary-200/20 rounded-full animate-float-delayed-2"></div>
<svg class="absolute bottom-0 left-0 w-full h-[250px] opacity-20" viewBox="0 0 1440 250" preserveAspectRatio="none">
<path d="M0,150 Q360,50 720,150 T1440,150 L1440,250 L0,250 Z" fill="none" stroke="url(#water-gradient-hero)" stroke-width="2">
<animate attributeName="d" dur="10s" repeatCount="indefinite" values="M0,150 Q360,50 720,150 T1440,150 L1440,250 L0,250 Z;M0,180 Q360,80 720,180 T1440,180 L1440,250 L0,250 Z;M0,150 Q360,50 720,150 T1440,150 L1440,250 L0,250 Z"/>
</path>
<defs>
<linearGradient id="water-gradient-hero" x1="0%" y1="0%" x2="100%" y2="0%">
<stop offset="0%" stop-color="#40916c"/>
<stop offset="50%" stop-color="#74c69d"/>
<stop offset="100%" stop-color="#40916c"/>
</linearGradient>
</defs>
</svg>
<svg class="absolute bottom-0 left-0 w-full h-[200px] opacity-10" viewBox="0 0 1440 200" preserveAspectRatio="none">
<path d="M0,100 Q240,200 480,100 T960,100 T1440,100 L1440,200 L0,200 Z" fill="none" stroke="rgba(255,255,255,0.3)" stroke-width="1">
<animate attributeName="d" dur="15s" repeatCount="indefinite" values="M0,100 Q240,200 480,100 T960,100 T1440,100 L1440,200 L0,200 Z;M0,120 Q240,20 480,120 T960,120 T1440,120 L1440,200 L0,200 Z;M0,100 Q240,200 480,100 T960,100 T1440,100 L1440,200 L0,200 Z"/>
</path>
</svg>
</div>
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 relative z-10">
<div class="grid lg:grid-cols-2 gap-12 items-start">
<div>
<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">วาล์ว (Valve) - วาล์วน้ำทุกประเภท</h1>
<p class="text-lg text-primary-100 mb-8 leading-relaxed">
จำหน่ายวาล์ว (Valve) - วาล์วน้ำทุกประเภทคุณภาพสูง ราคาโรงงาน ส่งฟรี กรุงเทพมหานคร และปริมณฑล
</p>
<div class="flex flex-wrap justify-center gap-6 mb-8 lg:justify-start">
<div class="flex items-start gap-2 text-white">
<svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7" />
</svg>
<span>คุณภาพสูง มาตรฐานอุตสาหกรรม</span>
</div>
<div class="flex items-start gap-2 text-white">
<svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7" />
</svg>
<span>ราคาโรงงาน คุ้มค่า</span>
</div>
<div class="flex items-start gap-2 text-white">
<svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7" />
</svg>
<span>จัดส่งรวดเร็ว ส่งฟรี กทม. ปริมณฑล</span>
</div>
<div class="flex items-start gap-2 text-white">
<svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7" />
</svg>
<span>รับประกันสินค้า</span>
</div>
</div>
<div class="flex flex-wrap justify-center gap-4 mb-8 lg:justify-start">
<a href="https://line.me/ti/p/~JPPSELECTION" target="_blank" rel="noopener" class="bg-accent-500 hover:bg-accent-600 text-white py-3 px-6 rounded-xl font-semibold flex items-center gap-2">
<svg class="w-5 h-5" fill="currentColor" viewBox="0 0 24 24"><path d="M19.365 9.863c.349 0 .63.285.63.631 0 .345-.281.63-.63.63H17.61v1.125h1.755c.349 0 .63.283.63.63 0 .344-.281.629-.63.629h-2.386c-.345 0-.627-.285-.627-.629V8.108c0-.344.282-.629.627-.629h2.386c.349 0 .63.285.63.63 0 .349-.281.63-.63.63H17.61v1.125h1.755zm-3.855 3.016c0 .27-.174.51-.432.596-.064.021-.133.031-.199.031-.211 0-.391-.09-.51-.25l-2.443-3.317v2.94c0 .344-.279.629-.631.629-.346 0-.626-.285-.626-.629V8.108c0-.27.173-.51.43-.595.06-.023.136-.033.194-.033.195 0 .375.104.495.254l2.462 3.33V8.108c0-.345.282-.629.63-.629.345 0 .63.284.63.629v4.771zm-5.741 0c0 .344-.282.629-.631.629-.345 0-.627-.285-.627-.629V8.108c0-.345.282-.629.627-.629.349 0 .631.284.631.629v4.771zm-2.466.629H4.917c-.345 0-.63-.285-.63-.629V8.108c0-.345.285-.629.63-.629.348 0 .63.284.63.629v4.141h1.756c.348 0 .629.283.629.63 0 .344-.282.629-.629.629M24 10.314C24 4.943 18.615.572 12 .572S0 4.943 0 10.314c0 4.811 4.27 8.842 10.035 9.608.391.082.923.258 1.058.59.12.301.079.766.038 1.08l-.164 1.02c-.045.301-.24 1.186 1.049.645 1.291-.539 6.916-4.078 9.436-6.975C23.176 14.393 24 12.458 24 10.314"/></svg>
แชท Line
</a>
<a href="tel:0905551415" class="bg-white text-primary-700 hover:bg-primary-50 py-3 px-6 rounded-xl font-semibold flex items-center gap-2">
<svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M3 5a2 2 0 012-2h3.28a1 1 0 01.948.684l1.498 4.493a1 1 0 01-.502 1.21l-2.257 1.13a11.042 11.042 0 005.516 5.516l1.13-2.257a1 1 0 011.21-.502l4.493 1.498a1 1 0 01.684.949V19a2 2 0 01-2 2h-1C9.716 21 3 14.284 3 6V5z" />
</svg>
090-555-1415
</a>
</div>
</div>
<div class="lg:sticky lg:top-24">
<div class="rounded-2xl overflow-hidden bg-white/10 p-2 max-w-md mx-auto lg:max-w-none">
<img src="/images/products-cropped/valve_000C.jpg" alt="วาล์ว (Valve)" class="w-full max-w-md mx-auto lg:max-w-none" loading="eager" />
</div>
</div>
</div>
</div>
</section>
<!-- Product Details -->
<section class="py-16 bg-white">
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 relative z-10">
<div class="max-w-4xl mx-auto">
<h2 class="text-2xl font-bold text-primary-700 mb-8">รายละเอียดสินค้า</h2>
<div class="prose prose-lg max-w-none">
<p class="text-lg text-neutral-700 leading-relaxed mb-4">จำหน่ายวาล์วน้ำทุกประเภท คุณภาพสูงจากแบรนด์ชั้นนำ เหมาะสำหรับงานระบบประปา ระบบน้ำในอาคาร และโรงงานอุตสาหกรรม มีทีมงานผู้เชี่ยวชาญพร้อมให้คำแนะนำและบริการติดตั้ง</p>
<img src="/images/products-misc/valve_logo.jpg" alt="Valve Brands" class="w-full max-w-md mx-auto my-8 rounded-lg shadow-md" width="600" height="300" loading="lazy" />
<p class="text-lg text-neutral-700 leading-relaxed mb-4"><strong>ประเภทวาล์วที่มีจำหน่าย:</strong></p>
<ul class="list-disc pl-6 mb-4 space-y-2 text-neutral-700">
<li><strong>Gate Valve & Globe Valve</strong> - วาล์วประตูน้ำและวาล์วปรับการไหล สำหรับงานปิด-เปิดและควบคุมการไหล</li>
<li><strong>Ball Valve</strong> - วาล์วบอล เปิด-ปิดรวดเร็ว ทนทาน การบำรุงรักษาต่ำ</li>
<li><strong>Butterfly Valve</strong> - วาล์วผีเสื้อ สำหรับท่อขนาดใหญ่ ประหยัดพื้นที่ติดตั้ง</li>
<li><strong>Balancing Valve</strong> - วาล์วสมดุล สำหรับระบบปรับอากาศและทำความร้อน</li>
<li><strong>Check Valve</strong> - วาล์วกันน้ำย้อน ป้องกันการไหลย้อนกลับ</li>
<li><strong>Y-Strainer</strong> - ตะแกรงกรองตะกอน สำหรับระบบท่อ</li>
<li><strong>2 and 3 Way Control Valve</strong> - วาล์วควบคุม 2 และ 3 ทาง สำหรับระบบปรับอากาศ</li>
<li><strong>Electronic Room Thermostat</strong> - เทอร์โมสตัทอิเล็กทรอนิกส์ ควบคุมอุณหภูมิห้อง</li>
<li><strong>Pressure Gauge & Thermometer</strong> - มาตรวัดความดันและอุณหภูมิ</li>
<li><strong>Electric Actuator</strong> - มอเตอร์ขับวาล์วอัตโนมัติ</li>
<li><strong>Fire Protection Valve & Equipment</strong> - วาล์วและอุปกรณ์ดับเพลิง</li>
<li><strong>Fire Hose Cabinet & Accessories</strong> - ตู้และอุปกรณ์สายฉีดน้ำดับเพลิง</li>
<li><strong>Portable Fire Extinguisher</strong> - ถังดับเพลิงชนิดพกพา</li>
<li><strong>Angle Hose Valve</strong> - วาล์วสายฉีดน้ำมุม</li>
<li><strong>Monitoring Device</strong> - อุปกรณ์ตรวจสอบและควบคุมระบบ</li>
<li><strong>Fire Hose</strong> - สายฉีดน้ำดับเพลิง</li>
<li><strong>Fire Barrier</strong> - ฉนวนกันไฟ และวัสดุกันไฟ</li>
<li><strong>Water Pump</strong> - ปั๊มน้ำสำหรับงานดับเพลิงและระบบน้ำ</li>
<li><strong>Cooling Tower</strong> - หอทำลายความร้อน</li>
<li><strong>Copper Tube</strong> - ท่อทองแดง สำหรับงานประปาและเครื่องปรับอากาศ</li>
</ul>
<p class="text-lg text-neutral-700 leading-relaxed mb-4"><strong>วัสดุ:</strong> ทองเหลือง, สแตนเลส, PVC, เหล็กหล่อ, ทองแดง</p>
<p class="text-lg text-neutral-700 leading-relaxed mb-4"><strong>การใช้งาน:</strong></p>
<ul class="list-disc pl-6 mb-4 space-y-2 text-neutral-700">
<li>งานระบบประปา</li>
<li>งานระบบน้ำในอาคาร</li>
<li>งานโรงงานอุตสาหกรรม</li>
<li>งานชลประทาน</li>
<li>งานระบบดับเพลิง</li>
<li>งานระบบปรับอากาศ (HVAC)</li>
<li>งานระบบทำความร้อน</li>
</ul>
<p class="text-lg text-neutral-700 leading-relaxed mb-4"><strong>ขนาด:</strong> มีขนาดตั้งแต่ DN15 ถึง DN600 หรือ 1/2" ถึง 24" ตามความต้องการ</p>
<p class="text-lg text-neutral-700 leading-relaxed mb-4">สินค้าทุกชิ้นผ่านการตรวจสอบคุณภาพก่อนส่งมอบ พร้อมรับประกันสินค้าจริง ติดต่อสอบถามราคาและข้อมูลเพิ่มเติมได้ที่ Line JPPSELECTION หรือโทร 090-555-1415</p>
</div>
</div>
</div>
</section>
<!-- Additional Images -->
<section class="py-16 bg-neutral-50">
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 relative z-10">
<div class="max-w-4xl mx-auto">
<h2 class="text-2xl font-bold text-primary-700 mb-6">รูปภาพสินค้าเพิ่มเติม</h2>
<div class="grid grid-cols-2 md:grid-cols-3 gap-4">
<img src="/images/valve-In01.jpg" alt="วาล์ว (Valve)" class="w-full h-auto rounded-lg shadow-md" width="600" height="400" loading="lazy" onerror="this.style.display='none'" />
<img src="/images/valve-In02.jpg" alt="วาล์ว (Valve)" class="w-full h-auto rounded-lg shadow-md" width="600" height="400" loading="lazy" onerror="this.style.display='none'" />
<img src="/images/valve-In03.jpg" alt="วาล์ว (Valve)" class="w-full h-auto rounded-lg shadow-md" width="600" height="400" loading="lazy" onerror="this.style.display='none'" />
<img src="/images/valve-In05.jpg" alt="วาล์ว (Valve)" class="w-full h-auto rounded-lg shadow-md" width="600" height="400" loading="lazy" onerror="this.style.display='none'" />
<img src="/images/valve-In08.jpg" alt="วาล์ว (Valve)" class="w-full h-auto rounded-lg shadow-md" width="600" height="400" loading="lazy" onerror="this.style.display='none'" />
<img src="/images/valve-In10.jpg" alt="วาล์ว (Valve)" class="w-full h-auto rounded-lg shadow-md" width="600" height="400" loading="lazy" onerror="this.style.display='none'" />
<img src="/images/valve-In15.jpg" alt="วาล์ว (Valve)" class="w-full h-auto rounded-lg shadow-md" width="600" height="400" loading="lazy" onerror="this.style.display='none'" />
<img src="/images/valve-In17.jpg" alt="วาล์ว (Valve)" class="w-full h-auto rounded-lg shadow-md" width="600" height="400" loading="lazy" onerror="this.style.display='none'" />
</div>
</div>
</div>
</section>
<!-- Valve Selection Guide -->
<section class="py-16 bg-white">
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 relative z-10">
<div class="max-w-4xl mx-auto">
<h2 class="text-2xl font-bold text-primary-700 mb-8">วิธีเลือกวาล์วให้เหมาะสม</h2>
<div class="grid md:grid-cols-2 gap-6">
<div class="bg-blue-50 p-6 rounded-xl">
<h3 class="font-bold text-primary-800 mb-3">Ball Valve (บอลวาล์ว)</h3>
<p class="text-neutral-700 text-sm mb-2">เปิด-ปิดเร็ว ราคาถูก เหมาะกับงานทั่วไป</p>
<p class="text-neutral-600 text-sm">ใช้กับ: น้ำเย็น น้ำร้อน ลม</p>
</div>
<div class="bg-green-50 p-6 rounded-xl">
<h3 class="font-bold text-primary-800 mb-3">Gate Valve (เกตวาล์ว)</h3>
<p class="text-neutral-700 text-sm mb-2">เปิด-ปิดค่อยเป็นค่อยไป กันย้อนได้</p>
<p class="text-neutral-600 text-sm">ใช้กับ: น้ำ น้ำเสีย ลม</p>
</div>
<div class="bg-orange-50 p-6 rounded-xl">
<h3 class="font-bold text-primary-800 mb-3">Check Valve (เช็ควาล์ว)</h3>
<p class="text-neutral-700 text-sm mb-2">กันน้ำย้อนอัตโนมัติ</p>
<p class="text-neutral-600 text-sm">ใช้กับ: ป้องกันน้ำย้อน</p>
</div>
<div class="bg-purple-50 p-6 rounded-xl">
<h3 class="font-bold text-primary-800 mb-3">Globe Valve (โกลบวาล์ว)</h3>
<p class="text-neutral-700 text-sm mb-2">ควบคุมอัตราการไหลได้ละเอียด</p>
<p class="text-neutral-600 text-sm">ใช้กับ: งานที่ต้องปรับอัตราการไหล</p>
</div>
</div>
</div>
</div>
</section>
<!-- FAQ Section -->
<section class="py-16 bg-neutral-50">
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 relative z-10">
<div class="max-w-4xl mx-auto">
<h2 class="text-2xl font-bold text-primary-700 mb-8">คำถามที่พบบ่อย</h2>
<div class="space-y-4">
<div class="bg-white rounded-xl p-6">
<h3 class="font-semibold text-primary-800 mb-2">Q: Ball Valve กับ Gate Valve ต่างกันอย่างไร?</h3>
<p class="text-neutral-700">Ball Valve เปิด-ปิดเร็วด้วยการหมุน 90 องศา ส่วน Gate Valve เปิด-ปิดค่อยเป็นค่อยไปด้วยการหมุนบังคับหลายรอบ Gate Valve กันย้อนได้ดีกว่า</p>
</div>
<div class="bg-white rounded-xl p-6">
<h3 class="font-semibold text-primary-800 mb-2">Q: วาล์วขนาดเลือกอย่างไร?</h3>
<p class="text-neutral-700">ขนาดวาล์วควรเท่ากับขนาดท่อ หรือเล็กกว่าหนึ่งขนาดสำหรับงานควบคุม</p>
</div>
<div class="bg-white rounded-xl p-6">
<h3 class="font-semibold text-primary-800 mb-2">Q: วาล์ว Brass กับ PVC ต่างกันอย่างไร?</h3>
<p class="text-neutral-700">Brass แข็งแรงทนแรงดันสูง เหมาะกับงานที่ต้องการความทนทาน PVC ราคาถูกกว่า เหมาะกับงานทั่วไปแรงดันต่ำ</p>
</div>
</div>
</div>
</div>
</section>
<!-- CTA Section -->
<!-- CTA -->
<section class="py-16 bg-gradient-to-br from-primary-700 to-primary-600 text-white relative overflow-hidden">
<div class="max-w-4xl mx-auto px-4 sm:px-6 lg:px-8 text-center">
<h2 class="text-3xl font-bold mb-6">สนใจสินค้านี้?</h2>
<p class="text-lg text-primary-100 mb-8">ติดต่อเราวันนี้ 090-555-1415 หรือแอดไลน์ JPPSELECTION</p>
<div class="flex flex-wrap justify-center gap-4">
<a href="/contact-us" class="bg-white text-primary-700 py-3 px-8 rounded-xl font-semibold hover:bg-primary-50 transition-colors">ติดต่อเรา</a>
<a href="https://line.me/ti/p/~JPPSELECTION" target="_blank" rel="noopener" class="bg-accent-500 hover:bg-accent-600 text-white py-3 px-8 rounded-xl font-semibold transition-colors">แอดไลน์</a>
</div>
</div>
</section> </main>
</BaseLayout>