[verified] feat: add CcooL product page and SEO fixes

This commit is contained in:
Kunthawat Greethong
2026-08-30 11:06:03 +07:00
parent c975570bfd
commit c0d8cacfbe
51 changed files with 1043 additions and 224 deletions

60
UMAMI-EVENTS.md Normal file
View File

@@ -0,0 +1,60 @@
# Umami Event Tracking Convention — dealplustech
ทุก CTA / element ที่คลิกได้ (นำไปสู่ action) ต้องมี `data-umami-event="<event-name>"` เพื่อให้ Umami ติดตามได้
Umami เชื่อมโยงแล้วใน `src/layouts/Layout.astro` — แค่เพิ่ม attribute ก็ติดตามได้เลย
## กฎสำคัญ
1. **ใช้ `patch` tool เสมอ อย่าใช้ terminal/script regex** กับไฟล์ `.astro` (เส้นทางภาษาไทย + เสี่ยง attribute แตก)
2. ใส่ `data-umami-event` **หลัง `href="..."`** ใน tag เปิด `<a>` เสมอ — ตรวจให้ `href` ยัง intact (ไม่มี `hrdata`/`ef`)
3. **เช็คท้ายสุด:** ทุก `<a>` ที่เป็น CTA ต้องมี `data-umami-event` และไม่มี `hrdata` หลงเหลือ (search `hrdata` ต้องได้ 0)
4. อย่าแตะ `target`/`rel`/`class` ที่มีอยู่ — แค่เพิ่ม attribute ใหม่
5. หลังแก้เสร็จ รัน `npm run build` ตรวจว่าไม่มี error
## ชื่อ event ต่อจุด (แก้ตามบริบทของแต่ละหน้า)
### หน้า Product ทุกหน้า (ฉนวนหุ้มท่อ-ccool, aeroflex, maxflex, ท่อ-*, เครื่องเชื่อม-*, water-*, valve, grilles, etc.)
| จุด | event-name |
|-----|-----------|
| Hero — ปุ่มแชท Line (สีส้ม) | `product-hero-line` |
| Hero — ปุ่มโทร (สีขาว) | `product-hero-call` |
| Hero — ปุ่มราคาสินค้า (`data-price-button`/`#pricelist`) | `product-hero-price` |
| In-content — ลิงก์ Line (ในย่อความ) | `product-inline-line` |
| In-content — ลิงก์โทร (ในย่อความ) | `product-inline-call` |
| ดาวน์โหลดราคา PDF | `product-pdf-download` |
| CTA ล่าง — ปุ่มติดต่อเรา | `product-cta-contact` |
| CTA ล่าง — ปุ่มแอดไลน์ | `product-cta-line` |
| การ์ดกลุ่มผลิตภัณฑ์ (ถ้ามี `#sheet` `#tube` `#roof` `#adhesives`) | `product-lineup-<slug>` |
| แกลอรี่ภาพ | `product-gallery-<name>` |
### หน้า contact-us
`contact-tel`, `contact-line`, `contact-email`
### หน้า all-products
`allproducts-cta-contact`, `allproducts-cta-line`, `allproducts-card` (product card dynamic)
### หน้า index (home)
| จุด | event-name |
|-----|-----------|
| Hero — ดูสินค้าทั้งหมด | `home-hero-view-all` |
| Hero — ติดต่อเรา | `home-hero-contact` |
| Product card (ไป product page) | `home-product-card` |
| Category tile (ไป all-products?filter=X) | `home-category-<id>` (ppr, welding, water, ac, fire, insulation, fence) |
| View-all tile (แถวสุดท้าย) | `home-category-all` |
| Blog link | `home-blog` |
| Blog card | `home-blog-card` |
| CTA — โทร | `home-cta-call` |
| CTA — Line | `home-cta-line` |
| CTA — ติดต่อเรา | `home-cta-contact` |
### หน้า about-us / portfolio / 404
- about-us: `about-cta-contact`, `about-cta-line`, `about-cta-call` (ตามที่มี)
- portfolio: `portfolio-cta-contact`, `portfolio-cta-line` (ตามที่มี)
- 404: `404-home`, `404-contact` (ตามที่มี)
## ตัวอย่างการแก้ (patch)
```astro
<!-- ก่อน -->
<a href="https://line.me/ti/p/~JPPSELECTION" target="_blank" rel="noopener" class="bg-accent-500 ...">แชท Line</a>
<!-- หลัง -->
<a href="https://line.me/ti/p/~JPPSELECTION" target="_blank" rel="noopener" data-umami-event="product-hero-line" class="bg-accent-500 ...">แชท Line</a>
```

53
docs/HANDOFF.md Normal file
View File

@@ -0,0 +1,53 @@
---
title: Deal Plus Tech Engineering Handoff
updated: 2026-08-30
---
# Engineering Handoff
## Current State
- Repository: `/Users/kunthawat/Gitea/dealplustech-astroreal`
- Branch: `main`
- HEAD: pending verified commit at the time this handoff was written
- Remote target: `origin/main`
- Working tree: staged for the verified commit; no credentials or private logs included
## Completed
- CcooL product page: `/ฉนวนหุ้มท่อ-ccool/`
- CcooL images and pricing PDF added under `public/`
- Navigation, product listing, breadcrumb, metadata, FAQ, Product JSON-LD, and CTA tracking updated
- Robots/sitemap references and stale internal links corrected
- Duplicate legal-page H1 output removed
- Unsupported market-superlative claim wording replaced
- Duplicate CcooL anchor ID removed; new-tab PDF link hardened with `rel="noopener"`
## Verification
- `npm run build`**pass**, 44 pages
- `npx tsc --noEmit`**pass**
- `git diff --cached --check`**pass**
- Independent reviewer → **pass**, no security concerns or logic errors
- Static output → 44 HTML pages, JSON-LD parses, Umami attributes are well-formed, images have `alt`; baseline-only duplicate SVG ID and blank-target links remain
- Assets → five 1024×768 images; five-page A4 PDF; no PDF JavaScript/encryption
## Known Limitations / Blockers
- `npm test` cannot run because the project has no `test` script.
- `astro check` reports 55 pre-existing errors in both baseline and final trees; no regression was introduced.
- Production soft-404 behavior, Cloudflare crawler rules, live Search Console, and live external HTTP status were not changed or verified in this local push gate.
- Domain-dependent SEO/deploy work is blocked until the real production domain is explicitly confirmed. Never guess it from repository configuration.
- CcooL claims still need accessible first-party evidence; image CLS and complete ProductGroup/AggregateOffer modeling remain deferred.
## Resume Procedure
1. Verify `git rev-parse HEAD` and `git ls-remote origin refs/heads/main` agree after push.
2. Update this file and the dated engineering log with the exact pushed SHA.
3. Before deployment or further SEO changes, confirm the production domain explicitly.
4. Fix server-level 404 routing and verify an unknown URL returns HTTP 404.
5. Recheck Cloudflare robots/AI crawler settings and publish claim evidence.
## Evidence Index
- [[2026-08-30-seo-audit-fixes]]
- [[../test-evidence/2026-08-30-ccool-seo]]

29
docs/engineering-log.md Normal file
View File

@@ -0,0 +1,29 @@
---
title: Deal Plus Tech Engineering Log
updated: 2026-08-30
---
# Engineering Log
## Current Status
| Milestone | Status | Last verified | Evidence | Next action |
|---|---|---|---|---|
| CcooL product page and navigation | complete | 2026-08-30 | `npm run build` produced 44 static pages, including `/ฉนวนหุ้มท่อ-ccool/` | Confirm production domain before the next deploy/SEO change |
| SEO trust-layer fixes | complete | 2026-08-30 | robots/sitemap, internal links, metadata, legal-page headings, and claim wording checked in built output | Fix production soft-404 routing at the server layer |
| Umami event convention | complete | 2026-08-30 | Source/output scan found no malformed `data-umami-event` attributes | Review event reports after real traffic arrives |
| Verification gate | complete | 2026-08-30 | TypeScript, build, static HTML, asset probes, and independent review recorded in [[2026-08-30-seo-audit-fixes]] | Re-run after any further source change |
## Guardrails
- Production domain must be explicitly confirmed before deploy or SEO work; never infer it from repository files, comments, staging URLs, or old audits.
- Keep claims tied to accessible first-party evidence such as datasheets, certificates, and test reports.
- Do not commit credentials, tokens, or private logs.
- Treat production 404 behavior, Cloudflare crawler policy, image dimensions/CLS, and Product schema offers as separate follow-up work.
## Entry Index
- [[2026-08-30-seo-audit-fixes]] — CcooL page, SEO trust layer, Umami tracking, verification, and push handoff.
## Plan Synchronization
No master plan, roadmap, or implementation-batch document was present in this repository at verification time; no plan file was invented or silently changed.

View File

@@ -0,0 +1,49 @@
---
title: SEO audit fixes and CcooL product page
status: complete
verified: 2026-08-30
---
# SEO Audit Fixes and CcooL Product Page
## Plan Status
**complete** — the requested local SEO trust-layer fixes, CcooL product page, and Umami event instrumentation are staged for commit. No repository master plan or roadmap was available to synchronize.
## Changed Scope
- Added the CcooL product page at `/ฉนวนหุ้มท่อ-ccool/` with product details, FAQ, gallery, CTA links, Product JSON-LD, and the supplied pricing PDF.
- Added five CcooL image assets and verified their dimensions.
- Added CcooL to product navigation/listing and related breadcrumbs.
- Added/standardized `data-umami-event` attributes and documented the event convention in `UMAMI-EVENTS.md`.
- Fixed robots/sitemap references, stale internal blog links, duplicate legal-page H1 output, and CcooL title/description wording.
- Replaced unsupported market-superlative wording with a concrete thermal-conductivity statement.
- Removed a duplicate `id="roof"` and added `rel="noopener"` to the new CcooL PDF link opened in a new tab.
## Verification Evidence
- `npm run build`**pass**, 44 static pages generated; CcooL route and sitemap index generated.
- `npx tsc --noEmit`**pass**.
- `git diff --cached --check`**pass**.
- Added-line security scan — no hardcoded secret pattern, shell injection, dangerous eval/exec, unsafe deserialization, or SQL-formatting pattern found.
- `astro check` — the current tree and a clean `HEAD` baseline both report the same 55 pre-existing errors; no new errors were introduced by this diff.
- Static HTML probe — 44 pages parsed; zero tag-balance issues, zero missing `alt`, zero malformed Umami attributes, zero JSON-LD parse errors; the remaining duplicate SVG ID and 11 blank-target links match baseline.
- Asset probe — all five CcooL images are 1024×768; the pricing PDF is 5-page A4, unencrypted, contains no JavaScript, and has a readable text layer.
- Independent reviewer — `passed: true`, `security_concerns: []`, `logic_errors: []`.
## Tooling Limitations
- `npm test` is unavailable because `package.json` has no `test` script.
- `astro check` remains non-zero because of pre-existing diagnostics; baseline comparison is clean.
- Visual layout, production HTTP status, Cloudflare rules, Search Console data, and external crawler behavior were not re-verified in this local gate.
## Risks and Remaining Work
1. Production unknown routes previously returned a soft 404; configure the actual server/EasyPanel routing to return HTTP 404, then verify an unknown URL externally.
2. Confirm the real production domain before the next SEO/deploy action. Do not infer it from this repository or an old audit.
3. Verify Cloudflare managed robots/AI crawler policy after deployment.
4. Publish accessible first-party datasheets/certificates/test reports for the CcooL claims that need evidence.
5. Improve image dimensions/CLS across the shared site and complete ProductGroup/AggregateOffer work only when real offer data exists.
## Exact Next Action
After the verified code commit is pushed, verify the remote branch tip, then update this entry and `docs/HANDOFF.md` with the exact commit SHA. Before any production deploy or domain-dependent SEO change, obtain explicit domain confirmation.

View File

@@ -0,0 +1,33 @@
---
title: CcooL SEO push verification evidence
verified: 2026-08-30
---
# CcooL SEO Push Verification Evidence
## Commands and Results
| Command/probe | Result |
|---|---|
| `npm run build` | **PASS** — 44 static pages; CcooL route and `sitemap-index.xml` generated |
| `npx tsc --noEmit` | **PASS** — exit status 0 |
| `npx astro check` vs clean `HEAD` baseline | **NO REGRESSION** — both report the same 55 pre-existing errors |
| `npm test -- --passWithNoTests` | **NOT RUNNABLE** — no `test` script exists in `package.json` |
| `git diff --cached --check` | **PASS** |
| Added-line security scan | **PASS** — no secret, shell-injection, eval/exec, unsafe-deserialization, or SQL-formatting match |
| HTML output parser | **PASS** — 44 pages, no tag-balance issue, no missing `alt`, no malformed Umami, no JSON-LD parse error |
| Baseline comparison | **PASS** — only the existing SVG duplicate ID and 11 existing blank-target links remain |
| CcooL images | **PASS** — 5 files, each 1024×768 |
| CcooL PDF | **PASS** — 5 pages, A4, readable text layer, unencrypted, no JavaScript |
| Independent reviewer | **PASS**`passed=true`, security concerns 0, logic errors 0 |
## Not Covered by This Local Gate
- Visual review of layout/clipping/aesthetics
- Production deployment or external HTTP status
- Cloudflare managed robots/AI crawler configuration
- Google Search Console, PageSpeed field data, or indexing status
- Datasheet/certificate/test-report availability for product claims
## Reproduction Notes
Run from `/Users/kunthawat/Gitea/dealplustech-astroreal`. Build output is generated in `dist/` and is not itself the source of truth. Confirm the production domain before any domain-dependent SEO or deployment action.

Binary file not shown.

After

Width:  |  Height:  |  Size: 191 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 199 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 143 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 204 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 83 KiB

View File

@@ -1,5 +1,5 @@
# robots.txt — ดีล พลัส เทค # robots.txt — ดีล พลัส เทค
# https://dealplustech.com # https://dealplustech.co.th
User-agent: * User-agent: *
Allow: / Allow: /
@@ -35,7 +35,7 @@ User-agent: MJ12bot
Disallow: / Disallow: /
# Host (Yandex/Bing-style, also helps some other crawlers) # Host (Yandex/Bing-style, also helps some other crawlers)
Host: https://dealplustech.com Host: https://dealplustech.co.th
# Sitemap # Sitemap
Sitemap: https://dealplustech.com/sitemap.xml Sitemap: https://dealplustech.co.th/sitemap-index.xml

View File

