@ucptools/validator 1.0.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CLAUDE.md +109 -0
- package/CONTRIBUTING.md +113 -0
- package/LICENSE +21 -0
- package/README.md +203 -0
- package/api/analyze-feed.js +140 -0
- package/api/badge.js +185 -0
- package/api/benchmark.js +177 -0
- package/api/directory-stats.ts +29 -0
- package/api/directory.ts +73 -0
- package/api/generate-compliance.js +143 -0
- package/api/generate-schema.js +457 -0
- package/api/generate.js +132 -0
- package/api/security-scan.js +133 -0
- package/api/simulate.js +187 -0
- package/api/tsconfig.json +10 -0
- package/api/validate.js +1351 -0
- package/apify-actor/.actor/actor.json +68 -0
- package/apify-actor/.actor/input_schema.json +32 -0
- package/apify-actor/APIFY-STORE-LISTING.md +412 -0
- package/apify-actor/Dockerfile +8 -0
- package/apify-actor/README.md +166 -0
- package/apify-actor/main.ts +111 -0
- package/apify-actor/package.json +17 -0
- package/apify-actor/src/main.js +199 -0
- package/docs/BRAND-IDENTITY.md +238 -0
- package/docs/BRAND-STYLE-GUIDE.md +356 -0
- package/drizzle/0000_black_king_cobra.sql +39 -0
- package/drizzle/meta/0000_snapshot.json +309 -0
- package/drizzle/meta/_journal.json +13 -0
- package/drizzle.config.ts +10 -0
- package/examples/full-profile.json +70 -0
- package/examples/minimal-profile.json +23 -0
- package/package.json +69 -0
- package/public/.well-known/ucp +25 -0
- package/public/android-chrome-192x192.png +0 -0
- package/public/android-chrome-512x512.png +0 -0
- package/public/apple-touch-icon.png +0 -0
- package/public/brand.css +321 -0
- package/public/directory.html +701 -0
- package/public/favicon-16x16.png +0 -0
- package/public/favicon-32x32.png +0 -0
- package/public/favicon.ico +0 -0
- package/public/guides/bigcommerce.html +743 -0
- package/public/guides/fastucp.html +838 -0
- package/public/guides/magento.html +779 -0
- package/public/guides/shopify.html +726 -0
- package/public/guides/squarespace.html +749 -0
- package/public/guides/wix.html +747 -0
- package/public/guides/woocommerce.html +733 -0
- package/public/index.html +3835 -0
- package/public/learn.html +396 -0
- package/public/logo.jpeg +0 -0
- package/public/og-image-icon.png +0 -0
- package/public/og-image.png +0 -0
- package/public/robots.txt +6 -0
- package/public/site.webmanifest +31 -0
- package/public/sitemap.xml +69 -0
- package/public/social/linkedin-banner-1128x191.png +0 -0
- package/public/social/temp.PNG +0 -0
- package/public/social/x-header-1500x500.png +0 -0
- package/public/verify.html +410 -0
- package/scripts/generate-favicons.js +44 -0
- package/scripts/generate-ico.js +23 -0
- package/scripts/generate-og-image.js +45 -0
- package/scripts/reset-db.ts +77 -0
- package/scripts/seed-db.ts +71 -0
- package/scripts/setup-benchmark-db.js +70 -0
- package/src/api/server.ts +266 -0
- package/src/cli/index.ts +302 -0
- package/src/compliance/compliance-generator.ts +452 -0
- package/src/compliance/index.ts +28 -0
- package/src/compliance/templates.ts +338 -0
- package/src/compliance/types.ts +170 -0
- package/src/db/index.ts +28 -0
- package/src/db/schema.ts +84 -0
- package/src/feed-analyzer/feed-analyzer.ts +726 -0
- package/src/feed-analyzer/index.ts +34 -0
- package/src/feed-analyzer/types.ts +354 -0
- package/src/generator/index.ts +7 -0
- package/src/generator/key-generator.ts +124 -0
- package/src/generator/profile-builder.ts +402 -0
- package/src/hosting/artifacts-generator.ts +679 -0
- package/src/hosting/index.ts +6 -0
- package/src/index.ts +105 -0
- package/src/security/index.ts +15 -0
- package/src/security/security-scanner.ts +604 -0
- package/src/security/types.ts +55 -0
- package/src/services/directory.ts +434 -0
- package/src/simulator/agent-simulator.ts +941 -0
- package/src/simulator/index.ts +7 -0
- package/src/simulator/types.ts +170 -0
- package/src/types/generator.ts +140 -0
- package/src/types/index.ts +7 -0
- package/src/types/ucp-profile.ts +140 -0
- package/src/types/validation.ts +89 -0
- package/src/validator/index.ts +194 -0
- package/src/validator/network-validator.ts +417 -0
- package/src/validator/rules-validator.ts +297 -0
- package/src/validator/sdk-validator.ts +330 -0
- package/src/validator/structural-validator.ts +476 -0
- package/tests/fixtures/non-compliant-profile.json +25 -0
- package/tests/fixtures/official-sample-profile.json +75 -0
- package/tests/integration/benchmark.test.ts +207 -0
- package/tests/integration/database.test.ts +163 -0
- package/tests/integration/directory-api.test.ts +268 -0
- package/tests/integration/simulate-api.test.ts +230 -0
- package/tests/integration/validate-api.test.ts +269 -0
- package/tests/setup.ts +15 -0
- package/tests/unit/agent-simulator.test.ts +575 -0
- package/tests/unit/compliance-generator.test.ts +374 -0
- package/tests/unit/directory-service.test.ts +272 -0
- package/tests/unit/feed-analyzer.test.ts +517 -0
- package/tests/unit/lint-suggestions.test.ts +423 -0
- package/tests/unit/official-samples.test.ts +211 -0
- package/tests/unit/pdf-report.test.ts +390 -0
- package/tests/unit/sdk-validator.test.ts +531 -0
- package/tests/unit/security-scanner.test.ts +410 -0
- package/tests/unit/validation.test.ts +390 -0
- package/tsconfig.json +20 -0
- package/vercel.json +34 -0
- package/vitest.config.ts +22 -0
|
@@ -0,0 +1,749 @@
|
|
|
1
|
+
<!DOCTYPE html>
|
|
2
|
+
<html lang="en">
|
|
3
|
+
|
|
4
|
+
<head>
|
|
5
|
+
<!-- Google Analytics -->
|
|
6
|
+
<script async src="https://www.googletagmanager.com/gtag/js?id=G-J5JSHV7H1E"></script>
|
|
7
|
+
<script>
|
|
8
|
+
window.dataLayer = window.dataLayer || [];
|
|
9
|
+
function gtag() { dataLayer.push(arguments); }
|
|
10
|
+
gtag('js', new Date());
|
|
11
|
+
gtag('config', 'G-J5JSHV7H1E');
|
|
12
|
+
</script>
|
|
13
|
+
<meta charset="UTF-8">
|
|
14
|
+
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
15
|
+
<title>Squarespace UCP Implementation Guide - AI Commerce Ready | UCP Tools</title>
|
|
16
|
+
<meta name="description"
|
|
17
|
+
content="Step-by-step guide to implementing UCP (Universal Commerce Protocol) on Squarespace. Make your beautiful store AI-ready for ChatGPT and AI shopping agents.">
|
|
18
|
+
<link rel="canonical" href="https://ucptools.dev/guides/squarespace">
|
|
19
|
+
<link rel="icon" type="image/x-icon" href="/favicon.ico">
|
|
20
|
+
<link rel="icon" type="image/png" sizes="32x32" href="/favicon-32x32.png">
|
|
21
|
+
<link rel="icon" type="image/png" sizes="16x16" href="/favicon-16x16.png">
|
|
22
|
+
<link rel="apple-touch-icon" sizes="180x180" href="/apple-touch-icon.png">
|
|
23
|
+
<link rel="manifest" href="/site.webmanifest">
|
|
24
|
+
<meta name="theme-color" content="#000000">
|
|
25
|
+
<meta property="og:title" content="Squarespace UCP Implementation Guide - AI Commerce Ready">
|
|
26
|
+
<meta property="og:description"
|
|
27
|
+
content="Make your Squarespace store AI-ready with UCP. Simple implementation guide.">
|
|
28
|
+
<meta property="og:image" content="/og-image.png">
|
|
29
|
+
<meta property="og:type" content="article">
|
|
30
|
+
|
|
31
|
+
<!-- Google Fonts -->
|
|
32
|
+
<link rel="preconnect" href="https://fonts.googleapis.com">
|
|
33
|
+
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
|
|
34
|
+
<link
|
|
35
|
+
href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&family=Fira+Code:wght@400;500&display=swap"
|
|
36
|
+
rel="stylesheet">
|
|
37
|
+
|
|
38
|
+
<style>
|
|
39
|
+
:root {
|
|
40
|
+
--brand-blue: #2E86AB;
|
|
41
|
+
--brand-teal: #36B5A2;
|
|
42
|
+
--brand-green: #47C97A;
|
|
43
|
+
--brand-gradient: linear-gradient(135deg, #2E86AB 0%, #36B5A2 50%, #47C97A 100%);
|
|
44
|
+
--platform-color: #000000;
|
|
45
|
+
--platform-accent: #111111;
|
|
46
|
+
--color-dark: #1A2B3C;
|
|
47
|
+
--color-medium: #5A6978;
|
|
48
|
+
--color-light: #94A3B8;
|
|
49
|
+
--color-border: #E2E8F0;
|
|
50
|
+
--color-background: #F8FAFC;
|
|
51
|
+
--color-card: #FFFFFF;
|
|
52
|
+
--color-success: #47C97A;
|
|
53
|
+
--color-warning: #F59E0B;
|
|
54
|
+
--color-error: #EF4444;
|
|
55
|
+
--color-info: #2E86AB;
|
|
56
|
+
}
|
|
57
|
+
|
|
58
|
+
* { box-sizing: border-box; margin: 0; padding: 0; }
|
|
59
|
+
|
|
60
|
+
body {
|
|
61
|
+
font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
|
|
62
|
+
background: var(--color-background);
|
|
63
|
+
color: var(--color-dark);
|
|
64
|
+
line-height: 1.6;
|
|
65
|
+
min-height: 100vh;
|
|
66
|
+
}
|
|
67
|
+
|
|
68
|
+
a { color: var(--brand-blue); text-decoration: none; }
|
|
69
|
+
a:hover { text-decoration: underline; }
|
|
70
|
+
|
|
71
|
+
.container { max-width: 1200px; margin: 0 auto; padding: 0 20px; }
|
|
72
|
+
|
|
73
|
+
header {
|
|
74
|
+
background: var(--color-card);
|
|
75
|
+
border-bottom: 1px solid var(--color-border);
|
|
76
|
+
padding: 16px 0;
|
|
77
|
+
position: sticky;
|
|
78
|
+
top: 0;
|
|
79
|
+
z-index: 1000;
|
|
80
|
+
}
|
|
81
|
+
|
|
82
|
+
.header-inner {
|
|
83
|
+
display: flex;
|
|
84
|
+
justify-content: space-between;
|
|
85
|
+
align-items: center;
|
|
86
|
+
max-width: 1200px;
|
|
87
|
+
margin: 0 auto;
|
|
88
|
+
padding: 0 20px;
|
|
89
|
+
}
|
|
90
|
+
|
|
91
|
+
.logo {
|
|
92
|
+
display: flex;
|
|
93
|
+
align-items: center;
|
|
94
|
+
gap: 12px;
|
|
95
|
+
font-size: 24px;
|
|
96
|
+
font-weight: 700;
|
|
97
|
+
text-decoration: none;
|
|
98
|
+
}
|
|
99
|
+
|
|
100
|
+
.logo:hover { text-decoration: none; }
|
|
101
|
+
.logo-icon { width: 40px; height: 40px; border-radius: 8px; }
|
|
102
|
+
|
|
103
|
+
.logo-text {
|
|
104
|
+
background: var(--brand-gradient);
|
|
105
|
+
-webkit-background-clip: text;
|
|
106
|
+
-webkit-text-fill-color: transparent;
|
|
107
|
+
background-clip: text;
|
|
108
|
+
}
|
|
109
|
+
|
|
110
|
+
.logo-suffix { font-weight: 400; -webkit-text-fill-color: var(--color-medium); }
|
|
111
|
+
|
|
112
|
+
nav { display: flex; gap: 8px; }
|
|
113
|
+
|
|
114
|
+
nav a {
|
|
115
|
+
padding: 8px 16px;
|
|
116
|
+
color: var(--color-medium);
|
|
117
|
+
text-decoration: none;
|
|
118
|
+
font-weight: 500;
|
|
119
|
+
border-radius: 6px;
|
|
120
|
+
transition: all 0.2s;
|
|
121
|
+
}
|
|
122
|
+
|
|
123
|
+
nav a:hover {
|
|
124
|
+
color: var(--brand-blue);
|
|
125
|
+
background: rgba(46, 134, 171, 0.08);
|
|
126
|
+
text-decoration: none;
|
|
127
|
+
}
|
|
128
|
+
|
|
129
|
+
nav a.active {
|
|
130
|
+
color: var(--brand-blue);
|
|
131
|
+
background: rgba(46, 134, 171, 0.12);
|
|
132
|
+
}
|
|
133
|
+
|
|
134
|
+
.guide-hero {
|
|
135
|
+
background: linear-gradient(135deg, #000000 0%, #1a1a1a 50%, #333333 100%);
|
|
136
|
+
color: white;
|
|
137
|
+
padding: 80px 0;
|
|
138
|
+
}
|
|
139
|
+
|
|
140
|
+
.guide-hero .container { max-width: 800px; }
|
|
141
|
+
|
|
142
|
+
.guide-hero h1 {
|
|
143
|
+
font-size: 2.75rem;
|
|
144
|
+
font-weight: 700;
|
|
145
|
+
margin-bottom: 16px;
|
|
146
|
+
line-height: 1.2;
|
|
147
|
+
}
|
|
148
|
+
|
|
149
|
+
.guide-hero p {
|
|
150
|
+
font-size: 1.25rem;
|
|
151
|
+
opacity: 0.9;
|
|
152
|
+
line-height: 1.6;
|
|
153
|
+
margin-bottom: 24px;
|
|
154
|
+
}
|
|
155
|
+
|
|
156
|
+
.guide-badges { display: flex; gap: 12px; flex-wrap: wrap; }
|
|
157
|
+
|
|
158
|
+
.guide-badge {
|
|
159
|
+
background: rgba(255, 255, 255, 0.15);
|
|
160
|
+
backdrop-filter: blur(10px);
|
|
161
|
+
padding: 8px 16px;
|
|
162
|
+
border-radius: 24px;
|
|
163
|
+
font-size: 0.9rem;
|
|
164
|
+
font-weight: 500;
|
|
165
|
+
border: 1px solid rgba(255, 255, 255, 0.1);
|
|
166
|
+
}
|
|
167
|
+
|
|
168
|
+
.guide-content {
|
|
169
|
+
display: grid;
|
|
170
|
+
grid-template-columns: 1fr 260px;
|
|
171
|
+
gap: 60px;
|
|
172
|
+
max-width: 1100px;
|
|
173
|
+
margin: 0 auto;
|
|
174
|
+
padding: 60px 20px;
|
|
175
|
+
}
|
|
176
|
+
|
|
177
|
+
@media (max-width: 968px) {
|
|
178
|
+
.guide-content { grid-template-columns: 1fr; gap: 40px; }
|
|
179
|
+
.guide-sidebar { order: -1; }
|
|
180
|
+
}
|
|
181
|
+
|
|
182
|
+
@media (max-width: 600px) {
|
|
183
|
+
.guide-hero h1 { font-size: 2rem; }
|
|
184
|
+
.guide-hero p { font-size: 1.1rem; }
|
|
185
|
+
.header-inner { flex-direction: column; gap: 16px; }
|
|
186
|
+
nav { flex-wrap: wrap; justify-content: center; }
|
|
187
|
+
}
|
|
188
|
+
|
|
189
|
+
.guide-main section { margin-bottom: 48px; }
|
|
190
|
+
|
|
191
|
+
.guide-main h2 {
|
|
192
|
+
color: var(--color-dark);
|
|
193
|
+
font-size: 1.75rem;
|
|
194
|
+
font-weight: 700;
|
|
195
|
+
margin-bottom: 20px;
|
|
196
|
+
padding-bottom: 12px;
|
|
197
|
+
border-bottom: 2px solid var(--color-border);
|
|
198
|
+
}
|
|
199
|
+
|
|
200
|
+
.guide-main h3 {
|
|
201
|
+
font-size: 1.25rem;
|
|
202
|
+
font-weight: 600;
|
|
203
|
+
margin: 32px 0 16px;
|
|
204
|
+
color: var(--color-dark);
|
|
205
|
+
}
|
|
206
|
+
|
|
207
|
+
.guide-main p {
|
|
208
|
+
margin-bottom: 16px;
|
|
209
|
+
color: var(--color-medium);
|
|
210
|
+
font-size: 1.05rem;
|
|
211
|
+
line-height: 1.7;
|
|
212
|
+
}
|
|
213
|
+
|
|
214
|
+
.guide-main ul, .guide-main ol { margin-bottom: 20px; padding-left: 24px; }
|
|
215
|
+
|
|
216
|
+
.guide-main li {
|
|
217
|
+
margin-bottom: 10px;
|
|
218
|
+
color: var(--color-medium);
|
|
219
|
+
line-height: 1.6;
|
|
220
|
+
}
|
|
221
|
+
|
|
222
|
+
.guide-main li strong { color: var(--color-dark); }
|
|
223
|
+
|
|
224
|
+
pre {
|
|
225
|
+
background: #1e1e1e;
|
|
226
|
+
color: #d4d4d4;
|
|
227
|
+
padding: 24px;
|
|
228
|
+
border-radius: 12px;
|
|
229
|
+
overflow-x: auto;
|
|
230
|
+
margin: 20px 0;
|
|
231
|
+
font-family: 'Fira Code', 'Monaco', 'Consolas', monospace;
|
|
232
|
+
font-size: 0.9rem;
|
|
233
|
+
line-height: 1.6;
|
|
234
|
+
border: 1px solid #333;
|
|
235
|
+
}
|
|
236
|
+
|
|
237
|
+
code { font-family: 'Fira Code', 'Monaco', 'Consolas', monospace; }
|
|
238
|
+
|
|
239
|
+
:not(pre)>code {
|
|
240
|
+
background: #EEF2F6;
|
|
241
|
+
padding: 3px 8px;
|
|
242
|
+
border-radius: 6px;
|
|
243
|
+
font-size: 0.9em;
|
|
244
|
+
color: #333;
|
|
245
|
+
font-weight: 500;
|
|
246
|
+
}
|
|
247
|
+
|
|
248
|
+
.step-number {
|
|
249
|
+
display: inline-flex;
|
|
250
|
+
align-items: center;
|
|
251
|
+
justify-content: center;
|
|
252
|
+
width: 32px;
|
|
253
|
+
height: 32px;
|
|
254
|
+
background: var(--platform-color);
|
|
255
|
+
color: white;
|
|
256
|
+
border-radius: 50%;
|
|
257
|
+
font-weight: 700;
|
|
258
|
+
font-size: 0.9rem;
|
|
259
|
+
margin-right: 12px;
|
|
260
|
+
}
|
|
261
|
+
|
|
262
|
+
.step-title {
|
|
263
|
+
display: flex;
|
|
264
|
+
align-items: center;
|
|
265
|
+
font-size: 1.25rem;
|
|
266
|
+
font-weight: 600;
|
|
267
|
+
margin: 32px 0 16px;
|
|
268
|
+
color: var(--color-dark);
|
|
269
|
+
}
|
|
270
|
+
|
|
271
|
+
.tip-box {
|
|
272
|
+
background: #EFF6FF;
|
|
273
|
+
border-left: 4px solid var(--brand-blue);
|
|
274
|
+
padding: 20px 24px;
|
|
275
|
+
border-radius: 0 12px 12px 0;
|
|
276
|
+
margin: 24px 0;
|
|
277
|
+
}
|
|
278
|
+
|
|
279
|
+
.tip-box.warning { background: #FEF3C7; border-color: var(--color-warning); }
|
|
280
|
+
.tip-box.success { background: #DCFCE7; border-color: var(--color-success); }
|
|
281
|
+
.tip-box.platform { background: #F5F5F5; border-color: var(--platform-color); }
|
|
282
|
+
|
|
283
|
+
.tip-box strong {
|
|
284
|
+
display: block;
|
|
285
|
+
margin-bottom: 6px;
|
|
286
|
+
color: var(--color-dark);
|
|
287
|
+
font-size: 1rem;
|
|
288
|
+
}
|
|
289
|
+
|
|
290
|
+
.tip-box p, .tip-box { color: var(--color-medium); font-size: 0.95rem; }
|
|
291
|
+
|
|
292
|
+
.cta-box {
|
|
293
|
+
background: var(--brand-gradient);
|
|
294
|
+
color: white;
|
|
295
|
+
padding: 40px;
|
|
296
|
+
border-radius: 16px;
|
|
297
|
+
text-align: center;
|
|
298
|
+
margin: 32px 0;
|
|
299
|
+
box-shadow: 0 8px 32px rgba(46, 134, 171, 0.25);
|
|
300
|
+
}
|
|
301
|
+
|
|
302
|
+
.cta-box h3 { color: white; font-size: 1.5rem; margin-bottom: 12px; }
|
|
303
|
+
.cta-box p { color: rgba(255, 255, 255, 0.9); margin-bottom: 24px; font-size: 1.05rem; }
|
|
304
|
+
|
|
305
|
+
.cta-box .btn {
|
|
306
|
+
background: white;
|
|
307
|
+
color: var(--brand-blue);
|
|
308
|
+
padding: 14px 32px;
|
|
309
|
+
border-radius: 8px;
|
|
310
|
+
text-decoration: none;
|
|
311
|
+
font-weight: 600;
|
|
312
|
+
font-size: 1rem;
|
|
313
|
+
display: inline-block;
|
|
314
|
+
transition: all 0.2s;
|
|
315
|
+
box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
|
|
316
|
+
}
|
|
317
|
+
|
|
318
|
+
.cta-box .btn:hover {
|
|
319
|
+
transform: translateY(-2px);
|
|
320
|
+
box-shadow: 0 6px 20px rgba(0, 0, 0, 0.2);
|
|
321
|
+
text-decoration: none;
|
|
322
|
+
}
|
|
323
|
+
|
|
324
|
+
table {
|
|
325
|
+
width: 100%;
|
|
326
|
+
border-collapse: collapse;
|
|
327
|
+
margin: 20px 0;
|
|
328
|
+
background: var(--color-card);
|
|
329
|
+
border-radius: 12px;
|
|
330
|
+
overflow: hidden;
|
|
331
|
+
border: 1px solid var(--color-border);
|
|
332
|
+
}
|
|
333
|
+
|
|
334
|
+
th, td {
|
|
335
|
+
text-align: left;
|
|
336
|
+
padding: 16px 20px;
|
|
337
|
+
border-bottom: 1px solid var(--color-border);
|
|
338
|
+
}
|
|
339
|
+
|
|
340
|
+
th { background: var(--color-background); font-weight: 600; color: var(--color-dark); }
|
|
341
|
+
tr:last-child td { border-bottom: none; }
|
|
342
|
+
td code { background: #EEF2F6; padding: 4px 8px; border-radius: 4px; }
|
|
343
|
+
|
|
344
|
+
.guide-sidebar { position: sticky; top: 100px; align-self: start; }
|
|
345
|
+
|
|
346
|
+
.sidebar-toc {
|
|
347
|
+
background: var(--color-card);
|
|
348
|
+
border: 1px solid var(--color-border);
|
|
349
|
+
border-radius: 12px;
|
|
350
|
+
padding: 24px;
|
|
351
|
+
}
|
|
352
|
+
|
|
353
|
+
.sidebar-toc h4 {
|
|
354
|
+
font-size: 0.8rem;
|
|
355
|
+
text-transform: uppercase;
|
|
356
|
+
letter-spacing: 1px;
|
|
357
|
+
color: var(--color-light);
|
|
358
|
+
margin-bottom: 16px;
|
|
359
|
+
font-weight: 600;
|
|
360
|
+
}
|
|
361
|
+
|
|
362
|
+
.sidebar-toc ul { list-style: none; padding: 0; margin: 0; }
|
|
363
|
+
.sidebar-toc li { margin-bottom: 0; }
|
|
364
|
+
|
|
365
|
+
.sidebar-toc a {
|
|
366
|
+
display: block;
|
|
367
|
+
padding: 10px 12px;
|
|
368
|
+
color: var(--color-medium);
|
|
369
|
+
text-decoration: none;
|
|
370
|
+
font-size: 0.9rem;
|
|
371
|
+
border-radius: 6px;
|
|
372
|
+
transition: all 0.2s;
|
|
373
|
+
}
|
|
374
|
+
|
|
375
|
+
.sidebar-toc a:hover {
|
|
376
|
+
color: var(--platform-color);
|
|
377
|
+
background: rgba(0, 0, 0, 0.05);
|
|
378
|
+
text-decoration: none;
|
|
379
|
+
}
|
|
380
|
+
|
|
381
|
+
.other-guides {
|
|
382
|
+
margin-top: 24px;
|
|
383
|
+
padding-top: 24px;
|
|
384
|
+
border-top: 1px solid var(--color-border);
|
|
385
|
+
}
|
|
386
|
+
|
|
387
|
+
.other-guides h4 {
|
|
388
|
+
font-size: 0.8rem;
|
|
389
|
+
text-transform: uppercase;
|
|
390
|
+
letter-spacing: 1px;
|
|
391
|
+
color: var(--color-light);
|
|
392
|
+
margin-bottom: 12px;
|
|
393
|
+
font-weight: 600;
|
|
394
|
+
}
|
|
395
|
+
|
|
396
|
+
.other-guides a {
|
|
397
|
+
display: block;
|
|
398
|
+
padding: 8px 12px;
|
|
399
|
+
color: var(--color-medium);
|
|
400
|
+
font-size: 0.85rem;
|
|
401
|
+
border-radius: 6px;
|
|
402
|
+
transition: all 0.2s;
|
|
403
|
+
}
|
|
404
|
+
|
|
405
|
+
.other-guides a:hover {
|
|
406
|
+
color: var(--brand-blue);
|
|
407
|
+
background: rgba(46, 134, 171, 0.08);
|
|
408
|
+
text-decoration: none;
|
|
409
|
+
}
|
|
410
|
+
|
|
411
|
+
footer {
|
|
412
|
+
background: var(--color-dark);
|
|
413
|
+
color: white;
|
|
414
|
+
padding: 48px 0;
|
|
415
|
+
margin-top: 60px;
|
|
416
|
+
text-align: center;
|
|
417
|
+
}
|
|
418
|
+
|
|
419
|
+
footer p { margin: 0; opacity: 0.9; }
|
|
420
|
+
footer a { color: var(--brand-teal); }
|
|
421
|
+
footer a:hover { color: var(--brand-green); }
|
|
422
|
+
.footer-links { margin-top: 12px; opacity: 0.7; }
|
|
423
|
+
</style>
|
|
424
|
+
</head>
|
|
425
|
+
|
|
426
|
+
<body>
|
|
427
|
+
<header>
|
|
428
|
+
<div class="header-inner">
|
|
429
|
+
<a href="/" class="logo">
|
|
430
|
+
<img src="/logo.jpeg" alt="UCP.tools logo" class="logo-icon">
|
|
431
|
+
<span class="logo-text">UCP<span class="logo-suffix">.tools</span></span>
|
|
432
|
+
</a>
|
|
433
|
+
<nav>
|
|
434
|
+
<a href="/">Validator</a>
|
|
435
|
+
<a href="/learn">Learn</a>
|
|
436
|
+
<a href="/directory">Directory</a>
|
|
437
|
+
<a href="/guides/squarespace" class="active">Squarespace</a>
|
|
438
|
+
</nav>
|
|
439
|
+
</div>
|
|
440
|
+
</header>
|
|
441
|
+
|
|
442
|
+
<div class="guide-hero">
|
|
443
|
+
<div class="container">
|
|
444
|
+
<h1>◼️ Squarespace UCP Implementation</h1>
|
|
445
|
+
<p>Make your beautiful Squarespace store AI-ready. Enable ChatGPT, Google AI Mode, and AI shopping agents to discover and purchase from your store.</p>
|
|
446
|
+
<div class="guide-badges">
|
|
447
|
+
<span class="guide-badge">🤖 AI Agent Ready</span>
|
|
448
|
+
<span class="guide-badge">🎨 Design First</span>
|
|
449
|
+
<span class="guide-badge">📄 Code Injection</span>
|
|
450
|
+
<span class="guide-badge">🔒 Secure</span>
|
|
451
|
+
</div>
|
|
452
|
+
</div>
|
|
453
|
+
</div>
|
|
454
|
+
|
|
455
|
+
<div class="guide-content">
|
|
456
|
+
<main class="guide-main">
|
|
457
|
+
<section id="overview">
|
|
458
|
+
<h2>Why Add UCP to Squarespace?</h2>
|
|
459
|
+
<p>
|
|
460
|
+
Squarespace is known for beautiful, design-forward websites. Adding UCP support extends your stunning store to AI shopping agents, allowing ChatGPT, Google AI, and other AI assistants to discover and recommend your products.
|
|
461
|
+
</p>
|
|
462
|
+
<ul>
|
|
463
|
+
<li><strong>Design Excellence:</strong> Your beautiful products deserve AI visibility</li>
|
|
464
|
+
<li><strong>Code Injection:</strong> Add custom functionality without compromising design</li>
|
|
465
|
+
<li><strong>Built-in Commerce:</strong> Squarespace Commerce integrates seamlessly</li>
|
|
466
|
+
<li><strong>SEO Focus:</strong> Already optimized, now AI-optimized too</li>
|
|
467
|
+
</ul>
|
|
468
|
+
|
|
469
|
+
<div class="tip-box platform">
|
|
470
|
+
<strong>◼️ Squarespace Limitation</strong>
|
|
471
|
+
Squarespace doesn't support serving files from <code>/.well-known/</code> directly. We'll use a workaround with external hosting and a custom page approach.
|
|
472
|
+
</div>
|
|
473
|
+
</section>
|
|
474
|
+
|
|
475
|
+
<section id="methods">
|
|
476
|
+
<h2>Implementation Methods</h2>
|
|
477
|
+
|
|
478
|
+
<table>
|
|
479
|
+
<tr>
|
|
480
|
+
<th>Method</th>
|
|
481
|
+
<th>Difficulty</th>
|
|
482
|
+
<th>Requirements</th>
|
|
483
|
+
</tr>
|
|
484
|
+
<tr>
|
|
485
|
+
<td><strong>External Hosting + Redirect</strong></td>
|
|
486
|
+
<td>Easy</td>
|
|
487
|
+
<td>Custom domain, external host</td>
|
|
488
|
+
</tr>
|
|
489
|
+
<tr>
|
|
490
|
+
<td><strong>Code Injection Page</strong></td>
|
|
491
|
+
<td>Medium</td>
|
|
492
|
+
<td>Business plan or higher</td>
|
|
493
|
+
</tr>
|
|
494
|
+
<tr>
|
|
495
|
+
<td><strong>Cloudflare Worker</strong></td>
|
|
496
|
+
<td>Medium</td>
|
|
497
|
+
<td>Cloudflare DNS</td>
|
|
498
|
+
</tr>
|
|
499
|
+
</table>
|
|
500
|
+
</section>
|
|
501
|
+
|
|
502
|
+
<section id="external-method">
|
|
503
|
+
<h2>Method 1: External Hosting (Recommended)</h2>
|
|
504
|
+
<p>Host your UCP profile externally and redirect requests to it.</p>
|
|
505
|
+
|
|
506
|
+
<div class="step-title"><span class="step-number">1</span>Generate Your UCP Profile</div>
|
|
507
|
+
|
|
508
|
+
<div class="cta-box">
|
|
509
|
+
<h3>Generate Your UCP Profile</h3>
|
|
510
|
+
<p>Create a customized UCP profile for your Squarespace store.</p>
|
|
511
|
+
<a href="/#generate" class="btn">Open Generator →</a>
|
|
512
|
+
</div>
|
|
513
|
+
|
|
514
|
+
<div class="step-title"><span class="step-number">2</span>Host Your Profile</div>
|
|
515
|
+
<p>Upload your UCP JSON file to one of these free services:</p>
|
|
516
|
+
|
|
517
|
+
<h3>Option A: GitHub Gist (Free)</h3>
|
|
518
|
+
<ol>
|
|
519
|
+
<li>Go to <a href="https://gist.github.com" target="_blank">gist.github.com</a></li>
|
|
520
|
+
<li>Create a new gist with your UCP JSON</li>
|
|
521
|
+
<li>Click "Raw" to get the direct URL</li>
|
|
522
|
+
</ol>
|
|
523
|
+
|
|
524
|
+
<h3>Option B: JSONBin (Free)</h3>
|
|
525
|
+
<ol>
|
|
526
|
+
<li>Go to <a href="https://jsonbin.io" target="_blank">jsonbin.io</a></li>
|
|
527
|
+
<li>Create an account and paste your JSON</li>
|
|
528
|
+
<li>Get the public access URL</li>
|
|
529
|
+
</ol>
|
|
530
|
+
|
|
531
|
+
<h3>Option C: Vercel (Free)</h3>
|
|
532
|
+
<pre><span style="color:#6A9955"># Create a simple project</span>
|
|
533
|
+
mkdir ucp-profile && cd ucp-profile
|
|
534
|
+
echo '{}' > vercel.json
|
|
535
|
+
|
|
536
|
+
<span style="color:#6A9955"># Create public/.well-known/ucp file with your JSON</span>
|
|
537
|
+
mkdir -p public/.well-known
|
|
538
|
+
<span style="color:#6A9955"># Copy your ucp.json content to public/.well-known/ucp</span>
|
|
539
|
+
|
|
540
|
+
<span style="color:#6A9955"># Deploy</span>
|
|
541
|
+
vercel --prod</pre>
|
|
542
|
+
|
|
543
|
+
<div class="step-title"><span class="step-number">3</span>Set Up DNS Redirect</div>
|
|
544
|
+
<p>If you're using Cloudflare or another DNS provider that supports Page Rules or Workers:</p>
|
|
545
|
+
|
|
546
|
+
<h3>Cloudflare Worker Example</h3>
|
|
547
|
+
<pre><span style="color:#DCDCAA">addEventListener</span>(<span style="color:#CE9178">'fetch'</span>, event => {
|
|
548
|
+
event.respondWith(handleRequest(event.request))
|
|
549
|
+
})
|
|
550
|
+
|
|
551
|
+
<span style="color:#C586C0">async function</span> <span style="color:#DCDCAA">handleRequest</span>(request) {
|
|
552
|
+
<span style="color:#C586C0">const</span> url = <span style="color:#C586C0">new</span> URL(request.url)
|
|
553
|
+
|
|
554
|
+
<span style="color:#6A9955">// Intercept .well-known/ucp requests</span>
|
|
555
|
+
<span style="color:#C586C0">if</span> (url.pathname === <span style="color:#CE9178">'/.well-known/ucp'</span>) {
|
|
556
|
+
<span style="color:#6A9955">// Fetch from your hosted profile</span>
|
|
557
|
+
<span style="color:#C586C0">const</span> ucpUrl = <span style="color:#CE9178">'https://your-profile-host.com/ucp.json'</span>
|
|
558
|
+
<span style="color:#C586C0">const</span> response = <span style="color:#C586C0">await</span> fetch(ucpUrl)
|
|
559
|
+
<span style="color:#C586C0">const</span> json = <span style="color:#C586C0">await</span> response.text()
|
|
560
|
+
|
|
561
|
+
<span style="color:#C586C0">return new</span> Response(json, {
|
|
562
|
+
headers: {
|
|
563
|
+
<span style="color:#CE9178">'Content-Type'</span>: <span style="color:#CE9178">'application/json'</span>,
|
|
564
|
+
<span style="color:#CE9178">'Access-Control-Allow-Origin'</span>: <span style="color:#CE9178">'*'</span>,
|
|
565
|
+
<span style="color:#CE9178">'Cache-Control'</span>: <span style="color:#CE9178">'public, max-age=3600'</span>
|
|
566
|
+
}
|
|
567
|
+
})
|
|
568
|
+
}
|
|
569
|
+
|
|
570
|
+
<span style="color:#6A9955">// Pass through to Squarespace for all other requests</span>
|
|
571
|
+
<span style="color:#C586C0">return</span> fetch(request)
|
|
572
|
+
}</pre>
|
|
573
|
+
</section>
|
|
574
|
+
|
|
575
|
+
<section id="page-method">
|
|
576
|
+
<h2>Method 2: Code Injection Page</h2>
|
|
577
|
+
<p>Create a dedicated page that serves your UCP profile (alternative endpoint).</p>
|
|
578
|
+
|
|
579
|
+
<div class="step-title"><span class="step-number">1</span>Create a New Page</div>
|
|
580
|
+
<ol>
|
|
581
|
+
<li>In Squarespace, go to <strong>Pages → + → Blank Page</strong></li>
|
|
582
|
+
<li>Name it "UCP Profile" or similar</li>
|
|
583
|
+
<li>Set the URL slug to <code>ucp-profile</code></li>
|
|
584
|
+
</ol>
|
|
585
|
+
|
|
586
|
+
<div class="step-title"><span class="step-number">2</span>Add Code Block</div>
|
|
587
|
+
<ol>
|
|
588
|
+
<li>Add a <strong>Code Block</strong> to the page</li>
|
|
589
|
+
<li>Set display to <strong>HTML</strong></li>
|
|
590
|
+
<li>Paste your UCP JSON wrapped in a pre tag:</li>
|
|
591
|
+
</ol>
|
|
592
|
+
|
|
593
|
+
<pre><span style="color:#569CD6"><pre</span> <span style="color:#9CDCFE">id</span>=<span style="color:#CE9178">"ucp-profile"</span> <span style="color:#9CDCFE">style</span>=<span style="color:#CE9178">"display:none;"</span><span style="color:#569CD6">></span>
|
|
594
|
+
{
|
|
595
|
+
"profile_version": "1.0",
|
|
596
|
+
"merchant": {
|
|
597
|
+
"name": "Your Store Name",
|
|
598
|
+
"url": "https://yourstore.com"
|
|
599
|
+
}
|
|
600
|
+
}
|
|
601
|
+
<span style="color:#569CD6"></pre></span>
|
|
602
|
+
|
|
603
|
+
<span style="color:#569CD6"><script></span>
|
|
604
|
+
<span style="color:#6A9955">// Redirect to show raw JSON</span>
|
|
605
|
+
<span style="color:#C586C0">const</span> pre = document.getElementById(<span style="color:#CE9178">'ucp-profile'</span>);
|
|
606
|
+
<span style="color:#C586C0">const</span> json = pre.textContent;
|
|
607
|
+
document.body.innerHTML = <span style="color:#CE9178">'<pre>'</span> + json + <span style="color:#CE9178">'</pre>'</span>;
|
|
608
|
+
<span style="color:#569CD6"></script></span></pre>
|
|
609
|
+
|
|
610
|
+
<div class="step-title"><span class="step-number">3</span>Hide from Navigation</div>
|
|
611
|
+
<ol>
|
|
612
|
+
<li>Go to <strong>Pages</strong></li>
|
|
613
|
+
<li>Drag the UCP Profile page to <strong>Not Linked</strong> section</li>
|
|
614
|
+
</ol>
|
|
615
|
+
|
|
616
|
+
<div class="tip-box warning">
|
|
617
|
+
<strong>⚠️ Important</strong>
|
|
618
|
+
This creates an alternative endpoint at <code>/ucp-profile</code>, not the standard <code>/.well-known/ucp</code>. You'll need to specify this URL when validating or registering your store.
|
|
619
|
+
</div>
|
|
620
|
+
</section>
|
|
621
|
+
|
|
622
|
+
<section id="schema-markup">
|
|
623
|
+
<h2>Schema.org Markup</h2>
|
|
624
|
+
<p>
|
|
625
|
+
Squarespace automatically adds basic Schema.org markup for products. To enhance it, use Code Injection:
|
|
626
|
+
</p>
|
|
627
|
+
|
|
628
|
+
<ol>
|
|
629
|
+
<li>Go to <strong>Settings → Advanced → Code Injection</strong></li>
|
|
630
|
+
<li>Add structured data in the <strong>Header</strong> section:</li>
|
|
631
|
+
</ol>
|
|
632
|
+
|
|
633
|
+
<pre><span style="color:#569CD6"><script</span> <span style="color:#9CDCFE">type</span>=<span style="color:#CE9178">"application/ld+json"</span><span style="color:#569CD6">></span>
|
|
634
|
+
{
|
|
635
|
+
<span style="color:#9CDCFE">"@context"</span>: <span style="color:#CE9178">"https://schema.org"</span>,
|
|
636
|
+
<span style="color:#9CDCFE">"@type"</span>: <span style="color:#CE9178">"Organization"</span>,
|
|
637
|
+
<span style="color:#9CDCFE">"name"</span>: <span style="color:#CE9178">"Your Store Name"</span>,
|
|
638
|
+
<span style="color:#9CDCFE">"url"</span>: <span style="color:#CE9178">"https://yourstore.com"</span>,
|
|
639
|
+
<span style="color:#9CDCFE">"sameAs"</span>: [
|
|
640
|
+
<span style="color:#CE9178">"https://instagram.com/yourstore"</span>,
|
|
641
|
+
<span style="color:#CE9178">"https://twitter.com/yourstore"</span>
|
|
642
|
+
]
|
|
643
|
+
}
|
|
644
|
+
<span style="color:#569CD6"></script></span></pre>
|
|
645
|
+
|
|
646
|
+
<div class="tip-box">
|
|
647
|
+
<strong>💡 Pro Tip</strong>
|
|
648
|
+
Squarespace Commerce already adds Product schema to product pages. Test with <a href="https://search.google.com/test/rich-results" target="_blank">Google's Rich Results Test</a>.
|
|
649
|
+
</div>
|
|
650
|
+
</section>
|
|
651
|
+
|
|
652
|
+
<section id="validation">
|
|
653
|
+
<h2>Validate Your Implementation</h2>
|
|
654
|
+
|
|
655
|
+
<div class="cta-box">
|
|
656
|
+
<h3>Validate Your Squarespace Store</h3>
|
|
657
|
+
<p>Check your UCP implementation and AI commerce readiness.</p>
|
|
658
|
+
<a href="/" class="btn">Run Validation →</a>
|
|
659
|
+
</div>
|
|
660
|
+
</section>
|
|
661
|
+
|
|
662
|
+
<section id="common-issues">
|
|
663
|
+
<h2>Common Issues & Solutions</h2>
|
|
664
|
+
|
|
665
|
+
<table>
|
|
666
|
+
<tr>
|
|
667
|
+
<th>Issue</th>
|
|
668
|
+
<th>Solution</th>
|
|
669
|
+
</tr>
|
|
670
|
+
<tr>
|
|
671
|
+
<td>Can't create <code>/.well-known/</code></td>
|
|
672
|
+
<td>Use external hosting with Cloudflare Worker or DNS redirect</td>
|
|
673
|
+
</tr>
|
|
674
|
+
<tr>
|
|
675
|
+
<td>Page shows Squarespace template</td>
|
|
676
|
+
<td>Use Code Block with script to replace body content</td>
|
|
677
|
+
</tr>
|
|
678
|
+
<tr>
|
|
679
|
+
<td>CORS errors</td>
|
|
680
|
+
<td>Ensure external host sets <code>Access-Control-Allow-Origin</code></td>
|
|
681
|
+
</tr>
|
|
682
|
+
<tr>
|
|
683
|
+
<td>Code injection not working</td>
|
|
684
|
+
<td>Ensure you have Business plan or higher</td>
|
|
685
|
+
</tr>
|
|
686
|
+
</table>
|
|
687
|
+
</section>
|
|
688
|
+
|
|
689
|
+
<section id="testing">
|
|
690
|
+
<h2>🤖 Test with AI Agents</h2>
|
|
691
|
+
|
|
692
|
+
<div class="cta-box">
|
|
693
|
+
<h3>Run AI Agent Simulation</h3>
|
|
694
|
+
<p>Test how AI shopping agents will interact with your Squarespace store.</p>
|
|
695
|
+
<a href="/#simulate" class="btn">Open Simulator →</a>
|
|
696
|
+
</div>
|
|
697
|
+
</section>
|
|
698
|
+
|
|
699
|
+
<section id="resources">
|
|
700
|
+
<h2>Resources</h2>
|
|
701
|
+
<ul>
|
|
702
|
+
<li><a href="https://ucp.dev" target="_blank">Official UCP Specification</a></li>
|
|
703
|
+
<li><a href="https://support.squarespace.com/hc/en-us/articles/205815908-Using-Code-Injection" target="_blank">Squarespace Code Injection Guide</a></li>
|
|
704
|
+
<li><a href="https://developers.cloudflare.com/workers/" target="_blank">Cloudflare Workers Documentation</a></li>
|
|
705
|
+
<li><a href="/learn">UCP Learning Center</a></li>
|
|
706
|
+
</ul>
|
|
707
|
+
</section>
|
|
708
|
+
</main>
|
|
709
|
+
|
|
710
|
+
<aside class="guide-sidebar">
|
|
711
|
+
<div class="sidebar-toc">
|
|
712
|
+
<h4>On This Page</h4>
|
|
713
|
+
<ul>
|
|
714
|
+
<li><a href="#overview">Why Add UCP?</a></li>
|
|
715
|
+
<li><a href="#methods">Implementation Methods</a></li>
|
|
716
|
+
<li><a href="#external-method">External Hosting</a></li>
|
|
717
|
+
<li><a href="#page-method">Code Injection Page</a></li>
|
|
718
|
+
<li><a href="#schema-markup">Schema.org Markup</a></li>
|
|
719
|
+
<li><a href="#validation">Validation</a></li>
|
|
720
|
+
<li><a href="#common-issues">Common Issues</a></li>
|
|
721
|
+
<li><a href="#testing">Test with AI</a></li>
|
|
722
|
+
<li><a href="#resources">Resources</a></li>
|
|
723
|
+
</ul>
|
|
724
|
+
</div>
|
|
725
|
+
|
|
726
|
+
<div class="other-guides">
|
|
727
|
+
<h4>Other Platforms</h4>
|
|
728
|
+
<a href="/guides/shopify">Shopify</a>
|
|
729
|
+
<a href="/guides/woocommerce">WooCommerce</a>
|
|
730
|
+
<a href="/guides/magento">Magento</a>
|
|
731
|
+
<a href="/guides/wix">Wix</a>
|
|
732
|
+
<a href="/guides/bigcommerce">BigCommerce</a>
|
|
733
|
+
</div>
|
|
734
|
+
</aside>
|
|
735
|
+
</div>
|
|
736
|
+
|
|
737
|
+
<footer>
|
|
738
|
+
<div class="container">
|
|
739
|
+
<p>UCP Tools — Built for the AI Commerce era</p>
|
|
740
|
+
<p class="footer-links">
|
|
741
|
+
<a href="https://github.com/Nolpak14/ucp-tools" target="_blank">GitHub</a> ·
|
|
742
|
+
<a href="https://ucp.dev" target="_blank">UCP Spec</a> ·
|
|
743
|
+
<a href="/">Validator</a>
|
|
744
|
+
</p>
|
|
745
|
+
</div>
|
|
746
|
+
</footer>
|
|
747
|
+
</body>
|
|
748
|
+
|
|
749
|
+
</html>
|