Add websites-for-local-bussiness.txt
This commit is contained in:
@@ -0,0 +1,141 @@
|
|||||||
|
I have a multi-page HTML website template (downloaded via HTTrack or similar).
|
||||||
|
The goal is to convert it into a clean, single-page website for a local service
|
||||||
|
business. Work through the following tasks in order. Use Linux/Bash tools (sed,
|
||||||
|
grep, python) — not PowerShell.
|
||||||
|
|
||||||
|
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
|
||||||
|
TASK 1 — FULL AUDIT
|
||||||
|
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
|
||||||
|
1a. List every HTML page and identify which are inner/detail pages we can drop.
|
||||||
|
1b. List all CSS and JS files in /assets. Confirm they are local — not CDN.
|
||||||
|
1c. Scan ALL files for any external cloud-hosted resources:
|
||||||
|
- Google Fonts @import in CSS
|
||||||
|
- CDN links in HTML (cdnjs, jsdelivr, unpkg, googleapis, etc.)
|
||||||
|
Download every external CSS/JS/font file locally and update the references.
|
||||||
|
1d. Map every unique section across all pages using the HTML comment labels
|
||||||
|
(e.g. "Banner Area", "Services Area", "Team Area") and list them.
|
||||||
|
|
||||||
|
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
|
||||||
|
TASK 2 — SECTION MAP & DECISION
|
||||||
|
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
|
||||||
|
Present a table of every section found with a KEEP / DROP recommendation for a
|
||||||
|
single-page local service business. The minimum sections to keep are:
|
||||||
|
|
||||||
|
KEEP:
|
||||||
|
- Hero / Banner (headline, subtext, CTA button)
|
||||||
|
- Services (3–6 service cards)
|
||||||
|
- How It Works / Work Process (3 steps)
|
||||||
|
- FAQ accordion
|
||||||
|
- Contact info (phone, address, hours) + map
|
||||||
|
- Footer or minimal copyright bar
|
||||||
|
|
||||||
|
DROP (unless client provides content):
|
||||||
|
- Team / Staff grid
|
||||||
|
- Portfolio / Projects gallery
|
||||||
|
- Blog / News
|
||||||
|
- Testimonial slider (keep only if client has real reviews)
|
||||||
|
- Subscribe / Newsletter
|
||||||
|
- Pricing plans
|
||||||
|
- Separate About, Services-details, Blog-details, Projects-details pages
|
||||||
|
|
||||||
|
Wait for confirmation before proceeding, or proceed with recommended minimum.
|
||||||
|
|
||||||
|
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
|
||||||
|
TASK 3 — BUILD SINGLE index.html
|
||||||
|
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
|
||||||
|
Work only on index.html. Remove all other .html files from scope.
|
||||||
|
|
||||||
|
3a. Remove all HTTrack mirror comments and ALL HTML comments from the file.
|
||||||
|
3b. Remove the entire navbar (header nav, mobile menu drawer, sidebar popup,
|
||||||
|
search overlay, overlay divs). Keep only logo if present.
|
||||||
|
3c. Remove all sections not in the KEEP list above.
|
||||||
|
3d. Remove the Subscribe / Newsletter section.
|
||||||
|
3e. Convert all CTA buttons ("Get a Quote", "Read More", "View More") to direct
|
||||||
|
phone call actions: href="tel:PHONENUMBER" with label "Call Now".
|
||||||
|
|
||||||
|
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
|
||||||
|
TASK 4 — CLIENT DETAILS
|
||||||
|
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
|
||||||
|
Replace ALL placeholder contact info and branding throughout the entire file
|
||||||
|
(title, meta, header, contact section, footer, sidebar, copyright):
|
||||||
|
|
||||||
|
Company name : [CLIENT COMPANY NAME]
|
||||||
|
Phone : [PHONE] → also update all tel: href values
|
||||||
|
Address : [ADDRESS]
|
||||||
|
Hours : [HOURS]
|
||||||
|
Email : [EMAIL or remove]
|
||||||
|
|
||||||
|
Grep for ALL of these patterns after replacing to confirm none remain:
|
||||||
|
- Old phone numbers
|
||||||
|
- Old addresses (street names, city, country)
|
||||||
|
- Old email addresses
|
||||||
|
- Template author name / theme name in meta tags
|
||||||
|
- Copyright year / template brand name in footer
|
||||||
|
|
||||||
|
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
|
||||||
|
TASK 5 — PLACEHOLDER TEXT SWEEP
|
||||||
|
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
|
||||||
|
Scan and replace every piece of template/dummy copy. Grep for:
|
||||||
|
lorem, ipsum, proin, nullam, phasellus, nec aliquet, molestie, feugiat,
|
||||||
|
euismod, aenean, dignissim, placeholder, "Plumbers provide essential",
|
||||||
|
"install, repair, and maint", "Website Lounged", "submit your report",
|
||||||
|
"New customization options", "Expanded compatibility", "Ask Question",
|
||||||
|
any generic job titles unrelated to the business (e.g. "Co Founder",
|
||||||
|
"Marketing Coordinator", "Development Manager")
|
||||||
|
|
||||||
|
For every match, write real copy based on the client's business, city, and
|
||||||
|
service type. Replace ALL identical repeated descriptions with unique text.
|
||||||
|
|
||||||
|
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
|
||||||
|
TASK 6 — BROKEN LINK CLEANUP
|
||||||
|
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
|
||||||
|
Grep for every href pointing to a .html page or external URL:
|
||||||
|
- Internal .html links (about.html, services.html, blog-*.html, etc.)
|
||||||
|
→ replace with # or relevant anchor (#services, #faq, #contact)
|
||||||
|
- Social media placeholder links (facebook.com/, twitter.com/ generic)
|
||||||
|
→ replace with # until client provides real profile URLs
|
||||||
|
- Google Maps placeholder links
|
||||||
|
→ replace with real coordinates link
|
||||||
|
- Privacy/Terms links pointing to non-existent pages → replace with #
|
||||||
|
- Any remaining index2.html, 404-error.html, contact-two.html → remove
|
||||||
|
|
||||||
|
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
|
||||||
|
TASK 7 — MAP (Leaflet + Esri World Light Gray)
|
||||||
|
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
|
||||||
|
Replace any existing map iframe or map section with a Leaflet.js map.
|
||||||
|
Download Leaflet locally (no CDN at runtime):
|
||||||
|
- assets/css/leaflet.css
|
||||||
|
- assets/js/leaflet.js
|
||||||
|
(from https://unpkg.com/leaflet@1.9.4/dist/)
|
||||||
|
|
||||||
|
Place the map in the RIGHT column of the contact section, replacing the
|
||||||
|
contact form. Left column keeps phone, address, and hours.
|
||||||
|
|
||||||
|
Map config:
|
||||||
|
- Tile provider : Esri World Light Gray (minimal, Apple Maps-like aesthetic)
|
||||||
|
URL: https://server.arcgisonline.com/ArcGIS/rest/services/Canvas/
|
||||||
|
World_Light_Gray_Base/MapServer/tile/{z}/{y}/{x}
|
||||||
|
- Marker : custom red CSS circle via L.divIcon (no default blue pin)
|
||||||
|
html: '<div style="width:16px;height:16px;background:#e52222;
|
||||||
|
border:3px solid #fff;border-radius:50%;
|
||||||
|
box-shadow:0 2px 8px rgba(229,34,34,0.5);"></div>'
|
||||||
|
- scrollWheelZoom: false (better UX on scrollable page)
|
||||||
|
- Popup on marker: company name, address, clickable phone number
|
||||||
|
- Map height: 430px, border-radius: 10px
|
||||||
|
- Coordinates: [LAT, LNG] from client address
|
||||||
|
|
||||||
|
Add leaflet.css in <head>. Add leaflet.js + inline init script just before
|
||||||
|
</body>. Use single-quoted JS strings to avoid HTML quote escaping issues.
|
||||||
|
|
||||||
|
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
|
||||||
|
TASK 8 — FINAL VERIFICATION
|
||||||
|
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
|
||||||
|
Run a final grep pass and confirm ZERO matches for:
|
||||||
|
✗ Any .html page links (except index.html logo link)
|
||||||
|
✗ Placeholder/lorem text
|
||||||
|
✗ Old phone/address/email
|
||||||
|
✗ Template brand names (theme author, demo site URL)
|
||||||
|
✗ HTML comments
|
||||||
|
✗ CDN/cloud JS or CSS links (except tile server URLs which are runtime)
|
||||||
|
✗ Generic social media links (href="https://facebook.com/")
|
||||||
|
✗ Broken section titles unrelated to the business
|
||||||
Reference in New Issue
Block a user