@@ -615,6 +615,6 @@ Armaflex ใช้งานได้ดีในระดับมาตรฐ
## บทความที่เกี่ยวข้อง ## บทความที่เกี่ยวข้อง
- [เลือกกริลแอร์ ABS vs อลูมิเนียม — ต่างกันยังไง](/บทความ/grilles-guide) — สำหรับงาน HVAC ระบบลม - [เลือกกริลแอร์ ABS vs อลูมิเนียม — ต่างกันยังไง](/บทความ/plastic-grilles-guide) — สำหรับงาน HVAC ระบบลม
- [PPR vs HDPE vs UPVC — เลือกแบบไหนให้เหมาะกับงาน](/บทความ/pipe-comparison) — เปรียบเทียบท่อ 3 ชนิด - [PPR vs HDPE vs UPVC — เลือกแบบไหนให้เหมาะกับงาน](/บทความ/ppr-vs-hdpe-vs-upvc) — เปรียบเทียบท่อ 3 ชนิด
- [ดูสินค้าฉนวนทั้งหมด](/all-products#insulation) — Armaflex, Aerocel, Thermobreak ครบทุกรุ่น - [ดูสินค้าฉนวนทั้งหมด](/all-products#insulation) — Armaflex, Aerocel, Thermobreak ครบทุกรุ่น

View File

@@ -141,6 +141,7 @@ const categories = [
{ name: 'Armaflex', slug: '/armflex' }, { name: 'Armaflex', slug: '/armflex' },
{ name: 'Aeroflex', slug: '/aeroflex' }, { name: 'Aeroflex', slug: '/aeroflex' },
{ name: 'Maxflex', slug: '/maxflex' }, { name: 'Maxflex', slug: '/maxflex' },
{ name: 'CcooL ฉนวนซีคูล', slug: '/ฉนวนหุ้มท่อ-ccool' },
{ name: 'Thermobreak', slug: '/เทอร์โมเบรค-thermobreak' }, { name: 'Thermobreak', slug: '/เทอร์โมเบรค-thermobreak' },
{ name: 'ROCKWOOL', slug: '/rockwool' }, { name: 'ROCKWOOL', slug: '/rockwool' },
{ name: 'MICROFIBER', slug: '/microfiber' }, { name: 'MICROFIBER', slug: '/microfiber' },

View File

@@ -38,6 +38,7 @@ const popularLinks = [
<div class="flex flex-wrap justify-center gap-4 mb-12"> <div class="flex flex-wrap justify-center gap-4 mb-12">
<a <a
href="/" href="/"
data-umami-event="404-home"
class="inline-flex items-center gap-2 bg-accent-500 hover:bg-accent-600 text-white py-3 px-6 rounded-xl font-semibold transition-all hover:shadow-xl" class="inline-flex items-center gap-2 bg-accent-500 hover:bg-accent-600 text-white py-3 px-6 rounded-xl font-semibold transition-all hover:shadow-xl"
> >
<svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24"> <svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
@@ -47,6 +48,7 @@ const popularLinks = [
</a> </a>
<a <a
href="/all-products" href="/all-products"
data-umami-event="404-products"
class="inline-flex items-center gap-2 bg-white border-2 border-primary-600 text-primary-700 hover:bg-primary-50 py-3 px-6 rounded-xl font-semibold transition-all" class="inline-flex items-center gap-2 bg-white border-2 border-primary-600 text-primary-700 hover:bg-primary-50 py-3 px-6 rounded-xl font-semibold transition-all"
> >
<svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24"> <svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
@@ -76,7 +78,7 @@ const popularLinks = [
<!-- Contact hint --> <!-- Contact hint -->
<p class="mt-8 text-sm text-slate-500"> <p class="mt-8 text-sm text-slate-500">
ต้องการความช่วยเหลือ? ต้องการความช่วยเหลือ?
<a href="/contact-us" class="text-primary-600 hover:underline font-medium">ติดต่อเรา</a> <a href="/contact-us" data-umami-event="404-contact" class="text-primary-600 hover:underline font-medium">ติดต่อเรา</a>
หรือโทร 090-555-1415 หรือโทร 090-555-1415
</p> </p>
</div> </div>

View File

@@ -176,8 +176,8 @@ import BaseLayout from '@/layouts/BaseLayout.astro';
<h2 class="text-3xl font-bold mb-6">ต้องการสินค้าคุณภาพ ราคาโรงงาน?</h2> <h2 class="text-3xl font-bold mb-6">ต้องการสินค้าคุณภาพ ราคาโรงงาน?</h2>
<p class="text-lg text-primary-100 mb-8">ติดต่อเราวันนี้ 090-555-1415 หรือแอดไลน์ ID:JPPSELECTION</p> <p class="text-lg text-primary-100 mb-8">ติดต่อเราวันนี้ 090-555-1415 หรือแอดไลน์ ID:JPPSELECTION</p>
<div class="flex flex-wrap justify-center gap-4"> <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="/contact-us" data-umami-event="about-cta-contact" 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> <a href="https://line.me/ti/p/~JPPSELECTION" data-umami-event="about-cta-line" 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>
</div> </div>
</section> </section>

View File

@@ -63,17 +63,17 @@ import BaseLayout from '@/layouts/BaseLayout.astro';
</div> </div>
</div> </div>
<div class="flex flex-wrap justify-center gap-4 mb-8 lg:justify-start"> <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"> <a href="https://line.me/ti/p/~JPPSELECTION" target="_blank" rel="noopener" data-umami-event="product-hero-line" 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> <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 แชท Line
</a> </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"> <a href="tel:0905551415" data-umami-event="product-hero-call" 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"> <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" /> <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> </svg>
090-555-1415 090-555-1415
</a> </a>
<a href="#pricelist" data-price-button class="hidden bg-white text-primary-700 hover:bg-primary-50 py-3 px-6 rounded-xl font-semibold flex items-center gap-2"> <a href="#pricelist" data-price-button data-umami-event="product-hero-price" class="hidden 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"> <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="M9 12h6m-6 4h6m2 5H7a2 2 0 01-2-2V5a2 2 0 012-2h5.586a1 1 0 01.707.293l5.414 5.414a1 1 0 01.293.707V19a2 2 0 01-2 2z" /> <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 12h6m-6 4h6m2 5H7a2 2 0 01-2-2V5a2 2 0 012-2h5.586a1 1 0 01.707.293l5.414 5.414a1 1 0 01.293.707V19a2 2 0 01-2 2z" />
</svg> </svg>
@@ -218,7 +218,7 @@ import BaseLayout from '@/layouts/BaseLayout.astro';
<div class="bg-primary-50 border-l-4 border-primary-600 p-4 mt-6"> <div class="bg-primary-50 border-l-4 border-primary-600 p-4 mt-6">
<p class="text-slate-700"> <p class="text-slate-700">
<strong>สอบถามราคาและสั่งซื้อ:</strong> ติดต่อเราได้ที่ Line: <a href="https://line.me/ti/p/~JPPSELECTION" class="text-primary-700 underline">JPPSELECTION</a> หรือโทร <a href="tel:0905551415" class="text-primary-700 underline">090-555-1415</a> ราคาโรงงาน ส่งฟรี กรุงเทพมหานคร และปริมณฑล <strong>สอบถามราคาและสั่งซื้อ:</strong> ติดต่อเราได้ที่ Line: <a href="https://line.me/ti/p/~JPPSELECTION" data-umami-event="product-inline-line" class="text-primary-700 underline">JPPSELECTION</a> หรือโทร <a href="tel:0905551415" data-umami-event="product-inline-call" class="text-primary-700 underline">090-555-1415</a> ราคาโรงงาน ส่งฟรี กรุงเทพมหานคร และปริมณฑล
</p> </p>
</div> </div>
</div> </div>
@@ -246,7 +246,7 @@ import BaseLayout from '@/layouts/BaseLayout.astro';
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 relative z-10"> <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 relative z-10">
<div class="max-w-lg mx-auto text-center"> <div class="max-w-lg mx-auto text-center">
<h2 class="text-xl font-bold mb-6">📥 ดาวน์โหลดราคาสินค้า Aeroflex</h2> <h2 class="text-xl font-bold mb-6">📥 ดาวน์โหลดราคาสินค้า Aeroflex</h2>
<a href="/documents/19 Pricelist Aeroflex (update 2565).pdf" target="_blank" class="inline-flex items-center gap-4 p-4 bg-white rounded-xl shadow-sm hover:shadow-md transition-shadow text-left"> <a href="/documents/19 Pricelist Aeroflex (update 2565).pdf" target="_blank" data-umami-event="product-pdf-download" class="inline-flex items-center gap-4 p-4 bg-white rounded-xl shadow-sm hover:shadow-md transition-shadow text-left">
<svg class="w-8 h-8 text-red-600 flex-shrink-0" fill="currentColor" viewBox="0 0 24 24"> <svg class="w-8 h-8 text-red-600 flex-shrink-0" fill="currentColor" viewBox="0 0 24 24">
<path d="M14 2H6a2 2 0 00-2 2v16a2 2 0 002 2h12a2 2 0 002-2V8l-6-6zm-1 9V3.5L18.5 9H13zM8 13h8v2H8v-2zm0 4h8v2H8v-2zm0-8h2v2H8V9z"/> <path d="M14 2H6a2 2 0 00-2 2v16a2 2 0 002 2h12a2 2 0 002-2V8l-6-6zm-1 9V3.5L18.5 9H13zM8 13h8v2H8v-2zm0 4h8v2H8v-2zm0-8h2v2H8V9z"/>
</svg> </svg>
@@ -268,43 +268,43 @@ import BaseLayout from '@/layouts/BaseLayout.astro';
<p class="text-neutral-600">ภาพสินค้าจริงจากงานติดตั้ง — คลิกเพื่อดูภาพขนาดเต็ม</p> <p class="text-neutral-600">ภาพสินค้าจริงจากงานติดตั้ง — คลิกเพื่อดูภาพขนาดเต็ม</p>
</div> </div>
<div class="grid grid-cols-2 md:grid-cols-3 lg:grid-cols-4 gap-4"> <div class="grid grid-cols-2 md:grid-cols-3 lg:grid-cols-4 gap-4">
<a href="/images/aeroflex/gallery-1.jpg" target="_blank" rel="noopener" class="group block overflow-hidden rounded-xl shadow-md hover:shadow-xl transition-shadow"> <a href="/images/aeroflex/gallery-1.jpg" target="_blank" rel="noopener" data-umami-event="product-gallery-1" class="group block overflow-hidden rounded-xl shadow-md hover:shadow-xl transition-shadow">
<img src="/images/aeroflex/gallery-1.jpg" alt="Aeroflex ภาพที่ 1" class="w-full h-48 object-cover group-hover:scale-105 transition-transform duration-300" loading="lazy" /> <img src="/images/aeroflex/gallery-1.jpg" alt="Aeroflex ภาพที่ 1" class="w-full h-48 object-cover group-hover:scale-105 transition-transform duration-300" loading="lazy" />
</a> </a>
<a href="/images/aeroflex/gallery-2.jpg" target="_blank" rel="noopener" class="group block overflow-hidden rounded-xl shadow-md hover:shadow-xl transition-shadow"> <a href="/images/aeroflex/gallery-2.jpg" target="_blank" rel="noopener" data-umami-event="product-gallery-2" class="group block overflow-hidden rounded-xl shadow-md hover:shadow-xl transition-shadow">
<img src="/images/aeroflex/gallery-2.jpg" alt="Aeroflex ภาพที่ 2" class="w-full h-48 object-cover group-hover:scale-105 transition-transform duration-300" loading="lazy" /> <img src="/images/aeroflex/gallery-2.jpg" alt="Aeroflex ภาพที่ 2" class="w-full h-48 object-cover group-hover:scale-105 transition-transform duration-300" loading="lazy" />
</a> </a>
<a href="/images/aeroflex/gallery-3.jpg" target="_blank" rel="noopener" class="group block overflow-hidden rounded-xl shadow-md hover:shadow-xl transition-shadow"> <a href="/images/aeroflex/gallery-3.jpg" target="_blank" rel="noopener" data-umami-event="product-gallery-3" class="group block overflow-hidden rounded-xl shadow-md hover:shadow-xl transition-shadow">
<img src="/images/aeroflex/gallery-3.jpg" alt="Aeroflex ภาพที่ 3" class="w-full h-48 object-cover group-hover:scale-105 transition-transform duration-300" loading="lazy" /> <img src="/images/aeroflex/gallery-3.jpg" alt="Aeroflex ภาพที่ 3" class="w-full h-48 object-cover group-hover:scale-105 transition-transform duration-300" loading="lazy" />
</a> </a>
<a href="/images/aeroflex/gallery-4.jpg" target="_blank" rel="noopener" class="group block overflow-hidden rounded-xl shadow-md hover:shadow-xl transition-shadow"> <a href="/images/aeroflex/gallery-4.jpg" target="_blank" rel="noopener" data-umami-event="product-gallery-4" class="group block overflow-hidden rounded-xl shadow-md hover:shadow-xl transition-shadow">
<img src="/images/aeroflex/gallery-4.jpg" alt="Aeroflex ภาพที่ 4" class="w-full h-48 object-cover group-hover:scale-105 transition-transform duration-300" loading="lazy" /> <img src="/images/aeroflex/gallery-4.jpg" alt="Aeroflex ภาพที่ 4" class="w-full h-48 object-cover group-hover:scale-105 transition-transform duration-300" loading="lazy" />
</a> </a>
<a href="/images/aeroflex/gallery-5.jpg" target="_blank" rel="noopener" class="group block overflow-hidden rounded-xl shadow-md hover:shadow-xl transition-shadow"> <a href="/images/aeroflex/gallery-5.jpg" target="_blank" rel="noopener" data-umami-event="product-gallery-5" class="group block overflow-hidden rounded-xl shadow-md hover:shadow-xl transition-shadow">
<img src="/images/aeroflex/gallery-5.jpg" alt="Aeroflex ภาพที่ 5" class="w-full h-48 object-cover group-hover:scale-105 transition-transform duration-300" loading="lazy" /> <img src="/images/aeroflex/gallery-5.jpg" alt="Aeroflex ภาพที่ 5" class="w-full h-48 object-cover group-hover:scale-105 transition-transform duration-300" loading="lazy" />
</a> </a>
<a href="/images/aeroflex/gallery-6.jpg" target="_blank" rel="noopener" class="group block overflow-hidden rounded-xl shadow-md hover:shadow-xl transition-shadow"> <a href="/images/aeroflex/gallery-6.jpg" target="_blank" rel="noopener" data-umami-event="product-gallery-6" class="group block overflow-hidden rounded-xl shadow-md hover:shadow-xl transition-shadow">
<img src="/images/aeroflex/gallery-6.jpg" alt="Aeroflex ภาพที่ 6" class="w-full h-48 object-cover group-hover:scale-105 transition-transform duration-300" loading="lazy" /> <img src="/images/aeroflex/gallery-6.jpg" alt="Aeroflex ภาพที่ 6" class="w-full h-48 object-cover group-hover:scale-105 transition-transform duration-300" loading="lazy" />
</a> </a>
<a href="/images/aeroflex/gallery-8.jpg" target="_blank" rel="noopener" class="group block overflow-hidden rounded-xl shadow-md hover:shadow-xl transition-shadow"> <a href="/images/aeroflex/gallery-8.jpg" target="_blank" rel="noopener" data-umami-event="product-gallery-8" class="group block overflow-hidden rounded-xl shadow-md hover:shadow-xl transition-shadow">
<img src="/images/aeroflex/gallery-8.jpg" alt="Aeroflex ภาพที่ 8" class="w-full h-48 object-cover group-hover:scale-105 transition-transform duration-300" loading="lazy" /> <img src="/images/aeroflex/gallery-8.jpg" alt="Aeroflex ภาพที่ 8" class="w-full h-48 object-cover group-hover:scale-105 transition-transform duration-300" loading="lazy" />
</a> </a>
<a href="/images/aeroflex/gallery-9.jpg" target="_blank" rel="noopener" class="group block overflow-hidden rounded-xl shadow-md hover:shadow-xl transition-shadow"> <a href="/images/aeroflex/gallery-9.jpg" target="_blank" rel="noopener" data-umami-event="product-gallery-9" class="group block overflow-hidden rounded-xl shadow-md hover:shadow-xl transition-shadow">
<img src="/images/aeroflex/gallery-9.jpg" alt="Aeroflex ภาพที่ 9" class="w-full h-48 object-cover group-hover:scale-105 transition-transform duration-300" loading="lazy" /> <img src="/images/aeroflex/gallery-9.jpg" alt="Aeroflex ภาพที่ 9" class="w-full h-48 object-cover group-hover:scale-105 transition-transform duration-300" loading="lazy" />
</a> </a>
<a href="/images/aeroflex/gallery-10.jpg" target="_blank" rel="noopener" class="group block overflow-hidden rounded-xl shadow-md hover:shadow-xl transition-shadow"> <a href="/images/aeroflex/gallery-10.jpg" target="_blank" rel="noopener" data-umami-event="product-gallery-10" class="group block overflow-hidden rounded-xl shadow-md hover:shadow-xl transition-shadow">
<img src="/images/aeroflex/gallery-10.jpg" alt="Aeroflex ภาพที่ 10" class="w-full h-48 object-cover group-hover:scale-105 transition-transform duration-300" loading="lazy" /> <img src="/images/aeroflex/gallery-10.jpg" alt="Aeroflex ภาพที่ 10" class="w-full h-48 object-cover group-hover:scale-105 transition-transform duration-300" loading="lazy" />
</a> </a>
<a href="/images/aeroflex/gallery-11.jpg" target="_blank" rel="noopener" class="group block overflow-hidden rounded-xl shadow-md hover:shadow-xl transition-shadow"> <a href="/images/aeroflex/gallery-11.jpg" target="_blank" rel="noopener" data-umami-event="product-gallery-11" class="group block overflow-hidden rounded-xl shadow-md hover:shadow-xl transition-shadow">
<img src="/images/aeroflex/gallery-11.jpg" alt="Aeroflex ภาพที่ 11" class="w-full h-48 object-cover group-hover:scale-105 transition-transform duration-300" loading="lazy" /> <img src="/images/aeroflex/gallery-11.jpg" alt="Aeroflex ภาพที่ 11" class="w-full h-48 object-cover group-hover:scale-105 transition-transform duration-300" loading="lazy" />
</a> </a>
<a href="/images/aeroflex/gallery-12.jpg" target="_blank" rel="noopener" class="group block overflow-hidden rounded-xl shadow-md hover:shadow-xl transition-shadow"> <a href="/images/aeroflex/gallery-12.jpg" target="_blank" rel="noopener" data-umami-event="product-gallery-12" class="group block overflow-hidden rounded-xl shadow-md hover:shadow-xl transition-shadow">
<img src="/images/aeroflex/gallery-12.jpg" alt="Aeroflex ภาพที่ 12" class="w-full h-48 object-cover group-hover:scale-105 transition-transform duration-300" loading="lazy" /> <img src="/images/aeroflex/gallery-12.jpg" alt="Aeroflex ภาพที่ 12" class="w-full h-48 object-cover group-hover:scale-105 transition-transform duration-300" loading="lazy" />
</a> </a>
<a href="/images/aeroflex/gallery-13.jpg" target="_blank" rel="noopener" class="group block overflow-hidden rounded-xl shadow-md hover:shadow-xl transition-shadow"> <a href="/images/aeroflex/gallery-13.jpg" target="_blank" rel="noopener" data-umami-event="product-gallery-13" class="group block overflow-hidden rounded-xl shadow-md hover:shadow-xl transition-shadow">
<img src="/images/aeroflex/gallery-13.jpg" alt="Aeroflex ภาพที่ 13" class="w-full h-48 object-cover group-hover:scale-105 transition-transform duration-300" loading="lazy" /> <img src="/images/aeroflex/gallery-13.jpg" alt="Aeroflex ภาพที่ 13" class="w-full h-48 object-cover group-hover:scale-105 transition-transform duration-300" loading="lazy" />
</a> </a>
<a href="/images/aeroflex/gallery-14.jpg" target="_blank" rel="noopener" class="group block overflow-hidden rounded-xl shadow-md hover:shadow-xl transition-shadow"> <a href="/images/aeroflex/gallery-14.jpg" target="_blank" rel="noopener" data-umami-event="product-gallery-14" class="group block overflow-hidden rounded-xl shadow-md hover:shadow-xl transition-shadow">
<img src="/images/aeroflex/gallery-14.jpg" alt="Aeroflex ภาพที่ 14" class="w-full h-48 object-cover group-hover:scale-105 transition-transform duration-300" loading="lazy" /> <img src="/images/aeroflex/gallery-14.jpg" alt="Aeroflex ภาพที่ 14" class="w-full h-48 object-cover group-hover:scale-105 transition-transform duration-300" loading="lazy" />
</a> </a>
</div> </div>
@@ -316,8 +316,8 @@ import BaseLayout from '@/layouts/BaseLayout.astro';
<h2 class="text-3xl font-bold mb-6">สนใจสินค้านี้?</h2> <h2 class="text-3xl font-bold mb-6">สนใจสินค้านี้?</h2>
<p class="text-lg text-primary-100 mb-8">ติดต่อเราวันนี้ 090-555-1415 หรือแอดไลน์ ID:JPPSELECTION</p> <p class="text-lg text-primary-100 mb-8">ติดต่อเราวันนี้ 090-555-1415 หรือแอดไลน์ ID:JPPSELECTION</p>
<div class="flex flex-wrap justify-center gap-4"> <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="/contact-us" data-umami-event="product-cta-contact" 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> <a href="https://line.me/ti/p/~JPPSELECTION" target="_blank" rel="noopener" data-umami-event="product-cta-line" class="bg-accent-500 hover:bg-accent-600 text-white py-3 px-8 rounded-xl font-semibold transition-colors">แอดไลน์</a>
</div> </div>
</div> </div>
</section> </section>

View File

@@ -35,6 +35,7 @@ const products = [
{ name: "Armaflex", href: "/armflex", image: "/images/armflex/armaflex-sheet-roll.jpg", category: "ฉนวนหุ้มท่อ" }, { name: "Armaflex", href: "/armflex", image: "/images/armflex/armaflex-sheet-roll.jpg", category: "ฉนวนหุ้มท่อ" },
{ name: "Aeroflex", href: "/aeroflex", image: "/images/aeroflex/aerocel-d-al-real.jpg", category: "ฉนวนหุ้มท่อ" }, { name: "Aeroflex", href: "/aeroflex", image: "/images/aeroflex/aerocel-d-al-real.jpg", category: "ฉนวนหุ้มท่อ" },
{ name: "Maxflex", href: "/maxflex", image: "/images/maxflex/maxflex-fsk-foil.jpg", category: "ฉนวนหุ้มท่อ" }, { name: "Maxflex", href: "/maxflex", image: "/images/maxflex/maxflex-fsk-foil.jpg", category: "ฉนวนหุ้มท่อ" },
{ name: "CcooL ฉนวนซีคูล", href: "/ฉนวนหุ้มท่อ-ccool", image: "/images/ccool/ccool-application-hvac.jpg", category: "ฉนวนหุ้มท่อ" },
{ name: "Thermobreak", href: "/เทอร์โมเบรค-thermobreak", image: "/images/thermobreak/thermobreak-main.jpg", category: "ฉนวนหุ้มท่อ" }, { name: "Thermobreak", href: "/เทอร์โมเบรค-thermobreak", image: "/images/thermobreak/thermobreak-main.jpg", category: "ฉนวนหุ้มท่อ" },
// ระบบรั้ว (2 items) // ระบบรั้ว (2 items)
@@ -105,6 +106,7 @@ const categoryIdMap = Object.fromEntries(categories.map(c => [c.name, c.id]));
{products.map(product => ( {products.map(product => (
<a <a
href={product.href} href={product.href}
data-umami-event="allproducts-card"
class="product-card group bg-white rounded-xl overflow-hidden border border-neutral-200 hover:border-primary-300 hover:shadow-lg transition-all" class="product-card group bg-white rounded-xl overflow-hidden border border-neutral-200 hover:border-primary-300 hover:shadow-lg transition-all"
data-category={categoryIdMap[product.category]} data-category={categoryIdMap[product.category]}
> >
@@ -132,8 +134,8 @@ const categoryIdMap = Object.fromEntries(categories.map(c => [c.name, c.id]));
<h2 class="text-3xl font-bold mb-6">ต้องการสินค้าคุณภาพ ราคาโรงงาน?</h2> <h2 class="text-3xl font-bold mb-6">ต้องการสินค้าคุณภาพ ราคาโรงงาน?</h2>
<p class="text-lg text-primary-100 mb-8">ติดต่อเราวันนี้ 090-555-1415 หรือแอดไลน์ ID:JPPSELECTION</p> <p class="text-lg text-primary-100 mb-8">ติดต่อเราวันนี้ 090-555-1415 หรือแอดไลน์ ID:JPPSELECTION</p>
<div class="flex flex-wrap justify-center gap-4"> <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="/contact-us" data-umami-event="allproducts-cta-contact" 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> <a href="https://line.me/ti/p/~JPPSELECTION" target="_blank" rel="noopener" data-umami-event="allproducts-cta-line" class="bg-accent-500 hover:bg-accent-600 text-white py-3 px-8 rounded-xl font-semibold transition-colors">แอดไลน์</a>
</div> </div>
</div> </div>
</section> </section>

View File

@@ -76,17 +76,17 @@ import BaseLayout from '@/layouts/BaseLayout.astro';
</div> </div>
</div> </div>
<div class="flex flex-wrap justify-center gap-4 mb-8 lg:justify-start"> <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"> <a href="https://line.me/ti/p/~JPPSELECTION" target="_blank" rel="noopener" data-umami-event="product-hero-line" 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> <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 แชท Line
</a> </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"> <a href="tel:0905551415" data-umami-event="product-hero-call" 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"> <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" /> <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> </svg>
090-555-1415 090-555-1415
</a> </a>
<a href="#pricelist" data-price-button class="hidden bg-white text-primary-700 hover:bg-primary-50 py-3 px-6 rounded-xl font-semibold flex items-center gap-2"> <a href="#pricelist" data-price-button data-umami-event="product-hero-price" class="hidden 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"> <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="M9 12h6m-6 4h6m2 5H7a2 2 0 01-2-2V5a2 2 0 012-2h5.586a1 1 0 01.707.293l5.414 5.414a1 1 0 01.293.707V19a2 2 0 01-2 2z" /> <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 12h6m-6 4h6m2 5H7a2 2 0 01-2-2V5a2 2 0 012-2h5.586a1 1 0 01.707.293l5.414 5.414a1 1 0 01.293.707V19a2 2 0 01-2 2z" />
</svg> </svg>
@@ -261,7 +261,7 @@ import BaseLayout from '@/layouts/BaseLayout.astro';
<div class="bg-primary-50 border-l-4 border-primary-600 p-4 mt-6"> <div class="bg-primary-50 border-l-4 border-primary-600 p-4 mt-6">
<p class="text-slate-700"> <p class="text-slate-700">
<strong>สอบถามราคาและสั่งซื้อ:</strong> ติดต่อเราได้ที่ Line: <a href="https://line.me/ti/p/~JPPSELECTION" class="text-primary-700 underline">JPPSELECTION</a> หรือโทร <a href="tel:0905551415" class="text-primary-700 underline">090-555-1415</a> ราคาโรงงาน ส่งฟรี กรุงเทพมหานคร และปริมณฑล <strong>สอบถามราคาและสั่งซื้อ:</strong> ติดต่อเราได้ที่ Line: <a href="https://line.me/ti/p/~JPPSELECTION" data-umami-event="product-inline-line" class="text-primary-700 underline">JPPSELECTION</a> หรือโทร <a href="tel:0905551415" data-umami-event="product-inline-call" class="text-primary-700 underline">090-555-1415</a> ราคาโรงงาน ส่งฟรี กรุงเทพมหานคร และปริมณฑล
</p> </p>
</div> </div>
</div> </div>
@@ -274,7 +274,7 @@ import BaseLayout from '@/layouts/BaseLayout.astro';
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 relative z-10"> <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 relative z-10">
<div class="max-w-lg mx-auto text-center"> <div class="max-w-lg mx-auto text-center">
<h2 class="text-xl font-bold mb-6">📥 ดาวน์โหลดราคาสินค้า Armaflex</h2> <h2 class="text-xl font-bold mb-6">📥 ดาวน์โหลดราคาสินค้า Armaflex</h2>
<a href="/documents/16 Price List Armaflex 2567.pdf" target="_blank" class="inline-flex items-center gap-4 p-4 bg-white rounded-xl shadow-sm hover:shadow-md transition-shadow text-left"> <a href="/documents/16 Price List Armaflex 2567.pdf" target="_blank" data-umami-event="product-pdf-download" class="inline-flex items-center gap-4 p-4 bg-white rounded-xl shadow-sm hover:shadow-md transition-shadow text-left">
<svg class="w-8 h-8 text-red-600 flex-shrink-0" fill="currentColor" viewBox="0 0 24 24"> <svg class="w-8 h-8 text-red-600 flex-shrink-0" fill="currentColor" viewBox="0 0 24 24">
<path d="M14 2H6a2 2 0 00-2 2v16a2 2 0 002 2h12a2 2 0 002-2V8l-6-6zm-1 9V3.5L18.5 9H13zM8 13h8v2H8v-2zm0 4h8v2H8v-2zm0-8h2v2H8V9z"/> <path d="M14 2H6a2 2 0 00-2 2v16a2 2 0 002 2h12a2 2 0 002-2V8l-6-6zm-1 9V3.5L18.5 9H13zM8 13h8v2H8v-2zm0 4h8v2H8v-2zm0-8h2v2H8V9z"/>
</svg> </svg>
@@ -296,19 +296,19 @@ import BaseLayout from '@/layouts/BaseLayout.astro';
<p class="text-neutral-600">ภาพสินค้าจริงจากงานติดตั้ง — คลิกเพื่อดูภาพขนาดเต็ม</p> <p class="text-neutral-600">ภาพสินค้าจริงจากงานติดตั้ง — คลิกเพื่อดูภาพขนาดเต็ม</p>
</div> </div>
<div class="grid grid-cols-2 md:grid-cols-3 lg:grid-cols-4 gap-4"> <div class="grid grid-cols-2 md:grid-cols-3 lg:grid-cols-4 gap-4">
<a href="/images/armflex/gallery-1.jpg" target="_blank" rel="noopener" class="group block overflow-hidden rounded-xl shadow-md hover:shadow-xl transition-shadow"> <a href="/images/armflex/gallery-1.jpg" target="_blank" rel="noopener" data-umami-event="product-gallery-1" class="group block overflow-hidden rounded-xl shadow-md hover:shadow-xl transition-shadow">
<img src="/images/armflex/gallery-1.jpg" alt="Armflex ภาพที่ 1" class="w-full h-48 object-cover group-hover:scale-105 transition-transform duration-300" loading="lazy" /> <img src="/images/armflex/gallery-1.jpg" alt="Armflex ภาพที่ 1" class="w-full h-48 object-cover group-hover:scale-105 transition-transform duration-300" loading="lazy" />
</a> </a>
<a href="/images/armflex/gallery-2.jpg" target="_blank" rel="noopener" class="group block overflow-hidden rounded-xl shadow-md hover:shadow-xl transition-shadow"> <a href="/images/armflex/gallery-2.jpg" target="_blank" rel="noopener" data-umami-event="product-gallery-2" class="group block overflow-hidden rounded-xl shadow-md hover:shadow-xl transition-shadow">
<img src="/images/armflex/gallery-2.jpg" alt="Armflex ภาพที่ 2" class="w-full h-48 object-cover group-hover:scale-105 transition-transform duration-300" loading="lazy" /> <img src="/images/armflex/gallery-2.jpg" alt="Armflex ภาพที่ 2" class="w-full h-48 object-cover group-hover:scale-105 transition-transform duration-300" loading="lazy" />
</a> </a>
<a href="/images/armflex/gallery-3.jpg" target="_blank" rel="noopener" class="group block overflow-hidden rounded-xl shadow-md hover:shadow-xl transition-shadow"> <a href="/images/armflex/gallery-3.jpg" target="_blank" rel="noopener" data-umami-event="product-gallery-3" class="group block overflow-hidden rounded-xl shadow-md hover:shadow-xl transition-shadow">
<img src="/images/armflex/gallery-3.jpg" alt="Armflex ภาพที่ 3" class="w-full h-48 object-cover group-hover:scale-105 transition-transform duration-300" loading="lazy" /> <img src="/images/armflex/gallery-3.jpg" alt="Armflex ภาพที่ 3" class="w-full h-48 object-cover group-hover:scale-105 transition-transform duration-300" loading="lazy" />
</a> </a>
<a href="/images/armflex/gallery-4.jpg" target="_blank" rel="noopener" class="group block overflow-hidden rounded-xl shadow-md hover:shadow-xl transition-shadow"> <a href="/images/armflex/gallery-4.jpg" target="_blank" rel="noopener" data-umami-event="product-gallery-4" class="group block overflow-hidden rounded-xl shadow-md hover:shadow-xl transition-shadow">
<img src="/images/armflex/gallery-4.jpg" alt="Armflex ภาพที่ 4" class="w-full h-48 object-cover group-hover:scale-105 transition-transform duration-300" loading="lazy" /> <img src="/images/armflex/gallery-4.jpg" alt="Armflex ภาพที่ 4" class="w-full h-48 object-cover group-hover:scale-105 transition-transform duration-300" loading="lazy" />
</a> </a>
<a href="/images/armflex/gallery-5.jpg" target="_blank" rel="noopener" class="group block overflow-hidden rounded-xl shadow-md hover:shadow-xl transition-shadow"> <a href="/images/armflex/gallery-5.jpg" target="_blank" rel="noopener" data-umami-event="product-gallery-5" class="group block overflow-hidden rounded-xl shadow-md hover:shadow-xl transition-shadow">
<img src="/images/armflex/gallery-5.jpg" alt="Armflex ภาพที่ 5" class="w-full h-48 object-cover group-hover:scale-105 transition-transform duration-300" loading="lazy" /> <img src="/images/armflex/gallery-5.jpg" alt="Armflex ภาพที่ 5" class="w-full h-48 object-cover group-hover:scale-105 transition-transform duration-300" loading="lazy" />
</a> </a>
</div> </div>
@@ -320,8 +320,8 @@ import BaseLayout from '@/layouts/BaseLayout.astro';
<h2 class="text-3xl font-bold mb-6">สนใจสินค้านี้?</h2> <h2 class="text-3xl font-bold mb-6">สนใจสินค้านี้?</h2>
<p class="text-lg text-primary-100 mb-8">ติดต่อเราวันนี้ 090-555-1415 หรือแอดไลน์ ID:JPPSELECTION</p> <p class="text-lg text-primary-100 mb-8">ติดต่อเราวันนี้ 090-555-1415 หรือแอดไลน์ ID:JPPSELECTION</p>
<div class="flex flex-wrap justify-center gap-4"> <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="/contact-us" data-umami-event="product-cta-contact" 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> <a href="https://line.me/ti/p/~JPPSELECTION" target="_blank" rel="noopener" data-umami-event="product-cta-line" class="bg-accent-500 hover:bg-accent-600 text-white py-3 px-8 rounded-xl font-semibold transition-colors">แอดไลน์</a>
</div> </div>
</div> </div>
</section> </section>

View File

@@ -48,7 +48,7 @@ import BaseLayout from '@/layouts/BaseLayout.astro';
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 relative z-10"> <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 relative z-10">
<div class="grid md:grid-cols-2 lg:grid-cols-4 gap-6 mb-16"> <div class="grid md:grid-cols-2 lg:grid-cols-4 gap-6 mb-16">
<!-- Phone --> <!-- Phone -->
<a href="tel:090-555-1415" class="bg-neutral-50 rounded-xl p-6 border border-neutral-200 hover:border-primary-300 hover:shadow-lg transition-all text-center group"> <a href="tel:090-555-1415" data-umami-event="contact-tel" class="bg-neutral-50 rounded-xl p-6 border border-neutral-200 hover:border-primary-300 hover:shadow-lg transition-all text-center group">
<div class="w-14 h-14 mx-auto mb-4 bg-primary-100 rounded-xl flex items-center justify-center group-hover:bg-primary-200"> <div class="w-14 h-14 mx-auto mb-4 bg-primary-100 rounded-xl flex items-center justify-center group-hover:bg-primary-200">
<svg class="w-7 h-7 text-primary-600" fill="none" stroke="currentColor" viewBox="0 0 24 24"> <svg class="w-7 h-7 text-primary-600" 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" /> <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" />
@@ -60,7 +60,7 @@ import BaseLayout from '@/layouts/BaseLayout.astro';
</a> </a>
<!-- LINE --> <!-- LINE -->
<a href="https://line.me/ti/p/~JPPSELECTION" target="_blank" rel="noopener" class="bg-neutral-50 rounded-xl p-6 border border-neutral-200 hover:border-primary-300 hover:shadow-lg transition-all text-center group"> <a href="https://line.me/ti/p/~JPPSELECTION" target="_blank" rel="noopener" data-umami-event="contact-line" class="bg-neutral-50 rounded-xl p-6 border border-neutral-200 hover:border-primary-300 hover:shadow-lg transition-all text-center group">
<div class="w-14 h-14 mx-auto mb-4 bg-green-100 rounded-xl flex items-center justify-center group-hover:bg-green-200"> <div class="w-14 h-14 mx-auto mb-4 bg-green-100 rounded-xl flex items-center justify-center group-hover:bg-green-200">
<svg class="w-7 h-7 text-green-600" fill="currentColor" viewBox="0 0 24 24"> <svg class="w-7 h-7 text-green-600" 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"/> <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"/>
@@ -72,7 +72,7 @@ import BaseLayout from '@/layouts/BaseLayout.astro';
</a> </a>
<!-- Email --> <!-- Email -->
<a href="mailto:dealplustech@gmail.com" class="bg-neutral-50 rounded-xl p-6 border border-neutral-200 hover:border-primary-300 hover:shadow-lg transition-all text-center group"> <a href="mailto:dealplustech@gmail.com" data-umami-event="contact-email" class="bg-neutral-50 rounded-xl p-6 border border-neutral-200 hover:border-primary-300 hover:shadow-lg transition-all text-center group">
<div class="w-14 h-14 mx-auto mb-4 bg-blue-100 rounded-xl flex items-center justify-center group-hover:bg-blue-200"> <div class="w-14 h-14 mx-auto mb-4 bg-blue-100 rounded-xl flex items-center justify-center group-hover:bg-blue-200">
<svg class="w-7 h-7 text-blue-600" fill="none" stroke="currentColor" viewBox="0 0 24 24"> <svg class="w-7 h-7 text-blue-600" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M3 8l7.89 5.26a2 2 0 002.22 0L21 8M5 19h14a2 2 0 002-2V7a2 2 0 00-2-2H5a2 2 0 00-2 2v10a2 2 0 002 2z" /> <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M3 8l7.89 5.26a2 2 0 002.22 0L21 8M5 19h14a2 2 0 002-2V7a2 2 0 00-2-2H5a2 2 0 00-2 2v10a2 2 0 002 2z" />

View File

@@ -62,11 +62,11 @@ import BaseLayout from '@/layouts/BaseLayout.astro';
</div> </div>
</div> </div>
<div class="flex flex-wrap justify-center gap-4 mb-8 lg:justify-start"> <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"> <a href="https://line.me/ti/p/~JPPSELECTION" target="_blank" rel="noopener" data-umami-event="product-hero-line" 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> <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 แชท Line
</a> </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"> <a href="tel:0905551415" data-umami-event="product-hero-call" 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"> <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" /> <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> </svg>
@@ -291,8 +291,8 @@ import BaseLayout from '@/layouts/BaseLayout.astro';
<h2 class="text-3xl font-bold mb-6">สนใจสินค้านี้?</h2> <h2 class="text-3xl font-bold mb-6">สนใจสินค้านี้?</h2>
<p class="text-lg text-primary-100 mb-8">ติดต่อเราวันนี้ 090-555-1415 หรือแอดไลน์ ID:JPPSELECTION</p> <p class="text-lg text-primary-100 mb-8">ติดต่อเราวันนี้ 090-555-1415 หรือแอดไลน์ ID:JPPSELECTION</p>
<div class="flex flex-wrap justify-center gap-4"> <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="/contact-us" data-umami-event="product-cta-contact" 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> <a href="https://line.me/ti/p/~JPPSELECTION" target="_blank" rel="noopener" data-umami-event="product-cta-line" class="bg-accent-500 hover:bg-accent-600 text-white py-3 px-8 rounded-xl font-semibold transition-colors">แอดไลน์</a>
</div> </div>
</div> </div>
</section> </main> </section> </main>

View File

@@ -94,11 +94,11 @@ import BaseLayout from '@/layouts/BaseLayout.astro';
</div> </div>
</div> </div>
<div class="flex flex-wrap justify-center gap-4 mb-8 lg:justify-start"> <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"> <a href="https://line.me/ti/p/~JPPSELECTION" target="_blank" rel="noopener" data-umami-event="product-hero-line" 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> <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 แชท Line
</a> </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"> <a href="tel:0905551415" data-umami-event="product-hero-call" 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"> <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" /> <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> </svg>
@@ -324,8 +324,8 @@ import BaseLayout from '@/layouts/BaseLayout.astro';
<h2 class="text-3xl font-bold mb-6">สนใจสินค้านี้?</h2> <h2 class="text-3xl font-bold mb-6">สนใจสินค้านี้?</h2>
<p class="text-lg text-primary-100 mb-8">ติดต่อเราวันนี้ 090-555-1415 หรือแอดไลน์ ID:JPPSELECTION</p> <p class="text-lg text-primary-100 mb-8">ติดต่อเราวันนี้ 090-555-1415 หรือแอดไลน์ ID:JPPSELECTION</p>
<div class="flex flex-wrap justify-center gap-4"> <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="/contact-us" data-umami-event="product-cta-contact" 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> <a href="https://line.me/ti/p/~JPPSELECTION" target="_blank" rel="noopener" data-umami-event="product-cta-line" class="bg-accent-500 hover:bg-accent-600 text-white py-3 px-8 rounded-xl font-semibold transition-colors">แอดไลน์</a>
</div> </div>
</div> </div>
</section> </main> </section> </main>

View File

@@ -75,6 +75,7 @@ const articles = (await getCollection('blog')).sort(
<div data-animate="fade-up" data-animate-delay="500" class="flex flex-wrap gap-4"> <div data-animate="fade-up" data-animate-delay="500" class="flex flex-wrap gap-4">
<a <a
href="/all-products" href="/all-products"
data-umami-event="home-hero-view-all"
class="group relative inline-flex items-center justify-center gap-3 bg-accent-500 hover:bg-accent-600 text-white py-4 px-8 rounded-xl font-semibold text-lg transition-all duration-300 hover:shadow-2xl hover:shadow-accent-500/30 hover:-translate-y-1 magnetic-btn btn-shimmer overflow-hidden" class="group relative inline-flex items-center justify-center gap-3 bg-accent-500 hover:bg-accent-600 text-white py-4 px-8 rounded-xl font-semibold text-lg transition-all duration-300 hover:shadow-2xl hover:shadow-accent-500/30 hover:-translate-y-1 magnetic-btn btn-shimmer overflow-hidden"
> >
<span class="relative z-10 flex items-center gap-2"> <span class="relative z-10 flex items-center gap-2">
@@ -86,6 +87,7 @@ const articles = (await getCollection('blog')).sort(
</a> </a>
<a <a
href="/contact-us" href="/contact-us"
data-umami-event="home-hero-contact"
class="group inline-flex items-center justify-center gap-2 bg-white/10 hover:bg-white/20 text-white py-4 px-8 rounded-xl font-semibold text-lg border border-white/30 transition-all duration-300 hover:-translate-y-1 magnetic-btn" class="group inline-flex items-center justify-center gap-2 bg-white/10 hover:bg-white/20 text-white py-4 px-8 rounded-xl font-semibold text-lg border border-white/30 transition-all duration-300 hover:-translate-y-1 magnetic-btn"
> >
<svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24"> <svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
@@ -200,7 +202,7 @@ const articles = (await getCollection('blog')).sort(
<!-- Product Grid --> <!-- Product Grid -->
<div class="grid md:grid-cols-2 lg:grid-cols-3 gap-6 lg:gap-8" data-animate-stagger> <div class="grid md:grid-cols-2 lg:grid-cols-3 gap-6 lg:gap-8" data-animate-stagger>
<!-- Product Card 1 --> <!-- Product Card 1 -->
<a href="/ท่อ-ppr-thai-ppr" class="group bg-neutral-50 rounded-3xl overflow-hidden border border-neutral-200 hover:border-primary-300 transition-all duration-500 hover:shadow-2xl hover:shadow-primary-600/10 hover:-translate-y-2"> <a href="/ท่อ-ppr-thai-ppr" data-umami-event="home-product-card" class="group bg-neutral-50 rounded-3xl overflow-hidden border border-neutral-200 hover:border-primary-300 transition-all duration-500 hover:shadow-2xl hover:shadow-primary-600/10 hover:-translate-y-2">
<div class="aspect-square img-hover relative overflow-hidden"> <div class="aspect-square img-hover relative overflow-hidden">
<img <img
src="/images/products-cropped/ppr-pipe_000C.jpg" src="/images/products-cropped/ppr-pipe_000C.jpg"
@@ -230,7 +232,7 @@ const articles = (await getCollection('blog')).sort(
</a> </a>
<!-- Product Card 2 --> <!-- Product Card 2 -->
<a href="/grilles" class="group bg-neutral-50 rounded-3xl overflow-hidden border border-neutral-200 hover:border-primary-300 transition-all duration-500 hover:shadow-2xl hover:shadow-primary-600/10 hover:-translate-y-2"> <a href="/grilles" data-umami-event="home-product-card" class="group bg-neutral-50 rounded-3xl overflow-hidden border border-neutral-200 hover:border-primary-300 transition-all duration-500 hover:shadow-2xl hover:shadow-primary-600/10 hover:-translate-y-2">
<div class="aspect-square img-hover relative overflow-hidden"> <div class="aspect-square img-hover relative overflow-hidden">
<img <img
src="/images/products-cropped/grilles_000C.jpg" src="/images/products-cropped/grilles_000C.jpg"
@@ -260,7 +262,7 @@ const articles = (await getCollection('blog')).sort(
</a> </a>
<!-- Product Card 3 --> <!-- Product Card 3 -->
<a href="/เทอร์โมเบรค-thermobreak" class="group bg-neutral-50 rounded-3xl overflow-hidden border border-neutral-200 hover:border-primary-300 transition-all duration-500 hover:shadow-2xl hover:shadow-primary-600/10 hover:-translate-y-2"> <a href="/เทอร์โมเบรค-thermobreak" data-umami-event="home-product-card" class="group bg-neutral-50 rounded-3xl overflow-hidden border border-neutral-200 hover:border-primary-300 transition-all duration-500 hover:shadow-2xl hover:shadow-primary-600/10 hover:-translate-y-2">
<div class="aspect-square img-hover relative overflow-hidden"> <div class="aspect-square img-hover relative overflow-hidden">
<img <img
src="/images/thermobreak/thermobreak-main.jpg" src="/images/thermobreak/thermobreak-main.jpg"
@@ -294,6 +296,7 @@ const articles = (await getCollection('blog')).sort(
<div class="text-center mt-12" data-animate="fade-up"> <div class="text-center mt-12" data-animate="fade-up">
<a <a
href="/all-products" href="/all-products"
data-umami-event="home-hero-view-all"
class="inline-flex items-center gap-2 bg-primary-600 hover:bg-primary-700 text-white py-4 px-8 rounded-xl font-semibold text-lg transition-all hover:shadow-lg hover:shadow-primary-600/25 hover:-translate-y-0.5 magnetic-btn btn-shimmer" class="inline-flex items-center gap-2 bg-primary-600 hover:bg-primary-700 text-white py-4 px-8 rounded-xl font-semibold text-lg transition-all hover:shadow-lg hover:shadow-primary-600/25 hover:-translate-y-0.5 magnetic-btn btn-shimmer"
> >
ดูสินค้าทั้งหมด ดูสินค้าทั้งหมด
@@ -317,7 +320,7 @@ const articles = (await getCollection('blog')).sort(
<div class="grid grid-cols-1 sm:grid-cols-2 md:grid-cols-3 lg:grid-cols-4 gap-4 lg:gap-6" data-animate-stagger> <div class="grid grid-cols-1 sm:grid-cols-2 md:grid-cols-3 lg:grid-cols-4 gap-4 lg:gap-6" data-animate-stagger>
<!-- Category 1: ท่อพีพีอาร์ (ไทย PPR) --> <!-- Category 1: ท่อพีพีอาร์ (ไทย PPR) -->
<a href="/all-products?filter=ppr" class="group relative h-64 rounded-3xl overflow-hidden border border-neutral-200 hover:shadow-2xl transition-all duration-500 hover:-translate-y-1"> <a href="/all-products?filter=ppr" data-umami-event="home-category-ppr" class="group relative h-64 rounded-3xl overflow-hidden border border-neutral-200 hover:shadow-2xl transition-all duration-500 hover:-translate-y-1">
<img src="/images/products-cropped/ppr-pipe_000C.jpg" alt="ระบบท่อ" class="absolute inset-0 w-full h-full object-cover transition-transform duration-700 group-hover:scale-110" loading="lazy" /> <img src="/images/products-cropped/ppr-pipe_000C.jpg" alt="ระบบท่อ" class="absolute inset-0 w-full h-full object-cover transition-transform duration-700 group-hover:scale-110" loading="lazy" />
<div class="absolute inset-0 bg-gradient-to-t from-neutral-900/90 via-neutral-900/40 to-transparent"></div> <div class="absolute inset-0 bg-gradient-to-t from-neutral-900/90 via-neutral-900/40 to-transparent"></div>
<div class="relative h-full flex flex-col justify-end p-6 text-white"> <div class="relative h-full flex flex-col justify-end p-6 text-white">
@@ -331,7 +334,7 @@ const articles = (await getCollection('blog')).sort(
</a> </a>
<!-- Category 2: เครื่องเชื่อมท่อ --> <!-- Category 2: เครื่องเชื่อมท่อ -->
<a href="/all-products?filter=welding" class="group relative h-64 rounded-3xl overflow-hidden border border-neutral-200 hover:shadow-2xl transition-all duration-500 hover:-translate-y-1"> <a href="/all-products?filter=welding" data-umami-event="home-category-welding" class="group relative h-64 rounded-3xl overflow-hidden border border-neutral-200 hover:shadow-2xl transition-all duration-500 hover:-translate-y-1">
<img src="/images/products-misc/ppr-welding-machine-main.jpg" alt="เครื่องเชื่อมท่อ" class="absolute inset-0 w-full h-full object-cover transition-transform duration-700 group-hover:scale-110" loading="lazy" /> <img src="/images/products-misc/ppr-welding-machine-main.jpg" alt="เครื่องเชื่อมท่อ" class="absolute inset-0 w-full h-full object-cover transition-transform duration-700 group-hover:scale-110" loading="lazy" />
<div class="absolute inset-0 bg-gradient-to-t from-neutral-900/90 via-neutral-900/40 to-transparent"></div> <div class="absolute inset-0 bg-gradient-to-t from-neutral-900/90 via-neutral-900/40 to-transparent"></div>
<div class="relative h-full flex flex-col justify-end p-6 text-white"> <div class="relative h-full flex flex-col justify-end p-6 text-white">
@@ -345,7 +348,7 @@ const articles = (await getCollection('blog')).sort(
</a> </a>
<!-- Category 3: ระบบน้ำ --> <!-- Category 3: ระบบน้ำ -->
<a href="/all-products?filter=water" class="group relative h-64 rounded-3xl overflow-hidden border border-neutral-200 hover:shadow-2xl transition-all duration-500 hover:-translate-y-1"> <a href="/all-products?filter=water" data-umami-event="home-category-water" class="group relative h-64 rounded-3xl overflow-hidden border border-neutral-200 hover:shadow-2xl transition-all duration-500 hover:-translate-y-1">
<img src="/images/products-cropped/valve_000C.jpg" alt="ระบบน้ำ" class="absolute inset-0 w-full h-full object-cover transition-transform duration-700 group-hover:scale-110" loading="lazy" /> <img src="/images/products-cropped/valve_000C.jpg" alt="ระบบน้ำ" class="absolute inset-0 w-full h-full object-cover transition-transform duration-700 group-hover:scale-110" loading="lazy" />
<div class="absolute inset-0 bg-gradient-to-t from-neutral-900/90 via-neutral-900/40 to-transparent"></div> <div class="absolute inset-0 bg-gradient-to-t from-neutral-900/90 via-neutral-900/40 to-transparent"></div>
<div class="relative h-full flex flex-col justify-end p-6 text-white"> <div class="relative h-full flex flex-col justify-end p-6 text-white">
@@ -359,7 +362,7 @@ const articles = (await getCollection('blog')).sort(
</a> </a>
<!-- Category 4: อุปกรณ์ปรับอากาศ (กริล) --> <!-- Category 4: อุปกรณ์ปรับอากาศ (กริล) -->
<a href="/all-products?filter=ac" class="group relative h-64 rounded-3xl overflow-hidden border border-neutral-200 hover:shadow-2xl transition-all duration-500 hover:-translate-y-1"> <a href="/all-products?filter=ac" data-umami-event="home-category-ac" class="group relative h-64 rounded-3xl overflow-hidden border border-neutral-200 hover:shadow-2xl transition-all duration-500 hover:-translate-y-1">
<img src="/images/products-cropped/grilles_000C.jpg" alt="อุปกรณ์ปรับอากาศ" class="absolute inset-0 w-full h-full object-cover transition-transform duration-700 group-hover:scale-110" loading="lazy" /> <img src="/images/products-cropped/grilles_000C.jpg" alt="อุปกรณ์ปรับอากาศ" class="absolute inset-0 w-full h-full object-cover transition-transform duration-700 group-hover:scale-110" loading="lazy" />
<div class="absolute inset-0 bg-gradient-to-t from-neutral-900/90 via-neutral-900/40 to-transparent"></div> <div class="absolute inset-0 bg-gradient-to-t from-neutral-900/90 via-neutral-900/40 to-transparent"></div>
<div class="relative h-full flex flex-col justify-end p-6 text-white"> <div class="relative h-full flex flex-col justify-end p-6 text-white">
@@ -373,7 +376,7 @@ const articles = (await getCollection('blog')).sort(
</a> </a>
<!-- Category 5: อุปกรณ์ดับเพลิง --> <!-- Category 5: อุปกรณ์ดับเพลิง -->
<a href="/all-products?filter=fire" class="group relative h-64 rounded-3xl overflow-hidden border border-neutral-200 hover:shadow-2xl transition-all duration-500 hover:-translate-y-1"> <a href="/all-products?filter=fire" data-umami-event="home-category-fire" class="group relative h-64 rounded-3xl overflow-hidden border border-neutral-200 hover:shadow-2xl transition-all duration-500 hover:-translate-y-1">
<img src="/images/products-cropped/extinguishers_000C.jpg" alt="อุปกรณ์ดับเพลิง" class="absolute inset-0 w-full h-full object-cover transition-transform duration-700 group-hover:scale-110" loading="lazy" /> <img src="/images/products-cropped/extinguishers_000C.jpg" alt="อุปกรณ์ดับเพลิง" class="absolute inset-0 w-full h-full object-cover transition-transform duration-700 group-hover:scale-110" loading="lazy" />
<div class="absolute inset-0 bg-gradient-to-t from-neutral-900/90 via-neutral-900/40 to-transparent"></div> <div class="absolute inset-0 bg-gradient-to-t from-neutral-900/90 via-neutral-900/40 to-transparent"></div>
<div class="relative h-full flex flex-col justify-end p-6 text-white"> <div class="relative h-full flex flex-col justify-end p-6 text-white">
@@ -387,7 +390,7 @@ const articles = (await getCollection('blog')).sort(
</a> </a>
<!-- Category 6: ฉนวนหุ้มท่อ (Thermobreak) --> <!-- Category 6: ฉนวนหุ้มท่อ (Thermobreak) -->
<a href="/all-products?filter=insulation" class="group relative h-64 rounded-3xl overflow-hidden border border-neutral-200 hover:shadow-2xl transition-all duration-500 hover:-translate-y-1"> <a href="/all-products?filter=insulation" data-umami-event="home-category-insulation" class="group relative h-64 rounded-3xl overflow-hidden border border-neutral-200 hover:shadow-2xl transition-all duration-500 hover:-translate-y-1">
<img src="/images/thermobreak/thermobreak-main.jpg" alt="ฉนวนหุ้มท่อ" class="absolute inset-0 w-full h-full object-cover transition-transform duration-700 group-hover:scale-110" loading="lazy" /> <img src="/images/thermobreak/thermobreak-main.jpg" alt="ฉนวนหุ้มท่อ" class="absolute inset-0 w-full h-full object-cover transition-transform duration-700 group-hover:scale-110" loading="lazy" />
<div class="absolute inset-0 bg-gradient-to-t from-neutral-900/90 via-neutral-900/40 to-transparent"></div> <div class="absolute inset-0 bg-gradient-to-t from-neutral-900/90 via-neutral-900/40 to-transparent"></div>
<div class="relative h-full flex flex-col justify-end p-6 text-white"> <div class="relative h-full flex flex-col justify-end p-6 text-white">
@@ -401,7 +404,7 @@ const articles = (await getCollection('blog')).sort(
</a> </a>
<!-- Category 7: ระบบรั้ว --> <!-- Category 7: ระบบรั้ว -->
<a href="/all-products?filter=fence" class="group relative h-64 rounded-3xl overflow-hidden border border-neutral-200 hover:shadow-2xl transition-all duration-500 hover:-translate-y-1"> <a href="/all-products?filter=fence" data-umami-event="home-category-fence" class="group relative h-64 rounded-3xl overflow-hidden border border-neutral-200 hover:shadow-2xl transition-all duration-500 hover:-translate-y-1">
<img src="/images/products-raw/vineman/ระบบรั้วไวน์แมน-Vineman-e1613286324569-1024x880.jpg" alt="ระบบรั้ว" class="absolute inset-0 w-full h-full object-cover transition-transform duration-700 group-hover:scale-110" loading="lazy" /> <img src="/images/products-raw/vineman/ระบบรั้วไวน์แมน-Vineman-e1613286324569-1024x880.jpg" alt="ระบบรั้ว" class="absolute inset-0 w-full h-full object-cover transition-transform duration-700 group-hover:scale-110" loading="lazy" />
<div class="absolute inset-0 bg-gradient-to-t from-neutral-900/90 via-neutral-900/40 to-transparent"></div> <div class="absolute inset-0 bg-gradient-to-t from-neutral-900/90 via-neutral-900/40 to-transparent"></div>
<div class="relative h-full flex flex-col justify-end p-6 text-white"> <div class="relative h-full flex flex-col justify-end p-6 text-white">
@@ -415,7 +418,7 @@ const articles = (await getCollection('blog')).sort(
</a> </a>
<!-- All products tile (no image, just text CTA) --> <!-- All products tile (no image, just text CTA) -->
<a href="/all-products" class="group relative h-64 rounded-3xl overflow-hidden bg-gradient-to-br from-neutral-900 to-neutral-700 border border-neutral-700 hover:border-neutral-500 hover:shadow-2xl transition-all duration-500 hover:-translate-y-1 text-white flex flex-col justify-end p-6"> <a href="/all-products" data-umami-event="home-category-all" class="group relative h-64 rounded-3xl overflow-hidden bg-gradient-to-br from-neutral-900 to-neutral-700 border border-neutral-700 hover:border-neutral-500 hover:shadow-2xl transition-all duration-500 hover:-translate-y-1 text-white flex flex-col justify-end p-6">
<h3 class="text-xl font-bold mb-1 group-hover:text-primary-300 transition-colors">สินค้าทั้งหมด</h3> <h3 class="text-xl font-bold mb-1 group-hover:text-primary-300 transition-colors">สินค้าทั้งหมด</h3>
<p class="text-sm text-white/70 mb-2">ดูทุกหมวดพร้อมกัน</p> <p class="text-sm text-white/70 mb-2">ดูทุกหมวดพร้อมกัน</p>
<span class="inline-flex items-center gap-1 text-sm font-medium text-primary-300 group-hover:gap-2 transition-all"> <span class="inline-flex items-center gap-1 text-sm font-medium text-primary-300 group-hover:gap-2 transition-all">
@@ -466,7 +469,7 @@ const articles = (await getCollection('blog')).sort(
<h2 class="text-3xl lg:text-4xl font-bold text-slate-900">บทความล่าสุด</h2> <h2 class="text-3xl lg:text-4xl font-bold text-slate-900">บทความล่าสุด</h2>
<p class="text-lg text-slate-600 mt-2">ความรู้และข้อมูลที่เป็นประโยชน์เกี่ยวกับระบบน้ำและอุปกรณ์</p> <p class="text-lg text-slate-600 mt-2">ความรู้และข้อมูลที่เป็นประโยชน์เกี่ยวกับระบบน้ำและอุปกรณ์</p>
</div> </div>
<a href="/%E0%B8%9A%E0%B8%97%E0%B8%84%E0%B8%A7%E0%B8%B2%E0%B8%A1" class="hidden sm:inline-flex items-center gap-2 text-primary-600 hover:text-primary-700 font-semibold transition-colors"> <a href="/%E0%B8%9A%E0%B8%97%E0%B8%84%E0%B8%A7%E0%B8%B2%E0%B8%A1" data-umami-event="home-blog" class="hidden sm:inline-flex items-center gap-2 text-primary-600 hover:text-primary-700 font-semibold transition-colors">
ดูทั้งหมด ดูทั้งหมด
<svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24"> <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="M17 8l4 4m0 0l-4 4m4-4H3"/> <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M17 8l4 4m0 0l-4 4m4-4H3"/>
@@ -476,7 +479,7 @@ const articles = (await getCollection('blog')).sort(
<div class="grid md:grid-cols-2 lg:grid-cols-3 gap-8"> <div class="grid md:grid-cols-2 lg:grid-cols-3 gap-8">
{articles.length > 0 && articles.map(article => ( {articles.length > 0 && 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"> <a href={`/${encodeURI('บทความ')}/${encodeURIComponent(article.id)}`} data-umami-event="home-blog-card" 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"> <div class="aspect-[16/9] bg-slate-100 overflow-hidden">
{article.data.featured_image ? ( {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" /> <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" />
@@ -512,7 +515,7 @@ const articles = (await getCollection('blog')).sort(
</div> </div>
<div class="text-center mt-10 sm:hidden"> <div class="text-center mt-10 sm:hidden">
<a href="/%E0%B8%9A%E0%B8%97%E0%B8%84%E0%B8%A7%E0%B8%B2%E0%B8%A1" class="inline-flex items-center gap-2 text-primary-600 hover:text-primary-700 font-semibold transition-colors"> <a href="/%E0%B8%9A%E0%B8%97%E0%B8%84%E0%B8%A7%E0%B8%B2%E0%B8%A1" data-umami-event="home-blog" class="inline-flex items-center gap-2 text-primary-600 hover:text-primary-700 font-semibold transition-colors">
ดูบทความทั้งหมด ดูบทความทั้งหมด
<svg class="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24"> <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="M17 8l4 4m0 0l-4 4m4-4H3"/> <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M17 8l4 4m0 0l-4 4m4-4H3"/>
@@ -538,6 +541,7 @@ const articles = (await getCollection('blog')).sort(
<div data-animate="fade-up" data-animate-delay="200" class="flex flex-wrap justify-center gap-4"> <div data-animate="fade-up" data-animate-delay="200" class="flex flex-wrap justify-center gap-4">
<a <a
href="tel:090-555-1415" href="tel:090-555-1415"
data-umami-event="home-cta-call"
class="group inline-flex items-center justify-center gap-3 bg-white text-primary-700 py-4 px-10 rounded-xl font-semibold text-lg hover:bg-primary-50 transition-all hover:shadow-2xl hover:shadow-white/25 hover:-translate-y-1 magnetic-btn btn-shimmer" class="group inline-flex items-center justify-center gap-3 bg-white text-primary-700 py-4 px-10 rounded-xl font-semibold text-lg hover:bg-primary-50 transition-all hover:shadow-2xl hover:shadow-white/25 hover:-translate-y-1 magnetic-btn btn-shimmer"
> >
<svg class="w-6 h-6" fill="none" stroke="currentColor" viewBox="0 0 24 24"> <svg class="w-6 h-6" fill="none" stroke="currentColor" viewBox="0 0 24 24">
@@ -547,6 +551,7 @@ const articles = (await getCollection('blog')).sort(
</a> </a>
<a <a
href="https://line.me/ti/p/~JPPSELECTION" href="https://line.me/ti/p/~JPPSELECTION"
data-umami-event="home-cta-line"
target="_blank" target="_blank"
rel="noopener" rel="noopener"
class="group inline-flex items-center justify-center gap-3 bg-accent-500 hover:bg-accent-600 text-white py-4 px-10 rounded-xl font-semibold text-lg transition-all hover:shadow-2xl hover:shadow-accent-500/30 hover:-translate-y-1 magnetic-btn btn-shimmer" class="group inline-flex items-center justify-center gap-3 bg-accent-500 hover:bg-accent-600 text-white py-4 px-10 rounded-xl font-semibold text-lg transition-all hover:shadow-2xl hover:shadow-accent-500/30 hover:-translate-y-1 magnetic-btn btn-shimmer"

View File

@@ -63,17 +63,17 @@ import BaseLayout from '@/layouts/BaseLayout.astro';
</div> </div>
</div> </div>
<div class="flex flex-wrap justify-center gap-4 mb-8 lg:justify-start"> <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"> <a href="https://line.me/ti/p/~JPPSELECTION" target="_blank" rel="noopener" data-umami-event="product-hero-line" 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> <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 แชท Line
</a> </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"> <a href="tel:0905551415" data-umami-event="product-hero-call" 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"> <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" /> <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> </svg>
090-555-1415 090-555-1415
</a> </a>
<a href="#pricelist" data-price-button class="hidden bg-white text-primary-700 hover:bg-primary-50 py-3 px-6 rounded-xl font-semibold flex items-center gap-2"> <a href="#pricelist" data-price-button data-umami-event="product-hero-price" class="hidden 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"> <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="M9 12h6m-6 4h6m2 5H7a2 2 0 01-2-2V5a2 2 0 012-2h5.586a1 1 0 01.707.293l5.414 5.414a1 1 0 01.293.707V19a2 2 0 01-2 2z" /> <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 12h6m-6 4h6m2 5H7a2 2 0 01-2-2V5a2 2 0 012-2h5.586a1 1 0 01.707.293l5.414 5.414a1 1 0 01.293.707V19a2 2 0 01-2 2z" />
</svg> </svg>
@@ -232,7 +232,7 @@ import BaseLayout from '@/layouts/BaseLayout.astro';
<div class="bg-primary-50 border-l-4 border-primary-600 p-4 mt-6"> <div class="bg-primary-50 border-l-4 border-primary-600 p-4 mt-6">
<p class="text-slate-700"> <p class="text-slate-700">
<strong>สอบถามราคาและสั่งซื้อ:</strong> ติดต่อเราได้ที่ Line: <a href="https://line.me/ti/p/~JPPSELECTION" class="text-primary-700 underline">JPPSELECTION</a> หรือโทร <a href="tel:0905551415" class="text-primary-700 underline">090-555-1415</a> ราคาโรงงาน ส่งฟรี กรุงเทพมหานคร และปริมณฑล <strong>สอบถามราคาและสั่งซื้อ:</strong> ติดต่อเราได้ที่ Line: <a href="https://line.me/ti/p/~JPPSELECTION" data-umami-event="product-inline-line" class="text-primary-700 underline">JPPSELECTION</a> หรือโทร <a href="tel:0905551415" data-umami-event="product-inline-call" class="text-primary-700 underline">090-555-1415</a> ราคาโรงงาน ส่งฟรี กรุงเทพมหานคร และปริมณฑล
</p> </p>
</div> </div>
</div> </div>
@@ -245,7 +245,7 @@ import BaseLayout from '@/layouts/BaseLayout.astro';
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 relative z-10"> <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 relative z-10">
<div class="max-w-lg mx-auto text-center"> <div class="max-w-lg mx-auto text-center">
<h2 class="text-xl font-bold mb-6">📥 ดาวน์โหลดราคาสินค้า Maxflex FR</h2> <h2 class="text-xl font-bold mb-6">📥 ดาวน์โหลดราคาสินค้า Maxflex FR</h2>
<a href="/documents/22 Price List Maxflex แบบม้วน FR Roll MSR15M.pdf" target="_blank" class="inline-flex items-center gap-4 p-4 bg-white rounded-xl shadow-sm hover:shadow-md transition-shadow text-left mb-4"> <a href="/documents/22 Price List Maxflex แบบม้วน FR Roll MSR15M.pdf" target="_blank" data-umami-event="product-pdf-download" class="inline-flex items-center gap-4 p-4 bg-white rounded-xl shadow-sm hover:shadow-md transition-shadow text-left mb-4">
<svg class="w-8 h-8 text-red-600 flex-shrink-0" fill="currentColor" viewBox="0 0 24 24"> <svg class="w-8 h-8 text-red-600 flex-shrink-0" fill="currentColor" viewBox="0 0 24 24">
<path d="M14 2H6a2 2 0 00-2 2v16a2 2 0 002 2h12a2 2 0 002-2V8l-6-6zm-1 9V3.5L18.5 9H13zM8 13h8v2H8v-2zm0 4h8v2H8v-2zm0-8h2v2H8V9z"/> <path d="M14 2H6a2 2 0 00-2 2v16a2 2 0 002 2h12a2 2 0 002-2V8l-6-6zm-1 9V3.5L18.5 9H13zM8 13h8v2H8v-2zm0 4h8v2H8v-2zm0-8h2v2H8V9z"/>
</svg> </svg>
@@ -267,28 +267,28 @@ import BaseLayout from '@/layouts/BaseLayout.astro';
<p class="text-neutral-600">ภาพสินค้าจริงจากงานติดตั้ง — คลิกเพื่อดูภาพขนาดเต็ม</p> <p class="text-neutral-600">ภาพสินค้าจริงจากงานติดตั้ง — คลิกเพื่อดูภาพขนาดเต็ม</p>
</div> </div>
<div class="grid grid-cols-2 md:grid-cols-3 lg:grid-cols-4 gap-4"> <div class="grid grid-cols-2 md:grid-cols-3 lg:grid-cols-4 gap-4">
<a href="/images/maxflex/gallery-1.jpg" target="_blank" rel="noopener" class="group block overflow-hidden rounded-xl shadow-md hover:shadow-xl transition-shadow"> <a href="/images/maxflex/gallery-1.jpg" target="_blank" rel="noopener" data-umami-event="product-gallery-1" class="group block overflow-hidden rounded-xl shadow-md hover:shadow-xl transition-shadow">
<img src="/images/maxflex/gallery-1.jpg" alt="Maxflex ภาพที่ 1" class="w-full h-48 object-cover group-hover:scale-105 transition-transform duration-300" loading="lazy" /> <img src="/images/maxflex/gallery-1.jpg" alt="Maxflex ภาพที่ 1" class="w-full h-48 object-cover group-hover:scale-105 transition-transform duration-300" loading="lazy" />
</a> </a>
<a href="/images/maxflex/gallery-3.jpg" target="_blank" rel="noopener" class="group block overflow-hidden rounded-xl shadow-md hover:shadow-xl transition-shadow"> <a href="/images/maxflex/gallery-3.jpg" target="_blank" rel="noopener" data-umami-event="product-gallery-3" class="group block overflow-hidden rounded-xl shadow-md hover:shadow-xl transition-shadow">
<img src="/images/maxflex/gallery-3.jpg" alt="Maxflex ภาพที่ 3" class="w-full h-48 object-cover group-hover:scale-105 transition-transform duration-300" loading="lazy" /> <img src="/images/maxflex/gallery-3.jpg" alt="Maxflex ภาพที่ 3" class="w-full h-48 object-cover group-hover:scale-105 transition-transform duration-300" loading="lazy" />
</a> </a>
<a href="/images/maxflex/gallery-4.jpg" target="_blank" rel="noopener" class="group block overflow-hidden rounded-xl shadow-md hover:shadow-xl transition-shadow"> <a href="/images/maxflex/gallery-4.jpg" target="_blank" rel="noopener" data-umami-event="product-gallery-4" class="group block overflow-hidden rounded-xl shadow-md hover:shadow-xl transition-shadow">
<img src="/images/maxflex/gallery-4.jpg" alt="Maxflex ภาพที่ 4" class="w-full h-48 object-cover group-hover:scale-105 transition-transform duration-300" loading="lazy" /> <img src="/images/maxflex/gallery-4.jpg" alt="Maxflex ภาพที่ 4" class="w-full h-48 object-cover group-hover:scale-105 transition-transform duration-300" loading="lazy" />
</a> </a>
<a href="/images/maxflex/gallery-5.jpg" target="_blank" rel="noopener" class="group block overflow-hidden rounded-xl shadow-md hover:shadow-xl transition-shadow"> <a href="/images/maxflex/gallery-5.jpg" target="_blank" rel="noopener" data-umami-event="product-gallery-5" class="group block overflow-hidden rounded-xl shadow-md hover:shadow-xl transition-shadow">
<img src="/images/maxflex/gallery-5.jpg" alt="Maxflex ภาพที่ 5" class="w-full h-48 object-cover group-hover:scale-105 transition-transform duration-300" loading="lazy" /> <img src="/images/maxflex/gallery-5.jpg" alt="Maxflex ภาพที่ 5" class="w-full h-48 object-cover group-hover:scale-105 transition-transform duration-300" loading="lazy" />
</a> </a>
<a href="/images/maxflex/gallery-6.jpg" target="_blank" rel="noopener" class="group block overflow-hidden rounded-xl shadow-md hover:shadow-xl transition-shadow"> <a href="/images/maxflex/gallery-6.jpg" target="_blank" rel="noopener" data-umami-event="product-gallery-6" class="group block overflow-hidden rounded-xl shadow-md hover:shadow-xl transition-shadow">
<img src="/images/maxflex/gallery-6.jpg" alt="Maxflex ภาพที่ 6" class="w-full h-48 object-cover group-hover:scale-105 transition-transform duration-300" loading="lazy" /> <img src="/images/maxflex/gallery-6.jpg" alt="Maxflex ภาพที่ 6" class="w-full h-48 object-cover group-hover:scale-105 transition-transform duration-300" loading="lazy" />
</a> </a>
<a href="/images/maxflex/gallery-7.jpg" target="_blank" rel="noopener" class="group block overflow-hidden rounded-xl shadow-md hover:shadow-xl transition-shadow"> <a href="/images/maxflex/gallery-7.jpg" target="_blank" rel="noopener" data-umami-event="product-gallery-7" class="group block overflow-hidden rounded-xl shadow-md hover:shadow-xl transition-shadow">
<img src="/images/maxflex/gallery-7.jpg" alt="Maxflex ภาพที่ 7" class="w-full h-48 object-cover group-hover:scale-105 transition-transform duration-300" loading="lazy" /> <img src="/images/maxflex/gallery-7.jpg" alt="Maxflex ภาพที่ 7" class="w-full h-48 object-cover group-hover:scale-105 transition-transform duration-300" loading="lazy" />
</a> </a>
<a href="/images/maxflex/gallery-8.jpg" target="_blank" rel="noopener" class="group block overflow-hidden rounded-xl shadow-md hover:shadow-xl transition-shadow"> <a href="/images/maxflex/gallery-8.jpg" target="_blank" rel="noopener" data-umami-event="product-gallery-8" class="group block overflow-hidden rounded-xl shadow-md hover:shadow-xl transition-shadow">
<img src="/images/maxflex/gallery-8.jpg" alt="Maxflex ภาพที่ 8" class="w-full h-48 object-cover group-hover:scale-105 transition-transform duration-300" loading="lazy" /> <img src="/images/maxflex/gallery-8.jpg" alt="Maxflex ภาพที่ 8" class="w-full h-48 object-cover group-hover:scale-105 transition-transform duration-300" loading="lazy" />
</a> </a>
<a href="/images/maxflex/gallery-9.jpg" target="_blank" rel="noopener" class="group block overflow-hidden rounded-xl shadow-md hover:shadow-xl transition-shadow"> <a href="/images/maxflex/gallery-9.jpg" target="_blank" rel="noopener" data-umami-event="product-gallery-9" class="group block overflow-hidden rounded-xl shadow-md hover:shadow-xl transition-shadow">
<img src="/images/maxflex/gallery-9.jpg" alt="Maxflex ภาพที่ 9" class="w-full h-48 object-cover group-hover:scale-105 transition-transform duration-300" loading="lazy" /> <img src="/images/maxflex/gallery-9.jpg" alt="Maxflex ภาพที่ 9" class="w-full h-48 object-cover group-hover:scale-105 transition-transform duration-300" loading="lazy" />
</a> </a>
</div> </div>
@@ -300,8 +300,8 @@ import BaseLayout from '@/layouts/BaseLayout.astro';
<h2 class="text-3xl font-bold mb-6">สนใจสินค้านี้?</h2> <h2 class="text-3xl font-bold mb-6">สนใจสินค้านี้?</h2>
<p class="text-lg text-primary-100 mb-8">ติดต่อเราวันนี้ 090-555-1415 หรือแอดไลน์ ID:JPPSELECTION</p> <p class="text-lg text-primary-100 mb-8">ติดต่อเราวันนี้ 090-555-1415 หรือแอดไลน์ ID:JPPSELECTION</p>
<div class="flex flex-wrap justify-center gap-4"> <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="/contact-us" data-umami-event="product-cta-contact" 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> <a href="https://line.me/ti/p/~JPPSELECTION" target="_blank" rel="noopener" data-umami-event="product-cta-line" class="bg-accent-500 hover:bg-accent-600 text-white py-3 px-8 rounded-xl font-semibold transition-colors">แอดไลน์</a>
</div> </div>
</div> </div>
</section> </section>

View File

@@ -36,11 +36,11 @@ const description = "MICROFIBER ผู้ผลิตฉนวนใยแก้
MICROFIBER ผู้ผลิตฉนวนใยแก้ว (Glass Wool) ชั้นนำของไทย ผลิตภัณฑ์คุณภาพสูง มาตรฐานสากล สำหรับงานหลังคา งานระบบปรับอากาศ และงานอุตสาหกรรม ราคาคุ้มค่า ส่งฟรี MICROFIBER ผู้ผลิตฉนวนใยแก้ว (Glass Wool) ชั้นนำของไทย ผลิตภัณฑ์คุณภาพสูง มาตรฐานสากล สำหรับงานหลังคา งานระบบปรับอากาศ และงานอุตสาหกรรม ราคาคุ้มค่า ส่งฟรี
</p> </p>
<div class="flex flex-wrap justify-center gap-4 mb-8 lg:justify-start"> <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"> <a href="https://line.me/ti/p/~JPPSELECTION" target="_blank" rel="noopener" data-umami-event="product-hero-line" 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> <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 แชท Line
</a> </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"> <a href="tel:0905551415" data-umami-event="product-hero-call" 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"> <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" /> <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> </svg>
@@ -276,31 +276,31 @@ const description = "MICROFIBER ผู้ผลิตฉนวนใยแก้
<p class="text-neutral-600">ภาพสินค้าจริงจากงานติดตั้ง — คลิกเพื่อดูภาพขนาดเต็ม</p> <p class="text-neutral-600">ภาพสินค้าจริงจากงานติดตั้ง — คลิกเพื่อดูภาพขนาดเต็ม</p>
</div> </div>
<div class="grid grid-cols-2 md:grid-cols-3 lg:grid-cols-4 gap-4"> <div class="grid grid-cols-2 md:grid-cols-3 lg:grid-cols-4 gap-4">
<a href="/images/microfiber/gallery-1.jpg" target="_blank" rel="noopener" class="group block overflow-hidden rounded-xl shadow-md hover:shadow-xl transition-shadow"> <a href="/images/microfiber/gallery-1.jpg" target="_blank" rel="noopener" data-umami-event="product-gallery-1" class="group block overflow-hidden rounded-xl shadow-md hover:shadow-xl transition-shadow">
<img src="/images/microfiber/gallery-1.jpg" alt="Microfiber ภาพที่ 1" class="w-full h-48 object-cover group-hover:scale-105 transition-transform duration-300" loading="lazy" /> <img src="/images/microfiber/gallery-1.jpg" alt="Microfiber ภาพที่ 1" class="w-full h-48 object-cover group-hover:scale-105 transition-transform duration-300" loading="lazy" />
</a> </a>
<a href="/images/microfiber/gallery-2.jpg" target="_blank" rel="noopener" class="group block overflow-hidden rounded-xl shadow-md hover:shadow-xl transition-shadow"> <a href="/images/microfiber/gallery-2.jpg" target="_blank" rel="noopener" data-umami-event="product-gallery-2" class="group block overflow-hidden rounded-xl shadow-md hover:shadow-xl transition-shadow">
<img src="/images/microfiber/gallery-2.jpg" alt="Microfiber ภาพที่ 2" class="w-full h-48 object-cover group-hover:scale-105 transition-transform duration-300" loading="lazy" /> <img src="/images/microfiber/gallery-2.jpg" alt="Microfiber ภาพที่ 2" class="w-full h-48 object-cover group-hover:scale-105 transition-transform duration-300" loading="lazy" />
</a> </a>
<a href="/images/microfiber/gallery-3.jpg" target="_blank" rel="noopener" class="group block overflow-hidden rounded-xl shadow-md hover:shadow-xl transition-shadow"> <a href="/images/microfiber/gallery-3.jpg" target="_blank" rel="noopener" data-umami-event="product-gallery-3" class="group block overflow-hidden rounded-xl shadow-md hover:shadow-xl transition-shadow">
<img src="/images/microfiber/gallery-3.jpg" alt="Microfiber ภาพที่ 3" class="w-full h-48 object-cover group-hover:scale-105 transition-transform duration-300" loading="lazy" /> <img src="/images/microfiber/gallery-3.jpg" alt="Microfiber ภาพที่ 3" class="w-full h-48 object-cover group-hover:scale-105 transition-transform duration-300" loading="lazy" />
</a> </a>
<a href="/images/microfiber/gallery-4.jpg" target="_blank" rel="noopener" class="group block overflow-hidden rounded-xl shadow-md hover:shadow-xl transition-shadow"> <a href="/images/microfiber/gallery-4.jpg" target="_blank" rel="noopener" data-umami-event="product-gallery-4" class="group block overflow-hidden rounded-xl shadow-md hover:shadow-xl transition-shadow">
<img src="/images/microfiber/gallery-4.jpg" alt="Microfiber ภาพที่ 4" class="w-full h-48 object-cover group-hover:scale-105 transition-transform duration-300" loading="lazy" /> <img src="/images/microfiber/gallery-4.jpg" alt="Microfiber ภาพที่ 4" class="w-full h-48 object-cover group-hover:scale-105 transition-transform duration-300" loading="lazy" />
</a> </a>
<a href="/images/microfiber/gallery-5.jpg" target="_blank" rel="noopener" class="group block overflow-hidden rounded-xl shadow-md hover:shadow-xl transition-shadow"> <a href="/images/microfiber/gallery-5.jpg" target="_blank" rel="noopener" data-umami-event="product-gallery-5" class="group block overflow-hidden rounded-xl shadow-md hover:shadow-xl transition-shadow">
<img src="/images/microfiber/gallery-5.jpg" alt="Microfiber ภาพที่ 5" class="w-full h-48 object-cover group-hover:scale-105 transition-transform duration-300" loading="lazy" /> <img src="/images/microfiber/gallery-5.jpg" alt="Microfiber ภาพที่ 5" class="w-full h-48 object-cover group-hover:scale-105 transition-transform duration-300" loading="lazy" />
</a> </a>
<a href="/images/microfiber/gallery-6.jpg" target="_blank" rel="noopener" class="group block overflow-hidden rounded-xl shadow-md hover:shadow-xl transition-shadow"> <a href="/images/microfiber/gallery-6.jpg" target="_blank" rel="noopener" data-umami-event="product-gallery-6" class="group block overflow-hidden rounded-xl shadow-md hover:shadow-xl transition-shadow">
<img src="/images/microfiber/gallery-6.jpg" alt="Microfiber ภาพที่ 6" class="w-full h-48 object-cover group-hover:scale-105 transition-transform duration-300" loading="lazy" /> <img src="/images/microfiber/gallery-6.jpg" alt="Microfiber ภาพที่ 6" class="w-full h-48 object-cover group-hover:scale-105 transition-transform duration-300" loading="lazy" />
</a> </a>
<a href="/images/microfiber/gallery-7.jpg" target="_blank" rel="noopener" class="group block overflow-hidden rounded-xl shadow-md hover:shadow-xl transition-shadow"> <a href="/images/microfiber/gallery-7.jpg" target="_blank" rel="noopener" data-umami-event="product-gallery-7" class="group block overflow-hidden rounded-xl shadow-md hover:shadow-xl transition-shadow">
<img src="/images/microfiber/gallery-7.jpg" alt="Microfiber ภาพที่ 7" class="w-full h-48 object-cover group-hover:scale-105 transition-transform duration-300" loading="lazy" /> <img src="/images/microfiber/gallery-7.jpg" alt="Microfiber ภาพที่ 7" class="w-full h-48 object-cover group-hover:scale-105 transition-transform duration-300" loading="lazy" />
</a> </a>
<a href="/images/microfiber/gallery-8.jpg" target="_blank" rel="noopener" class="group block overflow-hidden rounded-xl shadow-md hover:shadow-xl transition-shadow"> <a href="/images/microfiber/gallery-8.jpg" target="_blank" rel="noopener" data-umami-event="product-gallery-8" class="group block overflow-hidden rounded-xl shadow-md hover:shadow-xl transition-shadow">
<img src="/images/microfiber/gallery-8.jpg" alt="Microfiber ภาพที่ 8" class="w-full h-48 object-cover group-hover:scale-105 transition-transform duration-300" loading="lazy" /> <img src="/images/microfiber/gallery-8.jpg" alt="Microfiber ภาพที่ 8" class="w-full h-48 object-cover group-hover:scale-105 transition-transform duration-300" loading="lazy" />
</a> </a>
<a href="/images/microfiber/gallery-10.jpg" target="_blank" rel="noopener" class="group block overflow-hidden rounded-xl shadow-md hover:shadow-xl transition-shadow"> <a href="/images/microfiber/gallery-10.jpg" target="_blank" rel="noopener" data-umami-event="product-gallery-10" class="group block overflow-hidden rounded-xl shadow-md hover:shadow-xl transition-shadow">
<img src="/images/microfiber/gallery-10.jpg" alt="Microfiber ภาพที่ 10" class="w-full h-48 object-cover group-hover:scale-105 transition-transform duration-300" loading="lazy" /> <img src="/images/microfiber/gallery-10.jpg" alt="Microfiber ภาพที่ 10" class="w-full h-48 object-cover group-hover:scale-105 transition-transform duration-300" loading="lazy" />
</a> </a>
</div> </div>
@@ -312,8 +312,8 @@ const description = "MICROFIBER ผู้ผลิตฉนวนใยแก้
<h2 class="text-3xl font-bold mb-6">สนใจสินค้านี้?</h2> <h2 class="text-3xl font-bold mb-6">สนใจสินค้านี้?</h2>
<p class="text-lg text-primary-100 mb-8">ติดต่อเราวันนี้ 090-555-1415 หรือแอดไลน์ ID:JPPSELECTION</p> <p class="text-lg text-primary-100 mb-8">ติดต่อเราวันนี้ 090-555-1415 หรือแอดไลน์ ID:JPPSELECTION</p>
<div class="flex flex-wrap justify-center gap-4"> <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="/contact-us" data-umami-event="product-cta-contact" 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> <a href="https://line.me/ti/p/~JPPSELECTION" target="_blank" rel="noopener" data-umami-event="product-cta-line" class="bg-accent-500 hover:bg-accent-600 text-white py-3 px-8 rounded-xl font-semibold transition-colors">แอดไลน์</a>
</div> </div>
</div> </div>
</section> </section>

View File

@@ -41,11 +41,11 @@ import BaseLayout from '@/layouts/BaseLayout.astro';
แคลมป์รัดท่อ RNT SMART CLAMP จากผู้ผลิตไทย ไม่ต้องเชื่อม ใช้ได้ทุกสภาพผิว ติดตั้งง่าย รวดเร็ว ทนแรงดันสูง เหมาะกับการซ่อมท่อรั่ว ต่อท่อ และงานอุตสาหกรรมทุกประเภท แคลมป์รัดท่อ RNT SMART CLAMP จากผู้ผลิตไทย ไม่ต้องเชื่อม ใช้ได้ทุกสภาพผิว ติดตั้งง่าย รวดเร็ว ทนแรงดันสูง เหมาะกับการซ่อมท่อรั่ว ต่อท่อ และงานอุตสาหกรรมทุกประเภท
</p> </p>
<div class="flex flex-wrap justify-center gap-4 mb-8 lg:justify-start"> <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"> <a href="https://line.me/ti/p/~JPPSELECTION" target="_blank" rel="noopener" data-umami-event="product-hero-line" 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> <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 แชท Line
</a> </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"> <a href="tel:0905551415" data-umami-event="product-hero-call" 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"> <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" /> <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> </svg>
@@ -248,8 +248,8 @@ import BaseLayout from '@/layouts/BaseLayout.astro';
<h2 class="text-3xl font-bold mb-6">สนใจ RNT Smart Clamp?</h2> <h2 class="text-3xl font-bold mb-6">สนใจ RNT Smart Clamp?</h2>
<p class="text-lg text-primary-100 mb-8">ติดต่อเราวันนี้ 090-555-1415 หรือแอดไลน์ ID:JPPSELECTION</p> <p class="text-lg text-primary-100 mb-8">ติดต่อเราวันนี้ 090-555-1415 หรือแอดไลน์ ID:JPPSELECTION</p>
<div class="flex flex-wrap justify-center gap-4"> <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="/contact-us" data-umami-event="product-cta-contact" 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> <a href="https://line.me/ti/p/~JPPSELECTION" target="_blank" rel="noopener" data-umami-event="product-cta-line" class="bg-accent-500 hover:bg-accent-600 text-white py-3 px-8 rounded-xl font-semibold transition-colors">แอดไลน์</a>
</div> </div>
</div> </div>
</section> </section>

View File

@@ -168,8 +168,8 @@ import BaseLayout from '@/layouts/BaseLayout.astro';
<h2 class="text-3xl font-bold mb-6">ต้องการให้เราดูแลโครงการของคุณ?</h2> <h2 class="text-3xl font-bold mb-6">ต้องการให้เราดูแลโครงการของคุณ?</h2>
<p class="text-lg text-primary-100 mb-8">ติดต่อเราวันนี้ 090-555-1415 หรือแอดไลน์ ID:JPPSELECTION</p> <p class="text-lg text-primary-100 mb-8">ติดต่อเราวันนี้ 090-555-1415 หรือแอดไลน์ ID:JPPSELECTION</p>
<div class="flex flex-wrap justify-center gap-4"> <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="/contact-us" data-umami-event="portfolio-cta-contact" 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> <a href="https://line.me/ti/p/~JPPSELECTION" data-umami-event="portfolio-cta-line" 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>
</div> </div>
</section> </section>

View File

@@ -2,9 +2,7 @@
import BaseLayout from '@/layouts/BaseLayout.astro'; import BaseLayout from '@/layouts/BaseLayout.astro';
import { marked } from 'marked'; import { marked } from 'marked';
const privacyContent = `# นโยบายความเป็นส่วนตัว const privacyContent = `**บริษัท ดีล พลัส เทค จำกัด** ("บริษัทฯ") ให้ความสำคัญกับการคุ้มครองข้อมูลส่วนบุคคลของท่าน จึงได้จัดทำนโยบายความเป็นส่วนตัวฉบับนี้ขึ้นเพื่อชี้แจงเกี่ยวกับการเก็บรวบรวม ใช้ หรือเปิดเผยข้อมูลส่วนบุคคล รวมถึงสิทธิต่างๆ ของท่านตามพระราชบัญญัติคุ้มครองข้อมูลส่วนบุคคล พ.ศ. 2562
**บริษัท ดีล พลัส เทค จำกัด** ("บริษัทฯ") ให้ความสำคัญกับการคุ้มครองข้อมูลส่วนบุคคลของท่าน จึงได้จัดทำนโยบายความเป็นส่วนตัวฉบับนี้ขึ้นเพื่อชี้แจงเกี่ยวกับการเก็บรวบรวม ใช้ หรือเปิดเผยข้อมูลส่วนบุคคล รวมถึงสิทธิต่างๆ ของท่านตามพระราชบัญญัติคุ้มครองข้อมูลส่วนบุคคล พ.ศ. 2562
## 1. ข้อมูลส่วนบุคคลที่เราเก็บรวบรวม ## 1. ข้อมูลส่วนบุคคลที่เราเก็บรวบรวม

View File

@@ -68,11 +68,11 @@ import BaseLayout from '@/layouts/BaseLayout.astro';
</div> </div>
</div> </div>
<div class="flex flex-wrap justify-center gap-4 mb-8 lg:justify-start"> <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"> <a href="https://line.me/ti/p/~JPPSELECTION" target="_blank" rel="noopener" data-umami-event="product-hero-line" 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> <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 แชท Line
</a> </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"> <a href="tel:0905551415" data-umami-event="product-hero-call" 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"> <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" /> <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> </svg>
@@ -204,8 +204,8 @@ import BaseLayout from '@/layouts/BaseLayout.astro';
<h2 class="text-3xl font-bold mb-6">สนใจสินค้านี้?</h2> <h2 class="text-3xl font-bold mb-6">สนใจสินค้านี้?</h2>
<p class="text-lg text-primary-100 mb-8">ติดต่อเราวันนี้ 090-555-1415 หรือแอดไลน์ ID:JPPSELECTION</p> <p class="text-lg text-primary-100 mb-8">ติดต่อเราวันนี้ 090-555-1415 หรือแอดไลน์ ID:JPPSELECTION</p>
<div class="flex flex-wrap justify-center gap-4"> <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="/contact-us" data-umami-event="product-cta-contact" 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> <a href="https://line.me/ti/p/~JPPSELECTION" target="_blank" rel="noopener" data-umami-event="product-cta-line" class="bg-accent-500 hover:bg-accent-600 text-white py-3 px-8 rounded-xl font-semibold transition-colors">แอดไลน์</a>
</div> </div>
</div> </div>
</section> </main> </section> </main>

View File

@@ -36,11 +36,11 @@ const description = "ROCKWOOL ฉนวนใยหินคุณภาพส
ROCKWOOL ฉนวนใยหินคุณภาพสูงจากประเทศเดนมาร์ก ผู้นำด้านนวัตกรรมฉนวนใยหิน (Stone Wool) ครบวงจร ทนไฟสูงสุด 1,000°C เหมาะสำหรับงานระบบปรับอากาศ งานอุตสาหกรรม งานหลังคา งานกันไฟและกันเสียง ROCKWOOL ฉนวนใยหินคุณภาพสูงจากประเทศเดนมาร์ก ผู้นำด้านนวัตกรรมฉนวนใยหิน (Stone Wool) ครบวงจร ทนไฟสูงสุด 1,000°C เหมาะสำหรับงานระบบปรับอากาศ งานอุตสาหกรรม งานหลังคา งานกันไฟและกันเสียง
</p> </p>
<div class="flex flex-wrap justify-center gap-4 mb-8 lg:justify-start"> <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"> <a href="https://line.me/ti/p/~JPPSELECTION" target="_blank" rel="noopener" data-umami-event="product-hero-line" 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> <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 แชท Line
</a> </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"> <a href="tel:0905551415" data-umami-event="product-hero-call" 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"> <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" /> <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> </svg>
@@ -241,34 +241,34 @@ const description = "ROCKWOOL ฉนวนใยหินคุณภาพส
<p class="text-neutral-600">ภาพสินค้าจริงจากงานติดตั้ง — คลิกเพื่อดูภาพขนาดเต็ม</p> <p class="text-neutral-600">ภาพสินค้าจริงจากงานติดตั้ง — คลิกเพื่อดูภาพขนาดเต็ม</p>
</div> </div>
<div class="grid grid-cols-2 md:grid-cols-3 lg:grid-cols-4 gap-4"> <div class="grid grid-cols-2 md:grid-cols-3 lg:grid-cols-4 gap-4">
<a href="/images/rockwool/gallery-1.jpg" target="_blank" rel="noopener" class="group block overflow-hidden rounded-xl shadow-md hover:shadow-xl transition-shadow"> <a href="/images/rockwool/gallery-1.jpg" target="_blank" rel="noopener" data-umami-event="product-gallery-1" class="group block overflow-hidden rounded-xl shadow-md hover:shadow-xl transition-shadow">
<img src="/images/rockwool/gallery-1.jpg" alt="Rockwool ภาพที่ 1" class="w-full h-48 object-cover group-hover:scale-105 transition-transform duration-300" loading="lazy" /> <img src="/images/rockwool/gallery-1.jpg" alt="Rockwool ภาพที่ 1" class="w-full h-48 object-cover group-hover:scale-105 transition-transform duration-300" loading="lazy" />
</a> </a>
<a href="/images/rockwool/gallery-2.jpg" target="_blank" rel="noopener" class="group block overflow-hidden rounded-xl shadow-md hover:shadow-xl transition-shadow"> <a href="/images/rockwool/gallery-2.jpg" target="_blank" rel="noopener" data-umami-event="product-gallery-2" class="group block overflow-hidden rounded-xl shadow-md hover:shadow-xl transition-shadow">
<img src="/images/rockwool/gallery-2.jpg" alt="Rockwool ภาพที่ 2" class="w-full h-48 object-cover group-hover:scale-105 transition-transform duration-300" loading="lazy" /> <img src="/images/rockwool/gallery-2.jpg" alt="Rockwool ภาพที่ 2" class="w-full h-48 object-cover group-hover:scale-105 transition-transform duration-300" loading="lazy" />
</a> </a>
<a href="/images/rockwool/gallery-3.jpg" target="_blank" rel="noopener" class="group block overflow-hidden rounded-xl shadow-md hover:shadow-xl transition-shadow"> <a href="/images/rockwool/gallery-3.jpg" target="_blank" rel="noopener" data-umami-event="product-gallery-3" class="group block overflow-hidden rounded-xl shadow-md hover:shadow-xl transition-shadow">
<img src="/images/rockwool/gallery-3.jpg" alt="Rockwool ภาพที่ 3" class="w-full h-48 object-cover group-hover:scale-105 transition-transform duration-300" loading="lazy" /> <img src="/images/rockwool/gallery-3.jpg" alt="Rockwool ภาพที่ 3" class="w-full h-48 object-cover group-hover:scale-105 transition-transform duration-300" loading="lazy" />
</a> </a>
<a href="/images/rockwool/gallery-4.jpg" target="_blank" rel="noopener" class="group block overflow-hidden rounded-xl shadow-md hover:shadow-xl transition-shadow"> <a href="/images/rockwool/gallery-4.jpg" target="_blank" rel="noopener" data-umami-event="product-gallery-4" class="group block overflow-hidden rounded-xl shadow-md hover:shadow-xl transition-shadow">
<img src="/images/rockwool/gallery-4.jpg" alt="Rockwool ภาพที่ 4" class="w-full h-48 object-cover group-hover:scale-105 transition-transform duration-300" loading="lazy" /> <img src="/images/rockwool/gallery-4.jpg" alt="Rockwool ภาพที่ 4" class="w-full h-48 object-cover group-hover:scale-105 transition-transform duration-300" loading="lazy" />
</a> </a>
<a href="/images/rockwool/gallery-5.jpg" target="_blank" rel="noopener" class="group block overflow-hidden rounded-xl shadow-md hover:shadow-xl transition-shadow"> <a href="/images/rockwool/gallery-5.jpg" target="_blank" rel="noopener" data-umami-event="product-gallery-5" class="group block overflow-hidden rounded-xl shadow-md hover:shadow-xl transition-shadow">
<img src="/images/rockwool/gallery-5.jpg" alt="Rockwool ภาพที่ 5" class="w-full h-48 object-cover group-hover:scale-105 transition-transform duration-300" loading="lazy" /> <img src="/images/rockwool/gallery-5.jpg" alt="Rockwool ภาพที่ 5" class="w-full h-48 object-cover group-hover:scale-105 transition-transform duration-300" loading="lazy" />
</a> </a>
<a href="/images/rockwool/gallery-6.jpg" target="_blank" rel="noopener" class="group block overflow-hidden rounded-xl shadow-md hover:shadow-xl transition-shadow"> <a href="/images/rockwool/gallery-6.jpg" target="_blank" rel="noopener" data-umami-event="product-gallery-6" class="group block overflow-hidden rounded-xl shadow-md hover:shadow-xl transition-shadow">
<img src="/images/rockwool/gallery-6.jpg" alt="Rockwool ภาพที่ 6" class="w-full h-48 object-cover group-hover:scale-105 transition-transform duration-300" loading="lazy" /> <img src="/images/rockwool/gallery-6.jpg" alt="Rockwool ภาพที่ 6" class="w-full h-48 object-cover group-hover:scale-105 transition-transform duration-300" loading="lazy" />
</a> </a>
<a href="/images/rockwool/gallery-7.jpg" target="_blank" rel="noopener" class="group block overflow-hidden rounded-xl shadow-md hover:shadow-xl transition-shadow"> <a href="/images/rockwool/gallery-7.jpg" target="_blank" rel="noopener" data-umami-event="product-gallery-7" class="group block overflow-hidden rounded-xl shadow-md hover:shadow-xl transition-shadow">
<img src="/images/rockwool/gallery-7.jpg" alt="Rockwool ภาพที่ 7" class="w-full h-48 object-cover group-hover:scale-105 transition-transform duration-300" loading="lazy" /> <img src="/images/rockwool/gallery-7.jpg" alt="Rockwool ภาพที่ 7" class="w-full h-48 object-cover group-hover:scale-105 transition-transform duration-300" loading="lazy" />
</a> </a>
<a href="/images/rockwool/gallery-9.jpg" target="_blank" rel="noopener" class="group block overflow-hidden rounded-xl shadow-md hover:shadow-xl transition-shadow"> <a href="/images/rockwool/gallery-9.jpg" target="_blank" rel="noopener" data-umami-event="product-gallery-9" class="group block overflow-hidden rounded-xl shadow-md hover:shadow-xl transition-shadow">
<img src="/images/rockwool/gallery-9.jpg" alt="Rockwool ภาพที่ 9" class="w-full h-48 object-cover group-hover:scale-105 transition-transform duration-300" loading="lazy" /> <img src="/images/rockwool/gallery-9.jpg" alt="Rockwool ภาพที่ 9" class="w-full h-48 object-cover group-hover:scale-105 transition-transform duration-300" loading="lazy" />
</a> </a>
<a href="/images/rockwool/gallery-10.jpg" target="_blank" rel="noopener" class="group block overflow-hidden rounded-xl shadow-md hover:shadow-xl transition-shadow"> <a href="/images/rockwool/gallery-10.jpg" target="_blank" rel="noopener" data-umami-event="product-gallery-10" class="group block overflow-hidden rounded-xl shadow-md hover:shadow-xl transition-shadow">
<img src="/images/rockwool/gallery-10.jpg" alt="Rockwool ภาพที่ 10" class="w-full h-48 object-cover group-hover:scale-105 transition-transform duration-300" loading="lazy" /> <img src="/images/rockwool/gallery-10.jpg" alt="Rockwool ภาพที่ 10" class="w-full h-48 object-cover group-hover:scale-105 transition-transform duration-300" loading="lazy" />
</a> </a>
<a href="/images/rockwool/gallery-11.jpg" target="_blank" rel="noopener" class="group block overflow-hidden rounded-xl shadow-md hover:shadow-xl transition-shadow"> <a href="/images/rockwool/gallery-11.jpg" target="_blank" rel="noopener" data-umami-event="product-gallery-11" class="group block overflow-hidden rounded-xl shadow-md hover:shadow-xl transition-shadow">
<img src="/images/rockwool/gallery-11.jpg" alt="Rockwool ภาพที่ 11" class="w-full h-48 object-cover group-hover:scale-105 transition-transform duration-300" loading="lazy" /> <img src="/images/rockwool/gallery-11.jpg" alt="Rockwool ภาพที่ 11" class="w-full h-48 object-cover group-hover:scale-105 transition-transform duration-300" loading="lazy" />
</a> </a>
</div> </div>
@@ -280,8 +280,8 @@ const description = "ROCKWOOL ฉนวนใยหินคุณภาพส
<h2 class="text-3xl font-bold mb-6">สนใจสินค้านี้?</h2> <h2 class="text-3xl font-bold mb-6">สนใจสินค้านี้?</h2>
<p class="text-lg text-primary-100 mb-8">ติดต่อเราวันนี้ 090-555-1415 หรือแอดไลน์ ID:JPPSELECTION</p> <p class="text-lg text-primary-100 mb-8">ติดต่อเราวันนี้ 090-555-1415 หรือแอดไลน์ ID:JPPSELECTION</p>
<div class="flex flex-wrap justify-center gap-4"> <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="/contact-us" data-umami-event="product-cta-contact" 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> <a href="https://line.me/ti/p/~JPPSELECTION" target="_blank" rel="noopener" data-umami-event="product-cta-line" class="bg-accent-500 hover:bg-accent-600 text-white py-3 px-8 rounded-xl font-semibold transition-colors">แอดไลน์</a>
</div> </div>
</div> </div>
</section> </section>

View File

@@ -36,11 +36,11 @@ const description = "ฉนวนกันความร้อน SCG จาก
ฉนวนกันความร้อน SCG จากเครือซิเมนต์ไทย ผลิตภัณฑ์คุณภาพสูง มาตรฐานระดับโลกสำหรับงานอาคาร งานหลังคา และงานอุตสาหกรรมครบวงจร ฉนวนกันความร้อน SCG จากเครือซิเมนต์ไทย ผลิตภัณฑ์คุณภาพสูง มาตรฐานระดับโลกสำหรับงานอาคาร งานหลังคา และงานอุตสาหกรรมครบวงจร
</p> </p>
<div class="flex flex-wrap justify-center gap-4 mb-8 lg:justify-start"> <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"> <a href="https://line.me/ti/p/~JPPSELECTION" target="_blank" rel="noopener" data-umami-event="product-hero-line" 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> <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 แชท Line
</a> </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"> <a href="tel:0905551415" data-umami-event="product-hero-call" 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"> <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" /> <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> </svg>
@@ -295,8 +295,8 @@ const description = "ฉนวนกันความร้อน SCG จาก
<h2 class="text-3xl font-bold mb-6">สนใจสินค้านี้?</h2> <h2 class="text-3xl font-bold mb-6">สนใจสินค้านี้?</h2>
<p class="text-lg text-primary-100 mb-8">ติดต่อเราวันนี้ 090-555-1415 หรือแอดไลน์ ID:JPPSELECTION</p> <p class="text-lg text-primary-100 mb-8">ติดต่อเราวันนี้ 090-555-1415 หรือแอดไลน์ ID:JPPSELECTION</p>
<div class="flex flex-wrap justify-center gap-4"> <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="/contact-us" data-umami-event="product-cta-contact" 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> <a href="https://line.me/ti/p/~JPPSELECTION" target="_blank" rel="noopener" data-umami-event="product-cta-line" class="bg-accent-500 hover:bg-accent-600 text-white py-3 px-8 rounded-xl font-semibold transition-colors">แอดไลน์</a>
</div> </div>
</div> </div>
</section> </section>

View File

@@ -2,9 +2,7 @@
import BaseLayout from '@/layouts/BaseLayout.astro'; import BaseLayout from '@/layouts/BaseLayout.astro';
import { marked } from 'marked'; import { marked } from 'marked';
const termsContent = `# ข้อกำหนดการใช้งาน const termsContent = `**ชื่อเว็บไซต์:** ดีล พลัส เทค
**ชื่อเว็บไซต์:** ดีล พลัส เทค
**เว็บไซต์:** https://dealplustech.co.th **เว็บไซต์:** https://dealplustech.co.th
**มีผลบังคับใช้วันที่:** 6 พฤษภาคม 2569 **มีผลบังคับใช้วันที่:** 6 พฤษภาคม 2569
**แก้ไขล่าสุด:** 6 พฤษภาคม 2569 **แก้ไขล่าสุด:** 6 พฤษภาคม 2569

View File

@@ -68,11 +68,11 @@ import BaseLayout from '@/layouts/BaseLayout.astro';
</div> </div>
</div> </div>
<div class="flex flex-wrap justify-center gap-4 mb-8 lg:justify-start"> <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"> <a href="https://line.me/ti/p/~JPPSELECTION" data-umami-event="product-hero-line" 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> <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 แชท Line
</a> </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"> <a href="tel:0905551415" data-umami-event="product-hero-call" 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"> <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" /> <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> </svg>
@@ -329,8 +329,8 @@ import BaseLayout from '@/layouts/BaseLayout.astro';
<h2 class="text-3xl font-bold mb-6">สนใจสินค้านี้?</h2> <h2 class="text-3xl font-bold mb-6">สนใจสินค้านี้?</h2>
<p class="text-lg text-primary-100 mb-8">ติดต่อเราวันนี้ 090-555-1415 หรือแอดไลน์ ID:JPPSELECTION</p> <p class="text-lg text-primary-100 mb-8">ติดต่อเราวันนี้ 090-555-1415 หรือแอดไลน์ ID:JPPSELECTION</p>
<div class="flex flex-wrap justify-center gap-4"> <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="/contact-us" data-umami-event="product-cta-contact" 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> <a href="https://line.me/ti/p/~JPPSELECTION" data-umami-event="product-cta-line" 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>
</div> </div>
</section> </main> </section> </main>

View File

@@ -68,11 +68,11 @@ import BaseLayout from '@/layouts/BaseLayout.astro';
</div> </div>
</div> </div>
<div class="flex flex-wrap justify-center gap-4 mb-8 lg:justify-start"> <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"> <a href="https://line.me/ti/p/~JPPSELECTION" data-umami-event="product-hero-line" 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> <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 แชท Line
</a> </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"> <a href="tel:0905551415" data-umami-event="product-hero-call" 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"> <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" /> <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> </svg>
@@ -203,8 +203,8 @@ import BaseLayout from '@/layouts/BaseLayout.astro';
<h2 class="text-3xl font-bold mb-6">สนใจสินค้านี้?</h2> <h2 class="text-3xl font-bold mb-6">สนใจสินค้านี้?</h2>
<p class="text-lg text-primary-100 mb-8">ติดต่อเราวันนี้ 090-555-1415 หรือแอดไลน์ ID:JPPSELECTION</p> <p class="text-lg text-primary-100 mb-8">ติดต่อเราวันนี้ 090-555-1415 หรือแอดไลน์ ID:JPPSELECTION</p>
<div class="flex flex-wrap justify-center gap-4"> <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="/contact-us" data-umami-event="product-cta-contact" 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> <a href="https://line.me/ti/p/~JPPSELECTION" data-umami-event="product-cta-line" 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>
</div> </div>
</section> </main> </section> </main>

View File

@@ -0,0 +1,589 @@
---
import BaseLayout from '@/layouts/BaseLayout.astro';
---
<BaseLayout
title="CcooL ฉนวนซีคูล XPE เคลือบฟอยล์ | ราคาโรงงาน ดีล พลัส เทค"
description="CcooL ฉนวนซีคูล XPE โครงสร้างเซลล์ปิด 100% เคลือบอลูมิเนียมฟอยล์ 32 ไมครอน K-value 0.024 W/mK มีทั้งแบบมีกาวและไม่มีกาว ขอราคาและคำแนะนำได้ฟรี"
product={{
name: 'CcooL ฉนวนซีคูล ฉนวนหุ้มท่อ XPE เคลือบอลูมิเนียมฟอยล์',
image: '/images/ccool/ccool-application-hvac.jpg',
brand: 'CcooL (ซีคูล)',
description: 'ฉนวนหุ้มท่อโครงสร้างเซลล์ปิด 100% (PE Cross-linked / XPE) เคลือบอลูมิเนียมฟอยล์ 32 ไมครอน ค่าการนำความร้อนต่ำเพียง 0.024 W/mK ป้องกันหยดน้ำ อายุการใช้งานยาวนานกว่า 20 ปี',
}}
faq={[
{ question: 'ฉนวน CcooL ต่างจากฉนวนยางดำทั่วไปอย่างไร?', answer: 'CcooL เป็นฉนวนโฟม PE Cross-linked (XPE) เซลล์ปิด 100% เคลือบอลูมิเนียมฟอยล์หนา 32 ไมครอน มีค่าการนำความร้อนต่ำเพียง 0.024 W/mK ไม่ยุบตัว ไม่ดูดซึมน้ำ ผ่านมาตรฐานไฟ Class 0 และทนรังสี UV โดยไม่เปลี่ยนสีหรือแตกร้าว อายุการใช้งานยาวนานกว่า 20 ปี' },
{ question: 'CcooL ใช้กับท่อแบบไหนได้บ้าง?', answer: 'ได้ทั้งท่อน้ำเย็น (Chilled Water) ท่อน้ำยาแอร์ (Refrigerant) ท่อน้ำทิ้ง (Condensate) ท่อเหล็ก ท่อทองแดง ท่อ PPR ท่อ PVC ท่อสไปรัล รวมถึงงานท่อลม หลังคา ผนัง และพื้น ตามมาตรฐานความหนาที่แนะนำของ ว.ส.ท.' },
{ question: 'ฉนวน CcooL มีแบบมีกาวในตัวไหม?', answer: 'มีครับ รุ่น AXPE-S (AXS5 ถึง AXS50) เป็นแบบมีกาวในตัว 1 ด้าน ช่วยติดตั้งได้รวดเร็ว ประหยัดเวลาและค่าจ้างแรงงาน เหมาะกับงานที่ต้องการความรวดเร็ว' },
{ question: 'สีฟอยล์จะเปลี่ยนหรือแตกร้าวเมื่อใช้งานกลางแจ้งไหม?', answer: 'ไม่ครับ ผ่านการทดสอบ ASTM G154-23 แล้ว สีฟอยล์ไม่เปลี่ยน ไม่แตกร้าว ไม่ร่วนเป็นขุยผง ไม่พองบวม จึงใช้ได้ทั้งภายในและภายนอกอาคาร อายุการใช้งานยาวนานกว่า 20 ปี' },
]}
>
<main class="bg-white min-h-screen">
<!-- ===================== HERO ===================== -->
<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>
</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">CcooL ฉนวนซีคูล</h1>
<p class="text-lg text-primary-100 mb-8 leading-relaxed">
ฉนวนอลูมิเนียมฟอยล์แบบแผ่น <strong>CcooL</strong> ช่วยป้องกันความร้อนและสะท้อนรังสี UV ได้อย่างมีประสิทธิภาพ ผลิตจากอลูมิเนียมฟอยล์คุณภาพสูงหนา 32 ไมครอน เสริมด้วยโฟมเซลล์ปิด PE Cross-linked (XPE) ด้วยค่าการนำความร้อนต่ำเพียง 0.024 W/mK เหมาะกับหลังคา ผนัง บ้าน อาคาร โรงงาน และรถยนต์ ลดอุณหภูมิภายใน เพิ่มความเย็น และประหยัดพลังงานได้จริง ยืดอายุการใช้งานยาวนานกว่า 20 ปี
</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>สะท้อนความร้อน/UV 95%</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>เซลล์ปิด 100% กันน้ำ</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>K-value 0.024 W/mK</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" data-umami-event="product-hero-line" 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" data-umami-event="product-hero-call" 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>
<a href="#pricelist" data-umami-event="product-hero-price" data-price-button class="hidden 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="M9 12h6m-6 4h6m2 5H7a2 2 0 01-2-2V5a2 2 0 012-2h5.586a1 1 0 01.707.293l5.414 5.414a1 1 0 01.293.707V19a2 2 0 01-2 2z" /></svg>
<span>ราคาสินค้า</span>
</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/ccool/ccool-roll-product.jpg" alt="CcooL ฉนวนหุ้มท่อ XPE เคลือบอลูมิเนียมฟอยล์" class="w-full aspect-[4/3] object-cover rounded-lg" loading="eager" />
</div>
</div>
</div>
</div>
</section>
<!-- ===================== WHY CHOOSE CcooL ===================== -->
<section class="py-16 lg:py-24 bg-white">
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
<div class="text-center mb-12">
<h2 class="text-2xl sm:text-3xl font-bold text-slate-900 mb-3">ทำไมต้องเลือกฉนวน CcooL?</h2>
<p class="text-lg text-neutral-600 max-w-3xl mx-auto">จุดเด่นเชิงเทคนิคที่สถาปนิก ผู้รับเหมา และเจ้าของโครงการวางใจได้</p>
</div>
<div class="grid md:grid-cols-2 lg:grid-cols-3 gap-4">
<!-- 1 -->
<div class="bg-primary-50 rounded-xl p-5 border border-primary-100 flex items-start gap-3">
<svg class="w-6 h-6 text-primary-600 flex-shrink-0 mt-0.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>
<div>
<h3 class="font-semibold text-slate-900 mb-1">อลูมิเนียมฟอยล์สะท้อนความร้อน/UV 95%</h3>
<p class="text-sm text-slate-700">ฟอยล์คุณภาพสูงหนา 32 ไมครอน สะท้อนความร้อนและรังสี UV ได้มากถึง 95%</p>
</div>
</div>
<!-- 2 -->
<div class="bg-emerald-50 rounded-xl p-5 border border-emerald-100 flex items-start gap-3">
<svg class="w-6 h-6 text-emerald-600 flex-shrink-0 mt-0.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>
<div>
<h3 class="font-semibold text-slate-900 mb-1">โฟมเซลล์ปิด PE/XPE ทนทาน</h3>
<p class="text-sm text-slate-700">เจาะโครงสร้าง cell ปิด 100% กันน้ำและไอน้ำ ไม่ยุบตัว เสียรูปยาก</p>
</div>
</div>
<!-- 3 -->
<div class="bg-amber-50 rounded-xl p-5 border border-amber-100 flex items-start gap-3">
<svg class="w-6 h-6 text-amber-600 flex-shrink-0 mt-0.5" 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="font-semibold text-slate-900 mb-1">ลดอุณหภูมิ ประหยัดพลังงานจริง</h3>
<p class="text-sm text-slate-700">K-value ต่ำเพียง 0.024 W/mK ช่วยลดความร้อนและค่าไฟในบ้าน/อาคารอย่างเห็นผล</p>
</div>
</div>
<!-- 4 -->
<div class="bg-sky-50 rounded-xl p-5 border border-sky-100 flex items-start gap-3">
<svg class="w-6 h-6 text-sky-600 flex-shrink-0 mt-0.5" 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="font-semibold text-slate-900 mb-1">ติดตั้งง่าย น้ำหนักเบา</h3>
<p class="text-sm text-slate-700">ตัดได้ด้วยคัตเตอร์ทั่วไป ยึดติดง่ายด้วยสกรู/แหวนรอง พร้อมตัวเลือกแบบมีกาว</p>
</div>
</div>
<!-- 5 -->
<div class="bg-violet-50 rounded-xl p-5 border border-violet-100 flex items-start gap-3">
<svg class="w-6 h-6 text-violet-600 flex-shrink-0 mt-0.5" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M15.536 8.464a5 5 0 010 7.072m2.828-9.9a9 9 0 010 12.728M5.586 15H4a1 1 0 01-1-1v-4a1 1 0 011-1h1.586l4.707-4.707C10.923 3.663 12 4.109 12 5v14c0 .891-1.077 1.337-1.707.707L5.586 15z" /></svg>
<div>
<h3 class="font-semibold text-slate-900 mb-1">กันไอน้ำ ความชื้น และลดเสียง</h3>
<p class="text-sm text-slate-700">ช่วยกันไอน้ำ ความชื้น และลดเสียงรบกวนในระดับหนึ่ง ให้บรรยากาศเงียบ สบาย</p>
</div>
</div>
<!-- 6 -->
<div class="bg-red-50 rounded-xl p-5 border border-red-100 flex items-start gap-3">
<svg class="w-6 h-6 text-red-600 flex-shrink-0 mt-0.5" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 12l2 2 4-4m5.618-4.016A11.955 11.955 0 0112 2.944a11.955 11.955 0 01-8.618 3.04A12.02 12.02 0 003 9c0 5.591 3.824 10.29 9 11.622 5.176-1.332 9-6.03 9-11.622 0-1.042-.133-2.052-.382-3.016z" /></svg>
<div>
<h3 class="font-semibold text-slate-900 mb-1">ปลอดภัย ใช้ได้ใน-นอกอาคาร</h3>
<p class="text-sm text-slate-700">มาตรฐานไฟ Class 0 ใช้ได้ทั้งหลังคา ผนัง บ้าน อาคาร โรงงาน และรถยนต์</p>
</div>
</div>
</div>
</div>
</section>
<!-- ===================== PRODUCT DETAILS ===================== -->
<section class="py-16 lg:py-24 bg-neutral-50">
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
<div class="max-w-4xl mx-auto">
<h2 class="text-2xl sm:text-3xl font-bold text-slate-900 mb-8">รายละเอียดสินค้า CcooL</h2>
<div class="prose prose-lg max-w-none mb-8">
<p class="text-lg text-slate-700 leading-relaxed mb-6">
<strong>CcooL (ฉนวนซีคูล)</strong> ฉนวนโฟมโพลีเอทิลีนเซลล์ปิด 100% (Cross-linked Foam Polyethylene / XPE) เคลือบอลูมิเนียมฟอยล์หนา 32 ไมครอน ลดการถ่ายเทความร้อนได้อย่างมีประสิทธิภาพ ป้องกันการเกิดหยดน้ำ ใช้งานได้ทั้งภายในและภายนอกอาคาร เหมาะกับงานระบบปรับอากาศ (HVAC) ท่อน้ำเย็น ท่อน้ำยาแอร์ และงานสถาปัตยกรรม
</p>
<div class="grid md:grid-cols-2 gap-6 mb-8">
<div class="bg-white rounded-xl p-6 border border-neutral-200">
<h3 class="text-xl font-bold text-primary-700 mb-4">คุณสมบัติเด่น</h3>
<ul class="space-y-3">
<li class="flex items-start gap-3">
<svg class="w-5 h-5 text-primary-600 flex-shrink-0 mt-0.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 class="text-slate-700"><strong>ฟอยล์สะท้อน UV/ความร้อน 95%</strong> — ฟอยล์หนา 32 ไมครอน</span>
</li>
<li class="flex items-start gap-3">
<svg class="w-5 h-5 text-primary-600 flex-shrink-0 mt-0.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 class="text-slate-700"><strong>โฟม PE/XPE เซลล์ปิด 100%</strong> — กันน้ำ กันไอน้ำ</span>
</li>
<li class="flex items-start gap-3">
<svg class="w-5 h-5 text-primary-600 flex-shrink-0 mt-0.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 class="text-slate-700"><strong>K-value 0.024 W/mK</strong> — ประหยัดพลังงานสูงสุด</span>
</li>
<li class="flex items-start gap-3">
<svg class="w-5 h-5 text-primary-600 flex-shrink-0 mt-0.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 class="text-slate-700"><strong>ติดตั้งง่าย น้ำหนักเบา</strong> — ตัดด้วยคัตเตอร์ ไม่มีฝุ่นใยแก้ว</span>
</li>
<li class="flex items-start gap-3">
<svg class="w-5 h-5 text-primary-600 flex-shrink-0 mt-0.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 class="text-slate-700"><strong>กันเสียง ลดความชื้น</strong> — บรรยากาศเงียบ สบาย</span>
</li>
<li class="flex items-start gap-3">
<svg class="w-5 h-5 text-primary-600 flex-shrink-0 mt-0.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 class="text-slate-700"><strong>มาตรฐานไฟ Class 0</strong> — ใช้ได้ทั้งใน-นอกอาคาร</span>
</li>
</ul>
</div>
<div class="bg-white rounded-xl p-6 border border-neutral-200">
<h3 class="text-xl font-bold text-slate-900 mb-4">ข้อมูลจำเพาะ</h3>
<ul class="space-y-3">
<li class="flex items-start gap-3">
<span class="text-primary-600 font-semibold min-w-[140px]">โครงสร้างวัสดุ:</span>
<span class="text-slate-700">โฟม PE Cross-linked / XPE เซลล์ปิด</span>
</li>
<li class="flex items-start gap-3">
<span class="text-primary-600 font-semibold min-w-[140px]">ผิวเคลือบ:</span>
<span class="text-slate-700">อลูมิเนียมฟอยล์ 32 ไมครอน</span>
</li>
<li class="flex items-start gap-3">
<span class="text-primary-600 font-semibold min-w-[140px]">K-Value:</span>
<span class="text-slate-700">0.024 W/m.K</span>
</li>
<li class="flex items-start gap-3">
<span class="text-primary-600 font-semibold min-w-[140px]">อุณหภูมิใช้งาน:</span>
<span class="text-slate-700">-95°C ถึง 105°C</span>
</li>
<li class="flex items-start gap-3">
<span class="text-primary-600 font-semibold min-w-[140px]">ความหนาแน่น:</span>
<span class="text-slate-700">32.85 kg/m³</span>
</li>
<li class="flex items-start gap-3">
<span class="text-primary-600 font-semibold min-w-[140px]">ความหนา:</span>
<span class="text-slate-700">5 50 mm</span>
</li>
</ul>
</div>
</div>
</div>
</div>
</div>
</section>
<!-- ===================== PRODUCT LINEUP ===================== -->
<section class="py-16 lg:py-24 bg-white">
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
<div class="text-center mb-12">
<h2 class="text-2xl sm:text-3xl font-bold text-slate-900 mb-3">กลุ่มผลิตภัณฑ์และโซลูชัน</h2>
<p class="text-lg text-neutral-600 max-w-3xl mx-auto">CcooL ครอบคลุมทุกการใช้งาน ตั้งแต่ฉนวนแผ่น ฉนวนท่อสำเร็จรูป ไปจนถึงงานสถาปัตยกรรม</p>
</div>
<div class="grid md:grid-cols-2 lg:grid-cols-4 gap-6">
<!-- Sheet -->
<a href="#sheet" data-umami-event="product-lineup-sheet" class="group bg-neutral-50 rounded-xl p-6 border border-neutral-200 hover:border-primary-300 hover:shadow-lg transition-all">
<div class="w-12 h-12 rounded-xl bg-primary-600 flex items-center justify-center mb-4 group-hover:scale-105 transition-transform">
<svg class="w-6 h-6 text-white" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 6h16M4 10h16M4 14h16M4 18h16" /></svg>
</div>
<h3 class="font-bold text-slate-900 mb-2">ฉนวนแผ่นมาตรฐาน</h3>
<p class="text-sm text-slate-600 leading-relaxed">รุ่น AXPE / AXPE-S (แบบมีกาว) สำหรับท่อลมขนาดใหญ่ งานพื้น ผนัง หลังคา</p>
</a>
<!-- Tube -->
<a href="#tube" data-umami-event="product-lineup-tube" class="group bg-neutral-50 rounded-xl p-6 border border-neutral-200 hover:border-primary-300 hover:shadow-lg transition-all">
<div class="w-12 h-12 rounded-xl bg-sky-600 flex items-center justify-center mb-4 group-hover:scale-105 transition-transform">
<svg class="w-6 h-6 text-white" 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="font-bold text-slate-900 mb-2">ฉนวนท่อสำเร็จรูป</h3>
<p class="text-sm text-slate-600 leading-relaxed">รุ่น CcooL Tube สำหรับท่อเหล็ก ทองแดง PPR PVC สไปรัล ป้องกันหยดน้ำ</p>
</a>
<!-- Roof/Wall/Floor -->
<a href="#roof" data-umami-event="product-lineup-roof" class="group bg-neutral-50 rounded-xl p-6 border border-neutral-200 hover:border-primary-300 hover:shadow-lg transition-all">
<div class="w-12 h-12 rounded-xl bg-emerald-600 flex items-center justify-center mb-4 group-hover:scale-105 transition-transform">
<svg class="w-6 h-6 text-white" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M3 12l9-9 9 9M5 10v10a1 1 0 001 1h3a1 1 0 001-1v-4a1 1 0 011-1h2a1 1 0 011 1v4a1 1 0 001 1h3a1 1 0 001-1V10" /></svg>
</div>
<h3 class="font-bold text-slate-900 mb-2">หลังคา / ผนัง / พื้น</h3>
<p class="text-sm text-slate-600 leading-relaxed">ทนความร้อน กันเสียง บังความร้อนเข้าอาคาร ทั้งงานสถาปัตย์</p>
</a>
<!-- Adhesives -->
<a href="#adhesives" data-umami-event="product-lineup-adhesives" class="group bg-neutral-50 rounded-xl p-6 border border-neutral-200 hover:border-primary-300 hover:shadow-lg transition-all">
<div class="w-12 h-12 rounded-xl bg-amber-500 flex items-center justify-center mb-4 group-hover:scale-105 transition-transform">
<svg class="w-6 h-6 text-white" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M11 4a2 2 0 114 0v1a1 1 0 001 1h3a1 1 0 011 1v3a1 1 0 01-1 1h-1a2 2 0 100 4h1a1 1 0 011 1v3a1 1 0 01-1 1h-3a1 1 0 01-1-1v-1a2 2 0 10-4 0v1a1 1 0 01-1 1H7a1 1 0 01-1-1v-3a1 1 0 00-1-1H4a2 2 0 110-4h1a1 1 0 001-1V7a1 1 0 011-1h3a1 1 0 001-1V4z" /></svg>
</div>
<h3 class="font-bold text-slate-900 mb-2">กาวและอุปกรณ์ติดตั้ง</h3>
<p class="text-sm text-slate-600 leading-relaxed">กาวยาง M-88, เทปเชื่อมรอยต่อ C-Fix, Fiber-Tape, Alu-Tape</p>
</a>
</div>
</div>
</section>
<!-- ===================== SHEET / TUBE TABLES ===================== -->
<section class="py-16 lg:py-24 bg-neutral-50" id="sheet">
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
<div class="max-w-4xl mx-auto text-center mb-10">
<h2 class="text-2xl sm:text-3xl font-bold text-slate-900 mb-3">ฉนวนแผ่นมาตรฐาน (CcooL Sheet Insulation)</h2>
<p class="text-lg text-neutral-600">ฉนวนแบบแผ่นสำหรับหุ้มท่อลมขนาดใหญ่ (ตั้งแต่ 8 นิ้วขึ้นไป) และงานพื้น/ผนัง/หลังคา</p>
</div>
<div class="max-w-3xl mx-auto overflow-x-auto rounded-xl border border-neutral-200 shadow-sm">
<table class="min-w-full divide-y divide-neutral-200 text-sm">
<thead class="bg-primary-600 text-white">
<tr>
<th class="px-4 py-3 text-left font-semibold">รหัสสินค้า (AXPE-S มีกาว)</th>
<th class="px-4 py-3 text-center font-semibold">ความหนา</th>
<th class="px-4 py-3 text-center font-semibold">ขนาด กว้าง x ยาว</th>
<th class="px-4 py-3 text-center font-semibold">พื้นที่/ม้วน</th>
</tr>
</thead>
<tbody class="divide-y divide-neutral-100 bg-white">
<tr class="even:bg-neutral-50"><td class="px-4 py-2.5 font-medium text-slate-800">C Cool - AXS5</td><td class="px-4 py-2.5 text-center">5 mm</td><td class="px-4 py-2.5 text-center">1.2 x 25 m</td><td class="px-4 py-2.5 text-center">30 m²</td></tr>
<tr class="even:bg-neutral-50"><td class="px-4 py-2.5 font-medium text-slate-800">C Cool - AXS10</td><td class="px-4 py-2.5 text-center">10 mm</td><td class="px-4 py-2.5 text-center">1.2 x 25 m</td><td class="px-4 py-2.5 text-center">30 m²</td></tr>
<tr class="even:bg-neutral-50"><td class="px-4 py-2.5 font-medium text-slate-800">C Cool - AXS15</td><td class="px-4 py-2.5 text-center">15 mm</td><td class="px-4 py-2.5 text-center">1.2 x 25 m</td><td class="px-4 py-2.5 text-center">30 m²</td></tr>
<tr class="even:bg-neutral-50"><td class="px-4 py-2.5 font-medium text-slate-800">C Cool - AXS20</td><td class="px-4 py-2.5 text-center">20 mm</td><td class="px-4 py-2.5 text-center">1.2 x 25 m</td><td class="px-4 py-2.5 text-center">30 m²</td></tr>
<tr class="even:bg-neutral-50"><td class="px-4 py-2.5 font-medium text-slate-800">C Cool - AXS25</td><td class="px-4 py-2.5 text-center">25 mm</td><td class="px-4 py-2.5 text-center">1.2 x 25 m</td><td class="px-4 py-2.5 text-center">30 m²</td></tr>
<tr class="even:bg-neutral-50"><td class="px-4 py-2.5 font-medium text-slate-800">C Cool - AXS30</td><td class="px-4 py-2.5 text-center">30 mm</td><td class="px-4 py-2.5 text-center">1.2 x 15 m</td><td class="px-4 py-2.5 text-center">18 m²</td></tr>
<tr class="even:bg-neutral-50"><td class="px-4 py-2.5 font-medium text-slate-800">C Cool - AXS35</td><td class="px-4 py-2.5 text-center">35 mm</td><td class="px-4 py-2.5 text-center">1.2 x 2.5 m</td><td class="px-4 py-2.5 text-center">3 m²</td></tr>
<tr class="even:bg-neutral-50"><td class="px-4 py-2.5 font-medium text-slate-800">C Cool - AXS40</td><td class="px-4 py-2.5 text-center">40 mm</td><td class="px-4 py-2.5 text-center">1.2 x 2.5 m</td><td class="px-4 py-2.5 text-center">3 m²</td></tr>
<tr class="even:bg-neutral-50"><td class="px-4 py-2.5 font-medium text-slate-800">C Cool - AXS45</td><td class="px-4 py-2.5 text-center">45 mm</td><td class="px-4 py-2.5 text-center">1.2 x 2.5 m</td><td class="px-4 py-2.5 text-center">3 m²</td></tr>
<tr class="even:bg-neutral-50"><td class="px-4 py-2.5 font-medium text-slate-800">C Cool - AXS50</td><td class="px-4 py-2.5 text-center">50 mm</td><td class="px-4 py-2.5 text-center">1.2 x 2.5 m</td><td class="px-4 py-2.5 text-center">3 m²</td></tr>
</tbody>
</table>
</div>
<p class="text-sm text-neutral-500 mt-4 text-center">รุ่น AXPE (ไม่มีกาว) มีรหัสสินค้าตั้งแต่ C Cool - AX5 ถึง AX50</p>
</div>
</section>
<!-- ===================== TUBE ===================== -->
<section class="py-16 lg:py-24 bg-white" id="tube">
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
<div class="max-w-4xl mx-auto text-center mb-10">
<h2 class="text-2xl sm:text-3xl font-bold text-slate-900 mb-3">ฉนวนท่อสำเร็จรูป (CcooL Tube Insulation)</h2>
<p class="text-lg text-neutral-600">หุ้มท่อน้ำเย็น (Chilled Water) ท่อน้ำยา ท่อน้ำทิ้ง ป้องกันการเกิดหยดน้ำบนท่อ</p>
</div>
<div class="grid md:grid-cols-2 lg:grid-cols-5 gap-6">
<div class="bg-neutral-50 rounded-xl p-5 border border-neutral-200 text-center">
<h3 class="font-semibold text-slate-900 mb-2">ท่อเหล็ก (IPS)</h3>
<p class="text-sm text-slate-600">ขนาด 1/4" ถึง 10"<br/>ความหนา 1050 mm</p>
</div>
<div class="bg-neutral-50 rounded-xl p-5 border border-neutral-200 text-center">
<h3 class="font-semibold text-slate-900 mb-2">ท่อทองแดง (CP)</h3>
<p class="text-sm text-slate-600">ขนาด 1/4" ถึง 6-3/8"<br/>ความหนา 1050 mm</p>
</div>
<div class="bg-neutral-50 rounded-xl p-5 border border-neutral-200 text-center">
<h3 class="font-semibold text-slate-900 mb-2">ท่อ PPR</h3>
<p class="text-sm text-slate-600">ขนาด 1/2" ถึง 10"<br/>ความหนา 1050 mm</p>
</div>
<div class="bg-neutral-50 rounded-xl p-5 border border-neutral-200 text-center">
<h3 class="font-semibold text-slate-900 mb-2">ท่อ PVC</h3>
<p class="text-sm text-slate-600">ขนาด 3/8" ถึง 10"<br/>ความหนา 1050 mm</p>
</div>
<div class="bg-neutral-50 rounded-xl p-5 border border-neutral-200 text-center">
<h3 class="font-semibold text-slate-900 mb-2">ท่อสไปรัล</h3>
<p class="text-sm text-slate-600">ขนาด 4" ถึง 16"<br/>ความหนา 1030 mm</p>
</div>
</div>
</div>
</section>
<!-- ===================== ROOF / ADHESIVES ===================== -->
<section class="py-16 lg:py-24 bg-neutral-50" id="roof">
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
<div class="grid md:grid-cols-2 gap-8">
<div class="bg-white rounded-xl p-8 border border-neutral-200">
<h3 class="text-xl font-bold text-slate-900 mb-4">ฉนวนทนความร้อน งานสถาปัตย์</h3>
<ul class="space-y-3 text-slate-700">
<li class="flex items-start gap-3"><span class="text-primary-600 font-semibold min-w-[70px]">หลังคา:</span>ติดตั้งใต้แผ่นหลังคาเมทัลชีท/กระเบื้อง ยึดด้วยสกรู+แหวนรอง ช่วยกันความร้อนแผ่เข้าอาคาร</li>
<li class="flex items-start gap-3"><span class="text-primary-600 font-semibold min-w-[70px]">ผนัง:</span>ฉนวนกันความร้อน ควบคุมเสียงสะท้อนระหว่างห้อง</li>
<li class="flex items-start gap-3"><span class="text-primary-600 font-semibold min-w-[70px]">พื้น:</span>ติดตั้งบนพื้นคอนกรีตด้วยพินยึดฉนวน (C Cool Pin) กันความชื้น ควบคุมอุณหภูมิ</li>
</ul>
</div>
<div class="bg-white rounded-xl p-8 border border-neutral-200" id="adhesives">
<h3 class="text-xl font-bold text-slate-900 mb-4">กาวและอุปกรณ์ติดตั้ง</h3>
<ul class="space-y-3 text-slate-700">
<li class="flex items-start gap-3"><span class="text-primary-600 font-semibold min-w-[90px]">กาวยาง M-88:</span>แรงยึดติดส่วนโค้งสูง ทนความร้อน เหมาะสำหรับช่างมืออาชีพ</li>
<li class="flex items-start gap-3"><span class="text-primary-600 font-semibold min-w-[90px]">เทปเชื่อมรอยต่อ:</span>C-Fix, Fiber-Tape, AXPE-Tape, Alu-Tape ติดตั้งเรียบร้อย ไร้รอยรั่วซึมความร้อน</li>
</ul>
</div>
</div>
</div>
</section>
<!-- ===================== ว.ส.ท. THICKNESS STANDARD ===================== -->
<section class="py-16 lg:py-24 bg-white">
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
<div class="text-center mb-12">
<h2 class="text-2xl sm:text-3xl font-bold text-slate-900 mb-3">มาตรฐานความหนาที่แนะนำ (ว.ส.ท.)</h2>
<p class="text-lg text-neutral-600 max-w-3xl mx-auto">ความหนาฉนวนขั้นต่ำเพื่อป้องกันการกลั่นตัวเป็นหยดน้ำ ในสภาวะอากาศร้อนชื้นของไทย (35°C, RH 75%) ตามมาตรฐานวิศวกรรมสถานแห่งประเทศไทยฯ</p>
</div>
<div class="grid md:grid-cols-3 gap-6">
<!-- Chilled water -->
<div class="bg-primary-50 rounded-xl p-6 border border-primary-100">
<h3 class="text-lg font-bold text-primary-700 mb-4">ท่อน้ำเย็น (Chilled Water)</h3>
<ul class="space-y-2 text-sm text-slate-700">
<li class="flex justify-between border-b border-primary-100 pb-2"><span>ท่อ ≤ 2½"</span><strong>≥ 1" (25 mm)</strong></li>
<li class="flex justify-between border-b border-primary-100 pb-2"><span>ท่อ 3" 6"</span><strong>≥ 1½" (40 mm)</strong></li>
<li class="flex justify-between"><span>ท่อ ≥ 8"</span><strong>≥ 2" (50 mm)</strong></li>
</ul>
</div>
<!-- Refrigerant -->
<div class="bg-sky-50 rounded-xl p-6 border border-sky-100">
<h3 class="text-lg font-bold text-sky-700 mb-4">ท่อน้ำยาแอร์ (Refrigerant)</h3>
<ul class="space-y-2 text-sm text-slate-700">
<li class="flex justify-between border-b border-sky-100 pb-2"><span>ท่อ ≤ 2⅞"</span><strong>≥ ¾" (20 mm)</strong></li>
<li class="flex justify-between"><span>ใช้งานภายนอกอาคาร</span><strong>≥ 1" (25 mm)</strong></li>
</ul>
</div>
<!-- Condensate -->
<div class="bg-amber-50 rounded-xl p-6 border border-amber-100">
<h3 class="text-lg font-bold text-amber-700 mb-4">ท่อน้ำทิ้งแอร์ (Condensate)</h3>
<ul class="space-y-2 text-sm text-slate-700">
<li class="flex justify-between border-b border-amber-100 pb-2"><span>ท่อ ≤ 2½"</span><strong>≥ ½" (15 mm)</strong></li>
<li class="flex justify-between border-b border-amber-100 pb-2"><span>ท่อ 3" 6"</span><strong>≥ ¾" (20 mm)</strong></li>
<li class="flex justify-between"><span>ท่อ ≥ 8"</span><strong>≥ 1" (25 mm)</strong></li>
</ul>
</div>
</div>
</div>
</section>
<!-- ===================== TECHNICAL SPEC TABLE ===================== -->
<section class="py-16 lg:py-24 bg-neutral-50">
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
<div class="text-center mb-12">
<h2 class="text-2xl sm:text-3xl font-bold text-slate-900 mb-3">ข้อมูลทางเทคนิค (Technical Specifications)</h2>
<p class="text-lg text-neutral-600 max-w-3xl mx-auto">สำหรับวิศวกรใช้ประกอบการตัดสินใจเลือกใช้ฉนวน CcooL</p>
</div>
<div class="overflow-x-auto rounded-xl border border-neutral-200 shadow-sm">
<table class="min-w-full divide-y divide-neutral-200 text-sm">
<thead class="bg-primary-600 text-white">
<tr>
<th class="px-4 py-3 text-left font-semibold">คุณสมบัติ</th>
<th class="px-4 py-3 text-left font-semibold">ข้อมูลจำเพาะ</th>
<th class="px-4 py-3 text-left font-semibold">วิธีการทดสอบ</th>
</tr>
</thead>
<tbody class="divide-y divide-neutral-100 bg-white">
<tr class="even:bg-neutral-50"><td class="px-4 py-2.5 font-medium text-slate-800">โครงสร้างวัสดุ</td><td class="px-4 py-2.5">โครงสร้างเซลล์ปิด, ยืดหยุ่นได้ดี</td><td class="px-4 py-2.5">ISO 9001:2015</td></tr>
<tr class="even:bg-neutral-50"><td class="px-4 py-2.5 font-medium text-slate-800">ความหนาแน่น</td><td class="px-4 py-2.5">32.85 kg/m³</td><td class="px-4 py-2.5">ASTM D1667-17</td></tr>
<tr class="even:bg-neutral-50"><td class="px-4 py-2.5 font-medium text-slate-800">ค่าการนำความร้อน (K-Value)</td><td class="px-4 py-2.5"><strong>0.024 W/m.K</strong></td><td class="px-4 py-2.5">MTEC ISO 22007-2, ASTM C177/C518</td></tr>
<tr class="even:bg-neutral-50"><td class="px-4 py-2.5 font-medium text-slate-800">ความหนาอลูมิเนียมฟอยล์</td><td class="px-4 py-2.5">32 ไมครอน</td><td class="px-4 py-2.5">SGS, KSM ISO 17555, ASTM D-374</td></tr>
<tr class="even:bg-neutral-50"><td class="px-4 py-2.5 font-medium text-slate-800">การต้านทานแบคทีเรีย</td><td class="px-4 py-2.5">Zero Growth</td><td class="px-4 py-2.5">ASTM G21</td></tr>
<tr class="even:bg-neutral-50"><td class="px-4 py-2.5 font-medium text-slate-800">การดูดซึมน้ำ</td><td class="px-4 py-2.5">เพิ่มขึ้น % &lt; 0.90</td><td class="px-4 py-2.5">ASTM D570-98, D1056, JIS K6767</td></tr>
<tr class="even:bg-neutral-50"><td class="px-4 py-2.5 font-medium text-slate-800">การซึมผ่านของไอน้ำ</td><td class="px-4 py-2.5">&lt; 0.10</td><td class="px-4 py-2.5">ASTM E96</td></tr>
<tr class="even:bg-neutral-50"><td class="px-4 py-2.5 font-medium text-slate-800">ความต้านทานไอน้ำ</td><td class="px-4 py-2.5">≥ 15,000</td><td class="px-4 py-2.5">ASTM E96</td></tr>
<tr class="even:bg-neutral-50"><td class="px-4 py-2.5 font-medium text-slate-800">ความทนทานต่อโอโซน</td><td class="px-4 py-2.5">ดีมาก</td><td class="px-4 py-2.5">ASTM D1171</td></tr>
<tr class="even:bg-neutral-50"><td class="px-4 py-2.5 font-medium text-slate-800">ความทนทานต่อสารเคมี</td><td class="px-4 py-2.5">ไม่เปลี่ยนแปลง ต่อกรดเกลือ/ซัลฟิวริก/ด่าง/เกลือ</td><td class="px-4 py-2.5">ASTM D1308-02</td></tr>
<tr class="even:bg-neutral-50"><td class="px-4 py-2.5 font-medium text-slate-800">ความหนาแน่นของควัน</td><td class="px-4 py-2.5">เกิดควันน้อยมาก (VOF₄ = 116)</td><td class="px-4 py-2.5">BS EN ISO 5659-2:2017</td></tr>
<tr class="even:bg-neutral-50"><td class="px-4 py-2.5 font-medium text-slate-800">ความเป็นพิษของควัน</td><td class="px-4 py-2.5">ต่ำเป็นพิเศษ (CIT_g 240s = 0.02, 480s = 0.01)</td><td class="px-4 py-2.5">BS EN 45545-2:2020, ISO 5659-2</td></tr>
<tr class="even:bg-neutral-50"><td class="px-4 py-2.5 font-medium text-slate-800">ดัชนีลามไฟ / ควัน</td><td class="px-4 py-2.5">25 / 50</td><td class="px-4 py-2.5">ASTM E84</td></tr>
<tr class="even:bg-neutral-50"><td class="px-4 py-2.5 font-medium text-slate-800">ความสามารถในการติดไฟ</td><td class="px-4 py-2.5"><strong>BS 476 Class 0 Certified</strong></td><td class="px-4 py-2.5">TUV SUD PSB (Singapore)</td></tr>
<tr class="even:bg-neutral-50"><td class="px-4 py-2.5 font-medium text-slate-800">ช่วงอุณหภูมิใช้งาน</td><td class="px-4 py-2.5">-95°C ถึง 105°C</td><td class="px-4 py-2.5">-</td></tr>
<tr class="even:bg-neutral-50"><td class="px-4 py-2.5 font-medium text-slate-800">ความต้านทานแรงดึง/ฉีกขาด</td><td class="px-4 py-2.5">Tensile 34.6 N/cm², Tear 20.6 N/cm</td><td class="px-4 py-2.5">JIS K6767-1976</td></tr>
<tr class="even:bg-neutral-50"><td class="px-4 py-2.5 font-medium text-slate-800">การควบคุมความเงียบ (STC)</td><td class="px-4 py-2.5">ระดับดี</td><td class="px-4 py-2.5">ASTM E2611-09</td></tr>
<tr class="even:bg-neutral-50"><td class="px-4 py-2.5 font-medium text-slate-800">การจำกัดสารอันตราย</td><td class="px-4 py-2.5">RoHS Certified (&lt; 0.1% โดยน้ำหนัก)</td><td class="px-4 py-2.5">NSC-TISI-TIS 107025</td></tr>
</tbody>
</table>
</div>
</div>
</section>
<!-- ===================== CERTIFICATIONS ===================== -->
<section class="py-16 lg:py-24 bg-white">
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
<div class="text-center mb-12">
<h2 class="text-2xl sm:text-3xl font-bold text-slate-900 mb-3">มาตรฐานและการยอมรับระดับสากล</h2>
<p class="text-lg text-neutral-600">ฉนวน CcooL ผ่านการรับรองจากสถาบันชั้นนำระดับโลก</p>
</div>
<div class="grid grid-cols-2 md:grid-cols-3 lg:grid-cols-5 gap-6 max-w-5xl mx-auto">
<div class="bg-neutral-50 rounded-xl p-5 border border-neutral-200 text-center">
<div class="w-12 h-12 mx-auto mb-3 bg-red-100 rounded-full flex items-center justify-center">
<span class="text-red-600 font-extrabold text-sm">TÜV</span>
</div>
<p class="font-semibold text-slate-900 text-sm">TUV SUD PSB (Singapore)</p>
<p class="text-xs text-neutral-500 mt-1">BS 476 Class 0</p>
</div>
<div class="bg-neutral-50 rounded-xl p-5 border border-neutral-200 text-center">
<div class="w-12 h-12 mx-auto mb-3 bg-blue-100 rounded-full flex items-center justify-center">
<span class="text-blue-600 font-extrabold text-sm">ISO</span>
</div>
<p class="font-semibold text-slate-900 text-sm">ISO 9001:2015</p>
<p class="text-xs text-neutral-500 mt-1">ระบบบริหารงานคุณภาพ</p>
</div>
<div class="bg-neutral-50 rounded-xl p-5 border border-neutral-200 text-center">
<div class="w-12 h-12 mx-auto mb-3 bg-green-100 rounded-full flex items-center justify-center">
<span class="text-green-600 font-extrabold text-sm">MiT</span>
</div>
<p class="font-semibold text-slate-900 text-sm">Made in Thailand</p>
<p class="text-xs text-neutral-500 mt-1">MiT6603000631</p>
</div>
<div class="bg-neutral-50 rounded-xl p-5 border border-neutral-200 text-center">
<div class="w-12 h-12 mx-auto mb-3 bg-purple-100 rounded-full flex items-center justify-center">
<span class="text-purple-600 font-extrabold text-sm">MTEC</span>
</div>
<p class="font-semibold text-slate-900 text-sm">MTEC (สวทช.)</p>
<p class="text-xs text-neutral-500 mt-1">รับรองค่าทางฟิสิกส์</p>
</div>
<div class="bg-neutral-50 rounded-xl p-5 border border-neutral-200 text-center">
<div class="w-12 h-12 mx-auto mb-3 bg-slate-200 rounded-full flex items-center justify-center">
<span class="text-slate-600 font-extrabold text-sm">RoHS</span>
</div>
<p class="font-semibold text-slate-900 text-sm">SGS / UL / ASTM / JIS</p>
<p class="text-xs text-neutral-500 mt-1">ทดสอบตามระเบียบสากล</p>
</div>
</div>
</div>
</section>
<!-- ===================== GALLERY ===================== -->
<section class="py-16 bg-neutral-50">
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
<div class="text-center mb-10">
<h2 class="text-2xl font-bold text-primary-700 mb-2">แกลอรี่ภาพสินค้า</h2>
<p class="text-neutral-600">ภาพสินค้า CcooL — โครงสร้างชั้นฟอยล์และตัวอย่างการใช้งาน</p>
</div>
<div class="grid grid-cols-2 md:grid-cols-3 lg:grid-cols-4 gap-4">
<a data-umami-event="product-gallery-infographic" href="/images/ccool/ccool-brand-infographic.jpg" target="_blank" rel="noopener" class="group block overflow-hidden rounded-xl shadow-md hover:shadow-xl transition-shadow">
<img src="/images/ccool/ccool-brand-infographic.jpg" alt="CcooL โครงสร้างฉนวนแบบชั้น" class="w-full h-48 object-cover group-hover:scale-105 transition-transform duration-300" loading="lazy" />
</a>
<a data-umami-event="product-gallery-roll" href="/images/ccool/ccool-roll-product.jpg" target="_blank" rel="noopener" class="group block overflow-hidden rounded-xl shadow-md hover:shadow-xl transition-shadow">
<img src="/images/ccool/ccool-roll-product.jpg" alt="CcooL ม้วนฉนวนพร้อมจัดส่ง" class="w-full h-48 object-cover group-hover:scale-105 transition-transform duration-300" loading="lazy" />
</a>
<a data-umami-event="product-gallery-features" href="/images/ccool/ccool-features-vertical.jpg" target="_blank" rel="noopener" class="group block overflow-hidden rounded-xl shadow-md hover:shadow-xl transition-shadow">
<img src="/images/ccool/ccool-features-vertical.jpg" alt="CcooL จุดเด่นและคุณสมบัติ" class="w-full h-48 object-cover group-hover:scale-105 transition-transform duration-300" loading="lazy" />
</a>
<a data-umami-event="product-gallery-banner" href="/images/ccool/ccool-banner-horizontal.jpg" target="_blank" rel="noopener" class="group block overflow-hidden rounded-xl shadow-md hover:shadow-xl transition-shadow">
<img src="/images/ccool/ccool-banner-horizontal.jpg" alt="CcooL ข้อมูลผลิตภัณฑ์" class="w-full h-48 object-cover group-hover:scale-105 transition-transform duration-300" loading="lazy" />
</a>
<a data-umami-event="product-gallery-application" href="/images/ccool/ccool-application-hvac.jpg" target="_blank" rel="noopener" class="group block overflow-hidden rounded-xl shadow-md hover:shadow-xl transition-shadow">
<img src="/images/ccool/ccool-application-hvac.jpg" alt="CcooL การใช้งานระบบ HVAC" class="w-full h-48 object-cover group-hover:scale-105 transition-transform duration-300" loading="lazy" />
</a>
</div>
</div>
</section>
<!-- ===================== PRICELIST / DOWNLOAD ===================== -->
<section class="py-16 bg-gradient-to-br from-primary-700 to-primary-600 text-white relative overflow-hidden" id="pricelist">
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 relative z-10">
<div class="max-w-lg mx-auto text-center">
<h2 class="text-xl font-bold mb-6">📥 ดาวน์โหลดราคาสินค้า CcooL 2026</h2>
<a href="/documents/CcooL ราคาฉนวนซีคูล 2026 Update.pdf" data-umami-event="product-pdf-download" target="_blank" rel="noopener" class="inline-flex items-center gap-4 p-4 bg-white rounded-xl shadow-sm hover:shadow-md transition-shadow text-left">
<svg class="w-8 h-8 text-red-600 flex-shrink-0" fill="currentColor" viewBox="0 0 24 24">
<path d="M14 2H6a2 2 0 00-2 2v16a2 2 0 002 2h12a2 2 0 002-2V8l-6-6zm-1 9V3.5L18.5 9H13zM8 13h8v2H8v-2zm0 4h8v2H8v-2zm0-8h2v2H8V9z"/>
</svg>
<div>
<div class="font-medium text-slate-900">CcooL ราคาฉนวนซีคูล 2026 Update</div>
<div class="text-sm text-slate-500">PDF - ดาวน์โหลดราคา (แผ่น + ท่อสำเร็จรูป)</div>
</div>
</a>
</div>
</div>
</section>
<!-- ===================== CONTACT (formerly lead form) ===================== -->
<section class="py-16 lg:py-24 bg-white">
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
<div class="text-center mb-12">
<h2 class="text-2xl sm:text-3xl font-bold text-slate-900 mb-3">ปรึกษาวิศวกรและขอใบเสนอราคาฟรี</h2>
<p class="text-lg text-neutral-600 max-w-3xl mx-auto">ทีมวิศวกรของเราช่วยแนะนำความหนาและสเปกฉนวน CcooL ที่เหมาะกับโครงการของคุณ</p>
</div>
<div class="grid md:grid-cols-3 gap-6 max-w-4xl mx-auto">
<a href="https://line.me/ti/p/~JPPSELECTION" data-umami-event="product-contact-line" target="_blank" rel="noopener" class="bg-neutral-50 rounded-xl p-6 border border-neutral-200 hover:border-primary-300 hover:shadow-lg transition-all text-center group">
<div class="w-14 h-14 mx-auto mb-4 bg-green-100 rounded-xl flex items-center justify-center group-hover:bg-green-200">
<svg class="w-7 h-7 text-green-600" 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>
</div>
<h3 class="font-semibold text-neutral-800 mb-1">ไลน์</h3>
<p class="text-primary-600 font-medium">JPPSELECTION</p>
<p class="text-sm text-neutral-500 mt-1">แอดเพื่อขอใบเสนอราคาฟรี</p>
</a>
<a href="tel:0905551415" data-umami-event="product-contact-call" class="bg-neutral-50 rounded-xl p-6 border border-neutral-200 hover:border-primary-300 hover:shadow-lg transition-all text-center group">
<div class="w-14 h-14 mx-auto mb-4 bg-blue-100 rounded-xl flex items-center justify-center group-hover:bg-blue-200">
<svg class="w-7 h-7 text-blue-600" 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>
</div>
<h3 class="font-semibold text-neutral-800 mb-1">โทรศัพท์</h3>
<p class="text-primary-600 font-medium">090-555-1415</p>
<p class="text-sm text-neutral-500 mt-1">พูดคุยกับวิศวกรโดยตรง</p>
</a>
<a href="mailto:dealplustech@gmail.com" data-umami-event="product-contact-email" class="bg-neutral-50 rounded-xl p-6 border border-neutral-200 hover:border-primary-300 hover:shadow-lg transition-all text-center group">
<div class="w-14 h-14 mx-auto mb-4 bg-orange-100 rounded-xl flex items-center justify-center group-hover:bg-orange-200">
<svg class="w-7 h-7 text-orange-600" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M3 8l7.89 5.26a2 2 0 002.22 0L21 8M5 19h14a2 2 0 002-2V7a2 2 0 00-2-2H5a2 2 0 00-2 2v10a2 2 0 002 2z" /></svg>
</div>
<h3 class="font-semibold text-neutral-800 mb-1">อีเมล</h3>
<p class="text-primary-600 font-medium">dealplustech@gmail.com</p>
<p class="text-sm text-neutral-500 mt-1">ตอบกลับภายใน 24 ชม.</p>
</a>
</div>
</div>
</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">สนใจฉนวน CcooL นี้?</h2>
<p class="text-lg text-primary-100 mb-8">ติดต่อเราวันนี้ 090-555-1415 หรือแอดไลน์ ID:JPPSELECTION รับราคาโรงงาน ส่งฟรี กทม. และปริมณฑล</p>
<div class="flex flex-wrap justify-center gap-4">
<a href="/contact-us" data-umami-event="product-cta-contact" 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" data-umami-event="product-cta-line" 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>

View File

@@ -83,11 +83,11 @@ import BaseLayout from '@/layouts/BaseLayout.astro';
</div> </div>
</div> </div>
<div class="flex flex-wrap justify-center gap-4 mb-8 lg:justify-start"> <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"> <a href="https://line.me/ti/p/~JPPSELECTION" target="_blank" rel="noopener" data-umami-event="product-hero-line" 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> <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 แชท Line
</a> </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"> <a href="tel:0905551415" data-umami-event="product-hero-call" 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"> <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" /> <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> </svg>
@@ -349,8 +349,8 @@ import BaseLayout from '@/layouts/BaseLayout.astro';
<h2 class="text-3xl font-bold mb-6">สนใจสินค้านี้?</h2> <h2 class="text-3xl font-bold mb-6">สนใจสินค้านี้?</h2>
<p class="text-lg text-primary-100 mb-8">ติดต่อเราวันนี้ 090-555-1415 หรือแอดไลน์ ID:JPPSELECTION</p> <p class="text-lg text-primary-100 mb-8">ติดต่อเราวันนี้ 090-555-1415 หรือแอดไลน์ ID:JPPSELECTION</p>
<div class="flex flex-wrap justify-center gap-4"> <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="/contact-us" data-umami-event="product-cta-contact" 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> <a href="https://line.me/ti/p/~JPPSELECTION" target="_blank" rel="noopener" data-umami-event="product-cta-line" class="bg-accent-500 hover:bg-accent-600 text-white py-3 px-8 rounded-xl font-semibold transition-colors">แอดไลน์</a>
</div> </div>
</div> </div>
</section> </main> </section> </main>

View File

@@ -71,19 +71,19 @@ import BaseLayout from '@/layouts/BaseLayout.astro';
</div> </div>
</div> </div>
<div class="flex flex-wrap gap-4 mb-8"> <div class="flex flex-wrap gap-4 mb-8">
<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"> <a href="https://line.me/ti/p/~JPPSELECTION" target="_blank" rel="noopener" data-umami-event="product-hero-line" 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"> <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"/> <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> </svg>
แชท Line แชท Line
</a> </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"> <a href="tel:0905551415" data-umami-event="product-hero-call" 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"> <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" /> <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> </svg>
090-555-1415 090-555-1415
</a> </a>
<a href="#pricelist" data-price-button class="hidden bg-white text-primary-700 hover:bg-primary-50 py-3 px-6 rounded-xl font-semibold flex items-center gap-2"> <a href="#pricelist" data-price-button data-umami-event="product-hero-price" class="hidden 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"> <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="M9 12h6m-6 4h6m2 5H7a2 2 0 01-2-2V5a2 2 0 012-2h5.586a1 1 0 01.707.293l5.414 5.414a1 1 0 01.293.707V19a2 2 0 01-2 2z" /> <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 12h6m-6 4h6m2 5H7a2 2 0 01-2-2V5a2 2 0 012-2h5.586a1 1 0 01.707.293l5.414 5.414a1 1 0 01.293.707V19a2 2 0 01-2 2z" />
</svg> </svg>
@@ -144,7 +144,7 @@ import BaseLayout from '@/layouts/BaseLayout.astro';
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 relative z-10"> <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 relative z-10">
<div class="max-w-lg mx-auto text-center"> <div class="max-w-lg mx-auto text-center">
<h2 class="text-xl font-bold mb-6">📥 ดาวน์โหลดราคาสินค้า ท่อ HDPE</h2> <h2 class="text-xl font-bold mb-6">📥 ดาวน์โหลดราคาสินค้า ท่อ HDPE</h2>
<a href="/documents/Price List HDPE TAP.pdf" target="_blank" class="inline-flex items-center gap-4 p-4 bg-white rounded-xl shadow-sm hover:shadow-md transition-shadow text-left"> <a href="/documents/Price List HDPE TAP.pdf" target="_blank" data-umami-event="product-pdf-download" class="inline-flex items-center gap-4 p-4 bg-white rounded-xl shadow-sm hover:shadow-md transition-shadow text-left">
<svg class="w-8 h-8 text-red-600 flex-shrink-0" fill="currentColor" viewBox="0 0 24 24"> <svg class="w-8 h-8 text-red-600 flex-shrink-0" fill="currentColor" viewBox="0 0 24 24">
<path d="M14 2H6a2 2 0 00-2 2v16a2 2 0 002 2h12a2 2 0 002-2V8l-6-6zm-1 9V3.5L18.5 9H13zM8 13h8v2H8v-2zm0 4h8v2H8v-2zm0-8h2v2H8V9z" /> <path d="M14 2H6a2 2 0 00-2 2v16a2 2 0 002 2h12a2 2 0 002-2V8l-6-6zm-1 9V3.5L18.5 9H13zM8 13h8v2H8v-2zm0 4h8v2H8v-2zm0-8h2v2H8V9z" />
</svg> </svg>
@@ -163,8 +163,8 @@ import BaseLayout from '@/layouts/BaseLayout.astro';
<h2 class="text-3xl font-bold mb-6">สนใจสินค้านี้?</h2> <h2 class="text-3xl font-bold mb-6">สนใจสินค้านี้?</h2>
<p class="text-lg text-primary-100 mb-8">ติดต่อเราวันนี้ 090-555-1415 หรือแอดไลน์ ID:JPPSELECTION</p> <p class="text-lg text-primary-100 mb-8">ติดต่อเราวันนี้ 090-555-1415 หรือแอดไลน์ ID:JPPSELECTION</p>
<div class="flex flex-wrap justify-center gap-4"> <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="/contact-us" data-umami-event="product-cta-contact" 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> <a href="https://line.me/ti/p/~JPPSELECTION" target="_blank" rel="noopener" data-umami-event="product-cta-line" class="bg-accent-500 hover:bg-accent-600 text-white py-3 px-8 rounded-xl font-semibold transition-colors">แอดไลน์</a>
</div> </div>
</div> </div>
</section> </section>

View File

@@ -71,19 +71,19 @@ import BaseLayout from '@/layouts/BaseLayout.astro';
</div> </div>
</div> </div>
<div class="flex flex-wrap gap-4 mb-8"> <div class="flex flex-wrap gap-4 mb-8">
<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"> <a href="https://line.me/ti/p/~JPPSELECTION" target="_blank" rel="noopener" data-umami-event="product-hero-line" 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"> <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"/> <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> </svg>
แชท Line แชท Line
</a> </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"> <a href="tel:0905551415" data-umami-event="product-hero-call" 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"> <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" /> <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> </svg>
090-555-1415 090-555-1415
</a> </a>
<a href="#pricelist" data-price-button class="hidden bg-white text-primary-700 hover:bg-primary-50 py-3 px-6 rounded-xl font-semibold flex items-center gap-2"> <a href="#pricelist" data-price-button data-umami-event="product-hero-price" class="hidden 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"> <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="M9 12h6m-6 4h6m2 5H7a2 2 0 01-2-2V5a2 2 0 012-2h5.586a1 1 0 01.707.293l5.414 5.414a1 1 0 01.293.707V19a2 2 0 01-2 2z" /> <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 12h6m-6 4h6m2 5H7a2 2 0 01-2-2V5a2 2 0 012-2h5.586a1 1 0 01.707.293l5.414 5.414a1 1 0 01.293.707V19a2 2 0 01-2 2z" />
</svg> </svg>
@@ -136,7 +136,7 @@ import BaseLayout from '@/layouts/BaseLayout.astro';
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 relative z-10"> <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 relative z-10">
<div class="max-w-lg mx-auto text-center"> <div class="max-w-lg mx-auto text-center">
<h2 class="text-xl font-bold mb-6">📥 ดาวน์โหลดราคาสินค้า ท่อ PPR ตราช้าง (SCG)</h2> <h2 class="text-xl font-bold mb-6">📥 ดาวน์โหลดราคาสินค้า ท่อ PPR ตราช้าง (SCG)</h2>
<a href="/documents/เอสซีเจ ปี68.pdf" target="_blank" class="inline-flex items-center gap-4 p-4 bg-white rounded-xl shadow-sm hover:shadow-md transition-shadow text-left"> <a href="/documents/เอสซีเจ ปี68.pdf" target="_blank" data-umami-event="product-pdf-download" class="inline-flex items-center gap-4 p-4 bg-white rounded-xl shadow-sm hover:shadow-md transition-shadow text-left">
<svg class="w-8 h-8 text-red-600 flex-shrink-0" fill="currentColor" viewBox="0 0 24 24"> <svg class="w-8 h-8 text-red-600 flex-shrink-0" fill="currentColor" viewBox="0 0 24 24">
<path d="M14 2H6a2 2 0 00-2 2v16a2 2 0 002 2h12a2 2 0 002-2V8l-6-6zm-1 9V3.5L18.5 9H13zM8 13h8v2H8v-2zm0 4h8v2H8v-2zm0-8h2v2H8V9z" /> <path d="M14 2H6a2 2 0 00-2 2v16a2 2 0 002 2h12a2 2 0 002-2V8l-6-6zm-1 9V3.5L18.5 9H13zM8 13h8v2H8v-2zm0 4h8v2H8v-2zm0-8h2v2H8V9z" />
</svg> </svg>
@@ -155,8 +155,8 @@ import BaseLayout from '@/layouts/BaseLayout.astro';
<h2 class="text-3xl font-bold mb-6">สนใจสินค้านี้?</h2> <h2 class="text-3xl font-bold mb-6">สนใจสินค้านี้?</h2>
<p class="text-lg text-primary-100 mb-8">ติดต่อเราวันนี้ 090-555-1415 หรือแอดไลน์ ID:JPPSELECTION</p> <p class="text-lg text-primary-100 mb-8">ติดต่อเราวันนี้ 090-555-1415 หรือแอดไลน์ ID:JPPSELECTION</p>
<div class="flex flex-wrap justify-center gap-4"> <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="/contact-us" data-umami-event="product-cta-contact" 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> <a href="https://line.me/ti/p/~JPPSELECTION" target="_blank" rel="noopener" data-umami-event="product-cta-line" class="bg-accent-500 hover:bg-accent-600 text-white py-3 px-8 rounded-xl font-semibold transition-colors">แอดไลน์</a>
</div> </div>
</div> </div>
</section> </section>

View File

@@ -71,19 +71,19 @@ import BaseLayout from '@/layouts/BaseLayout.astro';
</div> </div>
</div> </div>
<div class="flex flex-wrap gap-4 mb-8"> <div class="flex flex-wrap gap-4 mb-8">
<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"> <a href="https://line.me/ti/p/~JPPSELECTION" target="_blank" rel="noopener" data-umami-event="product-hero-line" 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"> <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"/> <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> </svg>
แชท Line แชท Line
</a> </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"> <a href="tel:0905551415" data-umami-event="product-hero-call" 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"> <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" /> <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> </svg>
090-555-1415 090-555-1415
</a> </a>
<a href="#pricelist" data-price-button class="hidden bg-white text-primary-700 hover:bg-primary-50 py-3 px-6 rounded-xl font-semibold flex items-center gap-2"> <a href="#pricelist" data-price-button data-umami-event="product-hero-price" class="hidden 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"> <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="M9 12h6m-6 4h6m2 5H7a2 2 0 01-2-2V5a2 2 0 012-2h5.586a1 1 0 01.707.293l5.414 5.414a1 1 0 01.293.707V19a2 2 0 01-2 2z" /> <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 12h6m-6 4h6m2 5H7a2 2 0 01-2-2V5a2 2 0 012-2h5.586a1 1 0 01.707.293l5.414 5.414a1 1 0 01.293.707V19a2 2 0 01-2 2z" />
</svg> </svg>
@@ -155,7 +155,7 @@ import BaseLayout from '@/layouts/BaseLayout.astro';
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 relative z-10"> <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 relative z-10">
<div class="max-w-lg mx-auto text-center"> <div class="max-w-lg mx-auto text-center">
<h2 class="text-xl font-bold mb-6">📥 ดาวน์โหลดราคาสินค้า ไทยพีพีอาร์</h2> <h2 class="text-xl font-bold mb-6">📥 ดาวน์โหลดราคาสินค้า ไทยพีพีอาร์</h2>
<a href="/documents/PRICE-LIST_TPPR_V28-2023 [26012023].pdf" target="_blank" class="inline-flex items-center gap-4 p-4 bg-white rounded-xl shadow-sm hover:shadow-md transition-shadow text-left"> <a href="/documents/PRICE-LIST_TPPR_V28-2023 [26012023].pdf" target="_blank" data-umami-event="product-pdf-download" class="inline-flex items-center gap-4 p-4 bg-white rounded-xl shadow-sm hover:shadow-md transition-shadow text-left">
<svg class="w-8 h-8 text-red-600 flex-shrink-0" fill="currentColor" viewBox="0 0 24 24"> <svg class="w-8 h-8 text-red-600 flex-shrink-0" fill="currentColor" viewBox="0 0 24 24">
<path d="M14 2H6a2 2 0 00-2 2v16a2 2 0 002 2h12a2 2 0 002-2V8l-6-6zm-1 9V3.5L18.5 9H13zM8 13h8v2H8v-2zm0 4h8v2H8v-2zm0-8h2v2H8V9z" /> <path d="M14 2H6a2 2 0 00-2 2v16a2 2 0 002 2h12a2 2 0 002-2V8l-6-6zm-1 9V3.5L18.5 9H13zM8 13h8v2H8v-2zm0 4h8v2H8v-2zm0-8h2v2H8V9z" />
</svg> </svg>
@@ -174,8 +174,8 @@ import BaseLayout from '@/layouts/BaseLayout.astro';
<h2 class="text-3xl font-bold mb-6">สนใจสินค้านี้?</h2> <h2 class="text-3xl font-bold mb-6">สนใจสินค้านี้?</h2>
<p class="text-lg text-primary-100 mb-8">ติดต่อเราวันนี้ 090-555-1415 หรือแอดไลน์ ID:JPPSELECTION</p> <p class="text-lg text-primary-100 mb-8">ติดต่อเราวันนี้ 090-555-1415 หรือแอดไลน์ ID:JPPSELECTION</p>
<div class="flex flex-wrap justify-center gap-4"> <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="/contact-us" data-umami-event="product-cta-contact" 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> <a href="https://line.me/ti/p/~JPPSELECTION" target="_blank" rel="noopener" data-umami-event="product-cta-line" class="bg-accent-500 hover:bg-accent-600 text-white py-3 px-8 rounded-xl font-semibold transition-colors">แอดไลน์</a>
</div> </div>
</div> </div>
</section> </section>

View File

@@ -82,11 +82,11 @@ import BaseLayout from '@/layouts/BaseLayout.astro';
</div> </div>
</div> </div>
<div class="flex flex-wrap justify-center gap-4 mb-8 lg:justify-start"> <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"> <a href="https://line.me/ti/p/~JPPSELECTION" data-umami-event="product-hero-line" 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> <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 แชท Line
</a> </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"> <a href="tel:0905551415" data-umami-event="product-hero-call" 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"> <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" /> <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> </svg>
@@ -353,8 +353,8 @@ import BaseLayout from '@/layouts/BaseLayout.astro';
<h2 class="text-3xl font-bold mb-6">สนใจสินค้านี้?</h2> <h2 class="text-3xl font-bold mb-6">สนใจสินค้านี้?</h2>
<p class="text-lg text-primary-100 mb-8">ติดต่อเราวันนี้ 090-555-1415 หรือแอดไลน์ ID:JPPSELECTION</p> <p class="text-lg text-primary-100 mb-8">ติดต่อเราวันนี้ 090-555-1415 หรือแอดไลน์ ID:JPPSELECTION</p>
<div class="flex flex-wrap justify-center gap-4"> <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="/contact-us" data-umami-event="product-cta-contact" 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> <a href="https://line.me/ti/p/~JPPSELECTION" data-umami-event="product-cta-line" 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>
</div> </div>
</section> </main> </section> </main>

View File

@@ -92,13 +92,13 @@ import BaseLayout from '@/layouts/BaseLayout.astro';
</div> </div>
</div> </div>
<div class="flex flex-wrap gap-4 mb-8"> <div class="flex flex-wrap gap-4 mb-8">
<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"> <a href="https://line.me/ti/p/~JPPSELECTION" data-umami-event="product-hero-line" 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"> <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"/> <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> </svg>
แชท Line แชท Line
</a> </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"> <a href="tel:0905551415" data-umami-event="product-hero-call" 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"> <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" /> <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> </svg>
@@ -258,8 +258,8 @@ import BaseLayout from '@/layouts/BaseLayout.astro';
<h2 class="text-3xl font-bold mb-6">สนใจสินค้านี้?</h2> <h2 class="text-3xl font-bold mb-6">สนใจสินค้านี้?</h2>
<p class="text-lg text-primary-100 mb-8">ติดต่อเราวันนี้ 090-555-1415 หรือแอดไลน์ ID:JPPSELECTION</p> <p class="text-lg text-primary-100 mb-8">ติดต่อเราวันนี้ 090-555-1415 หรือแอดไลน์ ID:JPPSELECTION</p>
<div class="flex flex-wrap justify-center gap-4"> <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="/contact-us" data-umami-event="product-cta-contact" 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> <a href="https://line.me/ti/p/~JPPSELECTION" data-umami-event="product-cta-line" 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>
</div> </div>
</section> </section>

View File

@@ -44,17 +44,17 @@ import BaseLayout from '@/layouts/BaseLayout.astro';
</p> </p>
<div class="flex flex-wrap justify-center gap-4 mb-8 lg:justify-start"> <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"> <a href="https://line.me/ti/p/~JPPSELECTION" target="_blank" rel="noopener" data-umami-event="product-hero-line" 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> <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 แชท Line
</a> </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"> <a href="tel:0905551415" data-umami-event="product-hero-call" 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"> <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" /> <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> </svg>
090-555-1415 090-555-1415
</a> </a>
<a href="#pricelist" data-price-button class="hidden bg-white text-primary-700 hover:bg-primary-50 py-3 px-6 rounded-xl font-semibold flex items-center gap-2"> <a href="#pricelist" data-price-button data-umami-event="product-hero-price" class="hidden 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"> <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="M9 12h6m-6 4h6m2 5H7a2 2 0 01-2-2V5a2 2 0 012-2h5.586a1 1 0 01.707.293l5.414 5.414a1 1 0 01.293.707V19a2 2 0 01-2 2z" /> <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 12h6m-6 4h6m2 5H7a2 2 0 01-2-2V5a2 2 0 012-2h5.586a1 1 0 01.707.293l5.414 5.414a1 1 0 01.293.707V19a2 2 0 01-2 2z" />
</svg> </svg>
@@ -260,7 +260,7 @@ import BaseLayout from '@/layouts/BaseLayout.astro';
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 relative z-10"> <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 relative z-10">
<div class="max-w-lg mx-auto text-center"> <div class="max-w-lg mx-auto text-center">
<h2 class="text-xl font-bold mb-6">📥 ดาวน์โหลดราคาสินค้า ท่อ XYLENT</h2> <h2 class="text-xl font-bold mb-6">📥 ดาวน์โหลดราคาสินค้า ท่อ XYLENT</h2>
<a href="/documents/Price List XYLENT_Novat_V12-2022 [080265]_220727_155718 (1).pdf" target="_blank" class="inline-flex items-center gap-4 p-4 bg-white rounded-xl shadow-sm hover:shadow-md transition-shadow text-left"> <a href="/documents/Price List XYLENT_Novat_V12-2022 [080265]_220727_155718 (1).pdf" target="_blank" data-umami-event="product-pdf-download" class="inline-flex items-center gap-4 p-4 bg-white rounded-xl shadow-sm hover:shadow-md transition-shadow text-left">
<svg class="w-8 h-8 text-red-600 flex-shrink-0" fill="currentColor" viewBox="0 0 24 24"> <svg class="w-8 h-8 text-red-600 flex-shrink-0" fill="currentColor" viewBox="0 0 24 24">
<path d="M14 2H6a2 2 0 00-2 2v16a2 2 0 002 2h12a2 2 0 002-2V8l-6-6zm-1 9V3.5L18.5 9H13zM8 13h8v2H8v-2zm0 4h8v2H8v-2zm0-8h2v2H8V9z" /> <path d="M14 2H6a2 2 0 00-2 2v16a2 2 0 002 2h12a2 2 0 002-2V8l-6-6zm-1 9V3.5L18.5 9H13zM8 13h8v2H8v-2zm0 4h8v2H8v-2zm0-8h2v2H8V9z" />
</svg> </svg>
@@ -279,8 +279,8 @@ import BaseLayout from '@/layouts/BaseLayout.astro';
<h2 class="text-3xl font-bold mb-6">สนใจสินค้านี้?</h2> <h2 class="text-3xl font-bold mb-6">สนใจสินค้านี้?</h2>
<p class="text-lg text-primary-100 mb-8">ติดต่อเราวันนี้ 090-555-1415 หรือแอดไลน์ ID:JPPSELECTION</p> <p class="text-lg text-primary-100 mb-8">ติดต่อเราวันนี้ 090-555-1415 หรือแอดไลน์ ID:JPPSELECTION</p>
<div class="flex flex-wrap justify-center gap-4"> <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="/contact-us" data-umami-event="product-cta-contact" 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> <a href="https://line.me/ti/p/~JPPSELECTION" target="_blank" rel="noopener" data-umami-event="product-cta-line" class="bg-accent-500 hover:bg-accent-600 text-white py-3 px-8 rounded-xl font-semibold transition-colors">แอดไลน์</a>
</div> </div>
</div> </div>
</section> </section>

View File

@@ -45,13 +45,13 @@ import BaseLayout from '@/layouts/BaseLayout.astro';
ระบบน้ำครบวงจร วาล์ว ปั๊มน้ำ ระบบกรองน้ำ คุณภาพสูง ราคาโรงงาน ส่งฟรี กรุงเทพมหานคร ปริมณฑล ระบบน้ำครบวงจร วาล์ว ปั๊มน้ำ ระบบกรองน้ำ คุณภาพสูง ราคาโรงงาน ส่งฟรี กรุงเทพมหานคร ปริมณฑล
</p> </p>
<div class="flex flex-wrap gap-4 mb-8"> <div class="flex flex-wrap gap-4 mb-8">
<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"> <a href="https://line.me/ti/p/~JPPSELECTION" data-umami-event="product-hero-line" 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"> <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"/> <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> </svg>
แชท Line แชท Line
</a> </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"> <a href="tel:0905551415" data-umami-event="product-hero-call" 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"> <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" /> <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> </svg>
@@ -192,13 +192,13 @@ import BaseLayout from '@/layouts/BaseLayout.astro';
<h2 class="text-3xl font-bold mb-6">สนใจสินค้าของเรา?</h2> <h2 class="text-3xl font-bold mb-6">สนใจสินค้าของเรา?</h2>
<p class="text-lg text-primary-100 mb-8">ติดต่อเราวันนี้เพื่อรับคำแนะนำและราคาพิเศษ</p> <p class="text-lg text-primary-100 mb-8">ติดต่อเราวันนี้เพื่อรับคำแนะนำและราคาพิเศษ</p>
<div class="flex flex-wrap justify-center gap-4"> <div class="flex flex-wrap justify-center gap-4">
<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"> <a href="https://line.me/ti/p/~JPPSELECTION" data-umami-event="product-cta-line" 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"> <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"/> <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> </svg>
แชท Line แชท Line
</a> </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"> <a href="tel:0905551415" data-umami-event="product-cta-call" class="bg-white text-primary-700 hover:bg-primary-50 py-3 px-6 rounded-xl font-semibold flex items-center gap-2">
โทร 090-555-1415 โทร 090-555-1415
</a> </a>
</div> </div>

View File

@@ -69,11 +69,11 @@ import BaseLayout from '@/layouts/BaseLayout.astro';
</div> </div>
</div> </div>
<div class="flex flex-wrap justify-center gap-4 mb-8 lg:justify-start"> <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"> <a href="https://line.me/ti/p/~JPPSELECTION" target="_blank" rel="noopener" data-umami-event="product-hero-line" 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> <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 แชท Line
</a> </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"> <a href="tel:0905551415" data-umami-event="product-hero-call" 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"> <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" /> <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> </svg>
@@ -543,8 +543,8 @@ import BaseLayout from '@/layouts/BaseLayout.astro';
<h2 class="text-3xl font-bold mb-6">สนใจสินค้านี้?</h2> <h2 class="text-3xl font-bold mb-6">สนใจสินค้านี้?</h2>
<p class="text-lg text-primary-100 mb-8">ติดต่อเราวันนี้ 090-555-1415 หรือแอดไลน์ ID:JPPSELECTION</p> <p class="text-lg text-primary-100 mb-8">ติดต่อเราวันนี้ 090-555-1415 หรือแอดไลน์ ID:JPPSELECTION</p>
<div class="flex flex-wrap justify-center gap-4"> <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="/contact-us" data-umami-event="product-cta-contact" 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> <a href="https://line.me/ti/p/~JPPSELECTION" target="_blank" rel="noopener" data-umami-event="product-cta-line" class="bg-accent-500 hover:bg-accent-600 text-white py-3 px-8 rounded-xl font-semibold transition-colors">แอดไลน์</a>
</div> </div>
</div> </div>
</section> </main> </section> </main>

View File

@@ -61,11 +61,11 @@ import BaseLayout from '@/layouts/BaseLayout.astro';
</p> </p>
<div class="flex flex-wrap justify-center gap-4 mb-8 lg:justify-start"> <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"> <a href="https://line.me/ti/p/~JPPSELECTION" target="_blank" rel="noopener" data-umami-event="product-hero-line" 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> <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 แชท Line
</a> </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"> <a href="tel:0905551415" data-umami-event="product-hero-call" 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"> <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" /> <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> </svg>
@@ -262,8 +262,8 @@ import BaseLayout from '@/layouts/BaseLayout.astro';
<h2 class="text-3xl font-bold mb-6">สนใจสินค้านี้?</h2> <h2 class="text-3xl font-bold mb-6">สนใจสินค้านี้?</h2>
<p class="text-lg text-primary-100 mb-8">ติดต่อเราวันนี้ 090-555-1415 หรือแอดไลน์ ID:JPPSELECTION</p> <p class="text-lg text-primary-100 mb-8">ติดต่อเราวันนี้ 090-555-1415 หรือแอดไลน์ ID:JPPSELECTION</p>
<div class="flex flex-wrap justify-center gap-4"> <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="/contact-us" data-umami-event="product-cta-contact" 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> <a href="https://line.me/ti/p/~JPPSELECTION" target="_blank" rel="noopener" data-umami-event="product-cta-line" class="bg-accent-500 hover:bg-accent-600 text-white py-3 px-8 rounded-xl font-semibold transition-colors">แอดไลน์</a>
</div> </div>
</div> </div>
</section> </main> </section> </main>

View File

@@ -75,11 +75,11 @@ import BaseLayout from '@/layouts/BaseLayout.astro';
</div> </div>
</div> </div>
<div class="flex flex-wrap justify-center gap-4 mb-8 lg:justify-start"> <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"> <a href="https://line.me/ti/p/~JPPSELECTION" target="_blank" rel="noopener" data-umami-event="product-hero-line" 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> <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 แชท Line
</a> </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"> <a href="tel:0905551415" data-umami-event="product-hero-call" 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"> <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" /> <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> </svg>
@@ -231,8 +231,8 @@ import BaseLayout from '@/layouts/BaseLayout.astro';
<h2 class="text-3xl font-bold mb-6">สนใจสินค้านี้?</h2> <h2 class="text-3xl font-bold mb-6">สนใจสินค้านี้?</h2>
<p class="text-lg text-primary-100 mb-8">ติดต่อเราวันนี้ 090-555-1415 หรือแอดไลน์ ID:JPPSELECTION</p> <p class="text-lg text-primary-100 mb-8">ติดต่อเราวันนี้ 090-555-1415 หรือแอดไลน์ ID:JPPSELECTION</p>
<div class="flex flex-wrap justify-center gap-4"> <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="/contact-us" data-umami-event="product-cta-contact" 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> <a href="https://line.me/ti/p/~JPPSELECTION" target="_blank" rel="noopener" data-umami-event="product-cta-line" class="bg-accent-500 hover:bg-accent-600 text-white py-3 px-8 rounded-xl font-semibold transition-colors">แอดไลน์</a>
</div> </div>
</div> </div>
</section> </main> </section> </main>

View File

@@ -88,11 +88,11 @@ import BaseLayout from '@/layouts/BaseLayout.astro';
</div> </div>
</div> </div>
<div class="flex flex-wrap justify-center gap-4 mb-8 lg:justify-start"> <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"> <a href="https://line.me/ti/p/~JPPSELECTION" target="_blank" rel="noopener" data-umami-event="product-hero-line" 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> <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 แชท Line
</a> </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"> <a href="tel:0905551415" data-umami-event="product-hero-call" 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"> <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" /> <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> </svg>
@@ -241,8 +241,8 @@ import BaseLayout from '@/layouts/BaseLayout.astro';
<h2 class="text-3xl font-bold mb-6">สนใจสินค้านี้?</h2> <h2 class="text-3xl font-bold mb-6">สนใจสินค้านี้?</h2>
<p class="text-lg text-primary-100 mb-8">ติดต่อเราวันนี้ 090-555-1415 หรือแอดไลน์ ID:JPPSELECTION</p> <p class="text-lg text-primary-100 mb-8">ติดต่อเราวันนี้ 090-555-1415 หรือแอดไลน์ ID:JPPSELECTION</p>
<div class="flex flex-wrap justify-center gap-4"> <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="/contact-us" data-umami-event="product-cta-contact" 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> <a href="https://line.me/ti/p/~JPPSELECTION" target="_blank" rel="noopener" data-umami-event="product-cta-line" class="bg-accent-500 hover:bg-accent-600 text-white py-3 px-8 rounded-xl font-semibold transition-colors">แอดไลน์</a>
</div> </div>
</div> </div>
</section> </main> </section> </main>

View File

@@ -74,17 +74,17 @@ import BaseLayout from '@/layouts/BaseLayout.astro';
</div> </div>
</div> </div>
<div class="flex flex-wrap justify-center gap-4 mb-8 lg:justify-start"> <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"> <a href="https://line.me/ti/p/~JPPSELECTION" target="_blank" rel="noopener" data-umami-event="product-hero-line" 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> <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 แชท Line
</a> </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"> <a href="tel:0905551415" data-umami-event="product-hero-call" 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"> <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" /> <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> </svg>
090-555-1415 090-555-1415
</a> </a>
<a href="#pricelist" data-price-button class="hidden bg-white text-primary-700 hover:bg-primary-50 py-3 px-6 rounded-xl font-semibold flex items-center gap-2"> <a href="#pricelist" data-price-button data-umami-event="product-hero-price" class="hidden 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"> <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="M9 12h6m-6 4h6m2 5H7a2 2 0 01-2-2V5a2 2 0 012-2h5.586a1 1 0 01.707.293l5.414 5.414a1 1 0 01.293.707V19a2 2 0 01-2 2z" /> <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 12h6m-6 4h6m2 5H7a2 2 0 01-2-2V5a2 2 0 012-2h5.586a1 1 0 01.707.293l5.414 5.414a1 1 0 01.293.707V19a2 2 0 01-2 2z" />
</svg> </svg>
@@ -245,7 +245,7 @@ import BaseLayout from '@/layouts/BaseLayout.astro';
<div class="max-w-3xl mx-auto px-4 sm:px-6 lg:px-8"> <div class="max-w-3xl mx-auto px-4 sm:px-6 lg:px-8">
<div class="bg-white rounded-2xl p-8 shadow-lg"> <div class="bg-white rounded-2xl p-8 shadow-lg">
<h2 class="text-xl font-bold text-primary-700 mb-6 text-center">ดาวน์โหลดราคาสินค้า</h2> <h2 class="text-xl font-bold text-primary-700 mb-6 text-center">ดาวน์โหลดราคาสินค้า</h2>
<a href="/documents/Price List HDPE TAP.pdf" target="_blank" class="flex items-start gap-4 p-4 bg-neutral-50 rounded-xl hover:bg-neutral-100 transition-colors group"> <a href="/documents/Price List HDPE TAP.pdf" target="_blank" data-umami-event="product-pdf-download" class="flex items-start gap-4 p-4 bg-neutral-50 rounded-xl hover:bg-neutral-100 transition-colors group">
<svg class="w-10 h-10 text-red-600 flex-shrink-0" fill="currentColor" viewBox="0 0 24 24"><path d="M14 2H6a2 2 0 00-2 2v16a2 2 0 002 2h12a2 2 0 002-2V8l-6-6zm-1 9V3.5L18.5 9H13zM8 13h8v2H8v-2zm0 4h8v2H8v-2zm0-8h2v2H8V9z"/></svg> <svg class="w-10 h-10 text-red-600 flex-shrink-0" fill="currentColor" viewBox="0 0 24 24"><path d="M14 2H6a2 2 0 00-2 2v16a2 2 0 002 2h12a2 2 0 002-2V8l-6-6zm-1 9V3.5L18.5 9H13zM8 13h8v2H8v-2zm0 4h8v2H8v-2zm0-8h2v2H8V9z"/></svg>
<div> <div>
<div class="font-semibold text-neutral-900 group-hover:text-primary-600 transition-colors">Price List HDPE</div> <div class="font-semibold text-neutral-900 group-hover:text-primary-600 transition-colors">Price List HDPE</div>
@@ -263,8 +263,8 @@ import BaseLayout from '@/layouts/BaseLayout.astro';
<h2 class="text-3xl font-bold mb-6">สนใจสินค้านี้?</h2> <h2 class="text-3xl font-bold mb-6">สนใจสินค้านี้?</h2>
<p class="text-lg text-primary-100 mb-8">ติดต่อเราวันนี้ 090-555-1415 หรือแอดไลน์ ID:JPPSELECTION</p> <p class="text-lg text-primary-100 mb-8">ติดต่อเราวันนี้ 090-555-1415 หรือแอดไลน์ ID:JPPSELECTION</p>
<div class="flex flex-wrap justify-center gap-4"> <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="/contact-us" data-umami-event="product-cta-contact" 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> <a href="https://line.me/ti/p/~JPPSELECTION" target="_blank" rel="noopener" data-umami-event="product-cta-line" class="bg-accent-500 hover:bg-accent-600 text-white py-3 px-8 rounded-xl font-semibold transition-colors">แอดไลน์</a>
</div> </div>
</div> </div>
</section> </main> </section> </main>

View File

@@ -80,11 +80,11 @@ import BaseLayout from '@/layouts/BaseLayout.astro';
</div> </div>
</div> </div>
<div class="flex flex-wrap justify-center gap-4 mb-8 lg:justify-start"> <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"> <a href="https://line.me/ti/p/~JPPSELECTION" target="_blank" rel="noopener" data-umami-event="product-hero-line" 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> <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 แชท Line
</a> </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"> <a href="tel:0905551415" data-umami-event="product-hero-call" 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"> <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" /> <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> </svg>
@@ -266,8 +266,8 @@ import BaseLayout from '@/layouts/BaseLayout.astro';
<h2 class="text-3xl font-bold mb-6">สนใจสินค้านี้?</h2> <h2 class="text-3xl font-bold mb-6">สนใจสินค้านี้?</h2>
<p class="text-lg text-primary-100 mb-8">ติดต่อเราวันนี้ 090-555-1415 หรือแอดไลน์ ID:JPPSELECTION</p> <p class="text-lg text-primary-100 mb-8">ติดต่อเราวันนี้ 090-555-1415 หรือแอดไลน์ ID:JPPSELECTION</p>
<div class="flex flex-wrap justify-center gap-4"> <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="/contact-us" data-umami-event="product-cta-contact" 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> <a href="https://line.me/ti/p/~JPPSELECTION" target="_blank" rel="noopener" data-umami-event="product-cta-line" class="bg-accent-500 hover:bg-accent-600 text-white py-3 px-8 rounded-xl font-semibold transition-colors">แอดไลน์</a>
</div> </div>
</div> </div>
</section> </main> </section> </main>

View File

@@ -69,17 +69,17 @@ import BaseLayout from '@/layouts/BaseLayout.astro';
</div> </div>
</div> </div>
<div class="flex flex-wrap justify-center gap-4 mb-8 lg:justify-start"> <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"> <a href="https://line.me/ti/p/~JPPSELECTION" target="_blank" rel="noopener" data-umami-event="product-hero-line" 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> <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 แชท Line
</a> </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"> <a href="tel:0905551415" data-umami-event="product-hero-call" 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"> <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" /> <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> </svg>
090-555-1415 090-555-1415
</a> </a>
<a href="#pricelist" data-price-button class="hidden bg-white text-primary-700 hover:bg-primary-50 py-3 px-6 rounded-xl font-semibold flex items-center gap-2"> <a href="#pricelist" data-price-button data-umami-event="product-hero-price" class="hidden 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"> <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="M9 12h6m-6 4h6m2 5H7a2 2 0 01-2-2V5a2 2 0 012-2h5.586a1 1 0 01.707.293l5.414 5.414a1 1 0 01.293.707V19a2 2 0 01-2 2z" /> <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 12h6m-6 4h6m2 5H7a2 2 0 01-2-2V5a2 2 0 012-2h5.586a1 1 0 01.707.293l5.414 5.414a1 1 0 01.293.707V19a2 2 0 01-2 2z" />
</svg> </svg>
@@ -383,7 +383,7 @@ import BaseLayout from '@/layouts/BaseLayout.astro';
<section id="pricelist" class="py-16 px-4 bg-gradient-to-br from-primary-700 to-primary-600 relative overflow-hidden"> <section id="pricelist" class="py-16 px-4 bg-gradient-to-br from-primary-700 to-primary-600 relative overflow-hidden">
<div class="max-w-4xl mx-auto text-center"> <div class="max-w-4xl mx-auto text-center">
<h2 class="text-2xl font-bold text-white mb-6">ดาวน์โหลดราคาสินค้า</h2> <h2 class="text-2xl font-bold text-white mb-6">ดาวน์โหลดราคาสินค้า</h2>
<a href="/documents/2026-New Update Thermobreak Price List.pdf" target="_blank" class="inline-flex items-start gap-4 p-6 bg-white rounded-xl hover:bg-neutral-100 transition-colors group"> <a href="/documents/2026-New Update Thermobreak Price List.pdf" target="_blank" data-umami-event="product-pdf-download" class="inline-flex items-start gap-4 p-6 bg-white rounded-xl hover:bg-neutral-100 transition-colors group">
<svg class="w-12 h-12 text-red-600 flex-shrink-0" fill="currentColor" viewBox="0 0 24 24"><path d="M14 2H6a2 2 0 00-2 2v16a2 2 0 002 2h12a2 2 0 002-2V8l-6-6zm-1 9V3.5L18.5 9H13zM8 13h8v2H8v-2zm0 4h8v2H8v-2zm0-8h2v2H8V9z"/></svg> <svg class="w-12 h-12 text-red-600 flex-shrink-0" fill="currentColor" viewBox="0 0 24 24"><path d="M14 2H6a2 2 0 00-2 2v16a2 2 0 002 2h12a2 2 0 002-2V8l-6-6zm-1 9V3.5L18.5 9H13zM8 13h8v2H8v-2zm0 4h8v2H8v-2zm0-8h2v2H8V9z"/></svg>
<div class="text-left"> <div class="text-left">
<div class="font-semibold text-neutral-900 group-hover:text-primary-600 transition-colors">Thermobreak Price List 2026</div> <div class="font-semibold text-neutral-900 group-hover:text-primary-600 transition-colors">Thermobreak Price List 2026</div>
@@ -403,31 +403,31 @@ import BaseLayout from '@/layouts/BaseLayout.astro';
<p class="text-neutral-600">ภาพสินค้าจริงจากงานติดตั้ง — คลิกเพื่อดูภาพขนาดเต็ม</p> <p class="text-neutral-600">ภาพสินค้าจริงจากงานติดตั้ง — คลิกเพื่อดูภาพขนาดเต็ม</p>
</div> </div>
<div class="grid grid-cols-2 md:grid-cols-3 lg:grid-cols-4 gap-4"> <div class="grid grid-cols-2 md:grid-cols-3 lg:grid-cols-4 gap-4">
<a href="/images/thermobreak/gallery-1.jpg" target="_blank" rel="noopener" class="group block overflow-hidden rounded-xl shadow-md hover:shadow-xl transition-shadow"> <a href="/images/thermobreak/gallery-1.jpg" target="_blank" rel="noopener" data-umami-event="product-gallery-1" class="group block overflow-hidden rounded-xl shadow-md hover:shadow-xl transition-shadow">
<img src="/images/thermobreak/gallery-1.jpg" alt="Thermobreak ภาพที่ 1" class="w-full h-48 object-cover group-hover:scale-105 transition-transform duration-300" loading="lazy" /> <img src="/images/thermobreak/gallery-1.jpg" alt="Thermobreak ภาพที่ 1" class="w-full h-48 object-cover group-hover:scale-105 transition-transform duration-300" loading="lazy" />
</a> </a>
<a href="/images/thermobreak/gallery-2.jpg" target="_blank" rel="noopener" class="group block overflow-hidden rounded-xl shadow-md hover:shadow-xl transition-shadow"> <a href="/images/thermobreak/gallery-2.jpg" target="_blank" rel="noopener" data-umami-event="product-gallery-2" class="group block overflow-hidden rounded-xl shadow-md hover:shadow-xl transition-shadow">
<img src="/images/thermobreak/gallery-2.jpg" alt="Thermobreak ภาพที่ 2" class="w-full h-48 object-cover group-hover:scale-105 transition-transform duration-300" loading="lazy" /> <img src="/images/thermobreak/gallery-2.jpg" alt="Thermobreak ภาพที่ 2" class="w-full h-48 object-cover group-hover:scale-105 transition-transform duration-300" loading="lazy" />
</a> </a>
<a href="/images/thermobreak/gallery-3.jpg" target="_blank" rel="noopener" class="group block overflow-hidden rounded-xl shadow-md hover:shadow-xl transition-shadow"> <a href="/images/thermobreak/gallery-3.jpg" target="_blank" rel="noopener" data-umami-event="product-gallery-3" class="group block overflow-hidden rounded-xl shadow-md hover:shadow-xl transition-shadow">
<img src="/images/thermobreak/gallery-3.jpg" alt="Thermobreak ภาพที่ 3" class="w-full h-48 object-cover group-hover:scale-105 transition-transform duration-300" loading="lazy" /> <img src="/images/thermobreak/gallery-3.jpg" alt="Thermobreak ภาพที่ 3" class="w-full h-48 object-cover group-hover:scale-105 transition-transform duration-300" loading="lazy" />
</a> </a>
<a href="/images/thermobreak/gallery-4.jpg" target="_blank" rel="noopener" class="group block overflow-hidden rounded-xl shadow-md hover:shadow-xl transition-shadow"> <a href="/images/thermobreak/gallery-4.jpg" target="_blank" rel="noopener" data-umami-event="product-gallery-4" class="group block overflow-hidden rounded-xl shadow-md hover:shadow-xl transition-shadow">
<img src="/images/thermobreak/gallery-4.jpg" alt="Thermobreak ภาพที่ 4" class="w-full h-48 object-cover group-hover:scale-105 transition-transform duration-300" loading="lazy" /> <img src="/images/thermobreak/gallery-4.jpg" alt="Thermobreak ภาพที่ 4" class="w-full h-48 object-cover group-hover:scale-105 transition-transform duration-300" loading="lazy" />
</a> </a>
<a href="/images/thermobreak/gallery-5.jpg" target="_blank" rel="noopener" class="group block overflow-hidden rounded-xl shadow-md hover:shadow-xl transition-shadow"> <a href="/images/thermobreak/gallery-5.jpg" target="_blank" rel="noopener" data-umami-event="product-gallery-5" class="group block overflow-hidden rounded-xl shadow-md hover:shadow-xl transition-shadow">
<img src="/images/thermobreak/gallery-5.jpg" alt="Thermobreak ภาพที่ 5" class="w-full h-48 object-cover group-hover:scale-105 transition-transform duration-300" loading="lazy" /> <img src="/images/thermobreak/gallery-5.jpg" alt="Thermobreak ภาพที่ 5" class="w-full h-48 object-cover group-hover:scale-105 transition-transform duration-300" loading="lazy" />
</a> </a>
<a href="/images/thermobreak/gallery-6.jpg" target="_blank" rel="noopener" class="group block overflow-hidden rounded-xl shadow-md hover:shadow-xl transition-shadow"> <a href="/images/thermobreak/gallery-6.jpg" target="_blank" rel="noopener" data-umami-event="product-gallery-6" class="group block overflow-hidden rounded-xl shadow-md hover:shadow-xl transition-shadow">
<img src="/images/thermobreak/gallery-6.jpg" alt="Thermobreak ภาพที่ 6" class="w-full h-48 object-cover group-hover:scale-105 transition-transform duration-300" loading="lazy" /> <img src="/images/thermobreak/gallery-6.jpg" alt="Thermobreak ภาพที่ 6" class="w-full h-48 object-cover group-hover:scale-105 transition-transform duration-300" loading="lazy" />
</a> </a>
<a href="/images/thermobreak/gallery-7.jpg" target="_blank" rel="noopener" class="group block overflow-hidden rounded-xl shadow-md hover:shadow-xl transition-shadow"> <a href="/images/thermobreak/gallery-7.jpg" target="_blank" rel="noopener" data-umami-event="product-gallery-7" class="group block overflow-hidden rounded-xl shadow-md hover:shadow-xl transition-shadow">
<img src="/images/thermobreak/gallery-7.jpg" alt="Thermobreak ภาพที่ 7" class="w-full h-48 object-cover group-hover:scale-105 transition-transform duration-300" loading="lazy" /> <img src="/images/thermobreak/gallery-7.jpg" alt="Thermobreak ภาพที่ 7" class="w-full h-48 object-cover group-hover:scale-105 transition-transform duration-300" loading="lazy" />
</a> </a>
<a href="/images/thermobreak/gallery-8.jpg" target="_blank" rel="noopener" class="group block overflow-hidden rounded-xl shadow-md hover:shadow-xl transition-shadow"> <a href="/images/thermobreak/gallery-8.jpg" target="_blank" rel="noopener" data-umami-event="product-gallery-8" class="group block overflow-hidden rounded-xl shadow-md hover:shadow-xl transition-shadow">
<img src="/images/thermobreak/gallery-8.jpg" alt="Thermobreak ภาพที่ 8" class="w-full h-48 object-cover group-hover:scale-105 transition-transform duration-300" loading="lazy" /> <img src="/images/thermobreak/gallery-8.jpg" alt="Thermobreak ภาพที่ 8" class="w-full h-48 object-cover group-hover:scale-105 transition-transform duration-300" loading="lazy" />
</a> </a>
<a href="/images/thermobreak/gallery-9.jpg" target="_blank" rel="noopener" class="group block overflow-hidden rounded-xl shadow-md hover:shadow-xl transition-shadow"> <a href="/images/thermobreak/gallery-9.jpg" target="_blank" rel="noopener" data-umami-event="product-gallery-9" class="group block overflow-hidden rounded-xl shadow-md hover:shadow-xl transition-shadow">
<img src="/images/thermobreak/gallery-9.jpg" alt="Thermobreak ภาพที่ 9" class="w-full h-48 object-cover group-hover:scale-105 transition-transform duration-300" loading="lazy" /> <img src="/images/thermobreak/gallery-9.jpg" alt="Thermobreak ภาพที่ 9" class="w-full h-48 object-cover group-hover:scale-105 transition-transform duration-300" loading="lazy" />
</a> </a>
</div> </div>
@@ -439,8 +439,8 @@ import BaseLayout from '@/layouts/BaseLayout.astro';
<h2 class="text-3xl font-bold mb-6">สนใจสินค้านี้?</h2> <h2 class="text-3xl font-bold mb-6">สนใจสินค้านี้?</h2>
<p class="text-lg text-primary-100 mb-8">ติดต่อเราวันนี้ 090-555-1415 หรือแอดไลน์ ID:JPPSELECTION</p> <p class="text-lg text-primary-100 mb-8">ติดต่อเราวันนี้ 090-555-1415 หรือแอดไลน์ ID:JPPSELECTION</p>
<div class="flex flex-wrap justify-center gap-4"> <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="/contact-us" data-umami-event="product-cta-contact" 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> <a href="https://line.me/ti/p/~JPPSELECTION" target="_blank" rel="noopener" data-umami-event="product-cta-line" class="bg-accent-500 hover:bg-accent-600 text-white py-3 px-8 rounded-xl font-semibold transition-colors">แอดไลน์</a>
</div> </div>
</div> </div>
</section> </main> </section> </main>

View File

@@ -75,17 +75,17 @@ import BaseLayout from '@/layouts/BaseLayout.astro';
</div> </div>
</div> </div>
<div class="flex flex-wrap justify-center gap-4 mb-8 lg:justify-start"> <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"> <a href="https://line.me/ti/p/~JPPSELECTION" target="_blank" rel="noopener" data-umami-event="product-hero-line" 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> <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 แชท Line
</a> </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"> <a href="tel:0905551415" data-umami-event="product-hero-call" 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"> <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" /> <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> </svg>
090-555-1415 090-555-1415
</a> </a>
<a href="#pricelist" data-price-button class="hidden bg-white text-primary-700 hover:bg-primary-50 py-3 px-6 rounded-xl font-semibold flex items-center gap-2"> <a href="#pricelist" data-price-button data-umami-event="product-hero-price" class="hidden 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"> <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="M9 12h6m-6 4h6m2 5H7a2 2 0 01-2-2V5a2 2 0 012-2h5.586a1 1 0 01.707.293l5.414 5.414a1 1 0 01.293.707V19a2 2 0 01-2 2z" /> <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 12h6m-6 4h6m2 5H7a2 2 0 01-2-2V5a2 2 0 012-2h5.586a1 1 0 01.707.293l5.414 5.414a1 1 0 01.293.707V19a2 2 0 01-2 2z" />
</svg> </svg>
@@ -352,7 +352,7 @@ import BaseLayout from '@/layouts/BaseLayout.astro';
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 relative z-10"> <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 relative z-10">
<div class="max-w-lg mx-auto"> <div class="max-w-lg mx-auto">
<h2 class="text-lg sm:text-xl font-bold mb-6 text-center">ดาวน์โหลดราคาสินค้า</h2> <h2 class="text-lg sm:text-xl font-bold mb-6 text-center">ดาวน์โหลดราคาสินค้า</h2>
<a href="/documents/Price List MECH_V13-2021 [260864](1).pdf" target="_blank" class="flex items-center gap-4 p-4 bg-white rounded-xl shadow-sm hover:shadow-md transition-shadow group"> <a href="/documents/Price List MECH_V13-2021 [260864](1).pdf" target="_blank" data-umami-event="product-pdf-download" class="flex items-center gap-4 p-4 bg-white rounded-xl shadow-sm hover:shadow-md transition-shadow group">
<svg class="w-10 h-10 text-red-600 flex-shrink-0" fill="currentColor" viewBox="0 0 24 24"><path d="M14 2H6a2 2 0 00-2 2v16a2 2 0 002 2h12a2 2 0 002-2V8l-6-6zm-1 9V3.5L18.5 9H13zM8 13h8v2H8v-2zm0 4h8v2H8v-2zm0-8h2v2H8V9z"/></svg> <svg class="w-10 h-10 text-red-600 flex-shrink-0" fill="currentColor" viewBox="0 0 24 24"><path d="M14 2H6a2 2 0 00-2 2v16a2 2 0 002 2h12a2 2 0 002-2V8l-6-6zm-1 9V3.5L18.5 9H13zM8 13h8v2H8v-2zm0 4h8v2H8v-2zm0-8h2v2H8V9z"/></svg>
<div> <div>
<div class="font-semibold text-slate-900 group-hover:text-primary-600 transition-colors">ราคาสินค้า MECH V13-2021</div> <div class="font-semibold text-slate-900 group-hover:text-primary-600 transition-colors">ราคาสินค้า MECH V13-2021</div>
@@ -370,8 +370,8 @@ import BaseLayout from '@/layouts/BaseLayout.astro';
<h2 class="text-3xl font-bold mb-6">สนใจสินค้านี้?</h2> <h2 class="text-3xl font-bold mb-6">สนใจสินค้านี้?</h2>
<p class="text-lg text-primary-100 mb-8">ติดต่อเราวันนี้ 090-555-1415 หรือแอดไลน์ ID:JPPSELECTION</p> <p class="text-lg text-primary-100 mb-8">ติดต่อเราวันนี้ 090-555-1415 หรือแอดไลน์ ID:JPPSELECTION</p>
<div class="flex flex-wrap justify-center gap-4"> <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="/contact-us" data-umami-event="product-cta-contact" 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> <a href="https://line.me/ti/p/~JPPSELECTION" target="_blank" rel="noopener" data-umami-event="product-cta-line" class="bg-accent-500 hover:bg-accent-600 text-white py-3 px-8 rounded-xl font-semibold transition-colors">แอดไลน์</a>
</div> </div>
</div> </div>
</section> </main> </section> </main>