@lebtiga/sonic-agent 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.
Files changed (62) hide show
  1. package/LICENSE.txt +223 -0
  2. package/README.md +61 -0
  3. package/bin/sonic.js +304 -0
  4. package/lib/index.js +20 -0
  5. package/lib/installer.js +156 -0
  6. package/lib/license.js +48 -0
  7. package/package.json +46 -0
  8. package/plugin/.claude-plugin/plugin.json +13 -0
  9. package/plugin/README.md +100 -0
  10. package/plugin/agents/sonic.md +80 -0
  11. package/plugin/commands/sonic-build.md +145 -0
  12. package/plugin/commands/sonic-help.md +71 -0
  13. package/plugin/skills/accessibility-qa/SKILL.md +160 -0
  14. package/plugin/skills/accessibility-qa/templates/accessibility-qa-report-template.md +123 -0
  15. package/plugin/skills/accessibility-qa/templates/wcag-compliance-statement.md +70 -0
  16. package/plugin/skills/aka-wireframe-wp/SKILL.md +149 -0
  17. package/plugin/skills/aka-wireframe-wp/assets/aka-framework-theme/README.md +190 -0
  18. package/plugin/skills/aka-wireframe-wp/assets/aka-framework-theme/footer.php +49 -0
  19. package/plugin/skills/aka-wireframe-wp/assets/aka-framework-theme/functions.php +395 -0
  20. package/plugin/skills/aka-wireframe-wp/assets/aka-framework-theme/header.php +58 -0
  21. package/plugin/skills/aka-wireframe-wp/assets/aka-framework-theme/index.php +39 -0
  22. package/plugin/skills/aka-wireframe-wp/assets/aka-framework-theme/page-answer.php +62 -0
  23. package/plugin/skills/aka-wireframe-wp/assets/aka-framework-theme/page-authority-hub.php +122 -0
  24. package/plugin/skills/aka-wireframe-wp/assets/aka-framework-theme/page-knowledge.php +58 -0
  25. package/plugin/skills/aka-wireframe-wp/assets/aka-framework-theme/style.css +633 -0
  26. package/plugin/skills/aka-wireframe-wp/references/content-generator.md +371 -0
  27. package/plugin/skills/aka-wireframe-wp/references/internal-linker.md +430 -0
  28. package/plugin/skills/aka-wireframe-wp/references/orchestrator.md +269 -0
  29. package/plugin/skills/aka-wireframe-wp/references/prompts-library.md +880 -0
  30. package/plugin/skills/aka-wireframe-wp/references/seo-optimizer.md +433 -0
  31. package/plugin/skills/aka-wireframe-wp/references/strategy-planner.md +317 -0
  32. package/plugin/skills/aka-wireframe-wp/references/wordpress-deployer.md +545 -0
  33. package/plugin/skills/authority-site-builder/SKILL.md +138 -0
  34. package/plugin/skills/brand-philosophy/SKILL.md +77 -0
  35. package/plugin/skills/freepik-spaces/SKILL.md +122 -0
  36. package/plugin/skills/freepik-spaces/docs/automation-guide.md +233 -0
  37. package/plugin/skills/freepik-spaces/docs/research-notes.md +264 -0
  38. package/plugin/skills/freepik-spaces/plans/naseberry-demo-plan.md +320 -0
  39. package/plugin/skills/freepik-spaces/templates/naseberry-demo.json +302 -0
  40. package/plugin/skills/freepik-spaces/templates/saas-demo.json +212 -0
  41. package/plugin/skills/frontend-design/LICENSE.txt +177 -0
  42. package/plugin/skills/frontend-design/SKILL.md +77 -0
  43. package/plugin/skills/programmatic-seo/SKILL.md +236 -0
  44. package/plugin/skills/programmatic-seo/references/playbooks.md +293 -0
  45. package/plugin/skills/seo-qa/SKILL.md +132 -0
  46. package/plugin/skills/seo-qa/templates/schema-localbusiness.json +49 -0
  47. package/plugin/skills/seo-qa/templates/schema-service.json +36 -0
  48. package/plugin/skills/seo-qa/templates/seo-qa-report-template.md +90 -0
  49. package/plugin/skills/visual-identity/SKILL.md +109 -0
  50. package/plugin/skills/visual-identity/templates/style-guide-template.md +108 -0
  51. package/plugin/skills/website-image-gen/SKILL.md +82 -0
  52. package/plugin/skills/website-image-gen/templates/blog-featured.md +56 -0
  53. package/plugin/skills/website-image-gen/templates/hero-service-photo.md +56 -0
  54. package/plugin/skills/wordpress-pro/SKILL.md +105 -0
  55. package/plugin/skills/wordpress-pro/references/gutenberg-blocks.md +870 -0
  56. package/plugin/skills/wordpress-pro/references/hooks-filters.md +845 -0
  57. package/plugin/skills/wordpress-pro/references/performance-security.md +1012 -0
  58. package/plugin/skills/wordpress-pro/references/plugin-architecture.md +1041 -0
  59. package/plugin/skills/wordpress-pro/references/theme-development.md +858 -0
  60. package/plugin/sops/SOP-Sonic 777/authority-site-sop.html +1100 -0
  61. package/plugin/sops/SOP-WORDPRESS-330-PAGE-SITES.md +926 -0
  62. package/scripts/postinstall.js +109 -0
package/plugin/sops/SOP-Sonic 777/authority-site-sop.html ADDED
@@ -0,0 +1,1100 @@
1
+ <!DOCTYPE html>
2
+ <html lang="en">
3
+ <head>
4
+ <meta charset="UTF-8">
5
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
6
+ <meta name="robots" content="noindex, nofollow, noarchive, nosnippet">
7
+ <meta name="googlebot" content="noindex, nofollow">
8
+ <title>Authority Site Builder SOP — 200+ Page WordPress Site</title>
9
+ <style>
10
+ /* Password overlay */
11
+ #password-overlay {
12
+ position: fixed;
13
+ top: 0;
14
+ left: 0;
15
+ width: 100%;
16
+ height: 100%;
17
+ background: linear-gradient(135deg, #1e293b, #0f172a);
18
+ display: flex;
19
+ align-items: center;
20
+ justify-content: center;
21
+ z-index: 9999;
22
+ }
23
+ #password-overlay.hidden { display: none; }
24
+ .password-box {
25
+ background: white;
26
+ padding: 2.5rem;
27
+ border-radius: 16px;
28
+ text-align: center;
29
+ box-shadow: 0 25px 50px rgba(0,0,0,0.3);
30
+ max-width: 360px;
31
+ width: 90%;
32
+ }
33
+ .password-box h2 {
34
+ margin-bottom: 0.5rem;
35
+ color: #1e293b;
36
+ }
37
+ .password-box p {
38
+ color: #64748b;
39
+ margin-bottom: 1.5rem;
40
+ font-size: 0.95rem;
41
+ }
42
+ .password-box input {
43
+ width: 100%;
44
+ padding: 0.875rem 1rem;
45
+ border: 2px solid #e2e8f0;
46
+ border-radius: 8px;
47
+ font-size: 1rem;
48
+ text-align: center;
49
+ letter-spacing: 0.25em;
50
+ margin-bottom: 1rem;
51
+ }
52
+ .password-box input:focus {
53
+ outline: none;
54
+ border-color: #2563eb;
55
+ }
56
+ .password-box button {
57
+ width: 100%;
58
+ padding: 0.875rem;
59
+ background: #2563eb;
60
+ color: white;
61
+ border: none;
62
+ border-radius: 8px;
63
+ font-size: 1rem;
64
+ font-weight: 600;
65
+ cursor: pointer;
66
+ }
67
+ .password-box button:hover { background: #1d4ed8; }
68
+ .password-box .error {
69
+ color: #dc2626;
70
+ font-size: 0.85rem;
71
+ margin-top: 0.75rem;
72
+ display: none;
73
+ }
74
+ .password-box .error.show { display: block; }
75
+ #main-content { display: none; }
76
+ #main-content.unlocked { display: block; }
77
+ :root {
78
+ --primary: #2563eb;
79
+ --primary-dark: #1d4ed8;
80
+ --success: #10b981;
81
+ --warning: #f59e0b;
82
+ --bg: #f8fafc;
83
+ --card: #ffffff;
84
+ --text: #1e293b;
85
+ --muted: #64748b;
86
+ --border: #e2e8f0;
87
+ }
88
+ * { box-sizing: border-box; margin: 0; padding: 0; }
89
+ body {
90
+ font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
91
+ background: var(--bg);
92
+ color: var(--text);
93
+ line-height: 1.6;
94
+ padding: 2rem 1rem;
95
+ }
96
+ .container {
97
+ max-width: 900px;
98
+ margin: 0 auto;
99
+ }
100
+ header {
101
+ text-align: center;
102
+ margin-bottom: 2rem;
103
+ }
104
+ h1 {
105
+ font-size: 2rem;
106
+ font-weight: 700;
107
+ margin-bottom: 0.5rem;
108
+ }
109
+ .subtitle {
110
+ color: var(--muted);
111
+ font-size: 1.1rem;
112
+ }
113
+ .progress-bar {
114
+ background: var(--border);
115
+ border-radius: 999px;
116
+ height: 12px;
117
+ margin: 1.5rem 0;
118
+ overflow: hidden;
119
+ }
120
+ .progress-fill {
121
+ background: linear-gradient(90deg, var(--primary), var(--success));
122
+ height: 100%;
123
+ width: 0%;
124
+ transition: width 0.3s ease;
125
+ border-radius: 999px;
126
+ }
127
+ .progress-text {
128
+ text-align: center;
129
+ font-weight: 600;
130
+ color: var(--primary);
131
+ margin-bottom: 2rem;
132
+ }
133
+ .phase {
134
+ background: var(--card);
135
+ border-radius: 12px;
136
+ padding: 1.5rem;
137
+ margin-bottom: 1.5rem;
138
+ box-shadow: 0 1px 3px rgba(0,0,0,0.1);
139
+ border-left: 4px solid var(--primary);
140
+ }
141
+ .phase.complete {
142
+ border-left-color: var(--success);
143
+ }
144
+ .phase-header {
145
+ display: flex;
146
+ align-items: center;
147
+ gap: 1rem;
148
+ margin-bottom: 1rem;
149
+ cursor: pointer;
150
+ }
151
+ .phase-number {
152
+ background: var(--primary);
153
+ color: white;
154
+ width: 32px;
155
+ height: 32px;
156
+ border-radius: 50%;
157
+ display: flex;
158
+ align-items: center;
159
+ justify-content: center;
160
+ font-weight: 700;
161
+ font-size: 0.9rem;
162
+ }
163
+ .phase.complete .phase-number {
164
+ background: var(--success);
165
+ }
166
+ .phase-title {
167
+ font-size: 1.25rem;
168
+ font-weight: 600;
169
+ }
170
+ .phase-time {
171
+ margin-left: auto;
172
+ background: var(--bg);
173
+ padding: 0.25rem 0.75rem;
174
+ border-radius: 999px;
175
+ font-size: 0.85rem;
176
+ color: var(--muted);
177
+ }
178
+ .task-list {
179
+ list-style: none;
180
+ margin-top: 1rem;
181
+ }
182
+ .task {
183
+ display: flex;
184
+ align-items: flex-start;
185
+ gap: 0.75rem;
186
+ padding: 0.75rem 0;
187
+ border-bottom: 1px solid var(--border);
188
+ }
189
+ .task:last-child { border-bottom: none; }
190
+ .task input[type="checkbox"] {
191
+ width: 20px;
192
+ height: 20px;
193
+ margin-top: 2px;
194
+ cursor: pointer;
195
+ accent-color: var(--success);
196
+ }
197
+ .task-content { flex: 1; }
198
+ .task-label {
199
+ font-weight: 500;
200
+ cursor: pointer;
201
+ }
202
+ .task.done .task-label {
203
+ text-decoration: line-through;
204
+ color: var(--muted);
205
+ }
206
+ .task-details {
207
+ font-size: 0.9rem;
208
+ color: var(--muted);
209
+ margin-top: 0.25rem;
210
+ }
211
+ .task-code {
212
+ background: #1e293b;
213
+ color: #e2e8f0;
214
+ padding: 0.75rem 1rem;
215
+ border-radius: 6px;
216
+ font-family: 'Monaco', 'Consolas', monospace;
217
+ font-size: 0.85rem;
218
+ margin-top: 0.5rem;
219
+ overflow-x: auto;
220
+ }
221
+ .toggle-btn {
222
+ background: none;
223
+ border: none;
224
+ color: var(--primary);
225
+ cursor: pointer;
226
+ font-size: 0.85rem;
227
+ padding: 0;
228
+ margin-top: 0.5rem;
229
+ }
230
+ .collapsible {
231
+ display: none;
232
+ margin-top: 0.5rem;
233
+ }
234
+ .collapsible.show { display: block; }
235
+ .summary-box {
236
+ background: linear-gradient(135deg, var(--primary), var(--primary-dark));
237
+ color: white;
238
+ border-radius: 12px;
239
+ padding: 1.5rem;
240
+ margin-bottom: 2rem;
241
+ }
242
+ .summary-grid {
243
+ display: grid;
244
+ grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
245
+ gap: 1rem;
246
+ margin-top: 1rem;
247
+ }
248
+ .summary-item {
249
+ text-align: center;
250
+ }
251
+ .summary-number {
252
+ font-size: 2rem;
253
+ font-weight: 700;
254
+ }
255
+ .summary-label {
256
+ font-size: 0.85rem;
257
+ opacity: 0.9;
258
+ }
259
+ .notes-section {
260
+ background: var(--card);
261
+ border-radius: 12px;
262
+ padding: 1.5rem;
263
+ margin-top: 2rem;
264
+ }
265
+ .notes-section h3 {
266
+ margin-bottom: 1rem;
267
+ }
268
+ .notes-textarea {
269
+ width: 100%;
270
+ min-height: 150px;
271
+ padding: 1rem;
272
+ border: 1px solid var(--border);
273
+ border-radius: 8px;
274
+ font-family: inherit;
275
+ font-size: 0.95rem;
276
+ resize: vertical;
277
+ }
278
+ .btn {
279
+ background: var(--primary);
280
+ color: white;
281
+ border: none;
282
+ padding: 0.75rem 1.5rem;
283
+ border-radius: 8px;
284
+ font-size: 1rem;
285
+ cursor: pointer;
286
+ margin-top: 1rem;
287
+ }
288
+ .btn:hover { background: var(--primary-dark); }
289
+ .btn-outline {
290
+ background: transparent;
291
+ border: 2px solid var(--border);
292
+ color: var(--text);
293
+ }
294
+ .btn-outline:hover {
295
+ background: var(--bg);
296
+ }
297
+ .btn-group {
298
+ display: flex;
299
+ gap: 0.5rem;
300
+ margin-top: 1rem;
301
+ flex-wrap: wrap;
302
+ }
303
+ footer {
304
+ text-align: center;
305
+ margin-top: 3rem;
306
+ padding-top: 2rem;
307
+ border-top: 1px solid var(--border);
308
+ color: var(--muted);
309
+ font-size: 0.9rem;
310
+ }
311
+ @media (max-width: 600px) {
312
+ .phase-time { display: none; }
313
+ .summary-grid { grid-template-columns: repeat(2, 1fr); }
314
+ }
315
+ </style>
316
+ </head>
317
+ <body>
318
+ <!-- Password Overlay -->
319
+ <div id="password-overlay">
320
+ <div class="password-box">
321
+ <h2>🔒 Protected</h2>
322
+ <p>Enter the access code to continue</p>
323
+ <input type="password" id="password-input" placeholder="••••" maxlength="10" autofocus>
324
+ <button onclick="checkPassword()">Unlock</button>
325
+ <p class="error" id="password-error">Incorrect code. Try again.</p>
326
+ </div>
327
+ </div>
328
+
329
+ <div id="main-content">
330
+ <div class="container">
331
+ <header>
332
+ <h1>🚀 Authority Site Builder SOP</h1>
333
+ <p class="subtitle">Build 200+ page WordPress sites with the AKA Framework</p>
334
+ </header>
335
+
336
+ <div class="summary-box">
337
+ <strong>What You're Building</strong>
338
+ <div class="summary-grid">
339
+ <div class="summary-item">
340
+ <div class="summary-number">5-7</div>
341
+ <div class="summary-label">Authority Hubs</div>
342
+ </div>
343
+ <div class="summary-item">
344
+ <div class="summary-number">75+</div>
345
+ <div class="summary-label">Knowledge Pages</div>
346
+ </div>
347
+ <div class="summary-item">
348
+ <div class="summary-number">125+</div>
349
+ <div class="summary-label">Answer Pages</div>
350
+ </div>
351
+ <div class="summary-item">
352
+ <div class="summary-number">4-6h</div>
353
+ <div class="summary-label">Total Time</div>
354
+ </div>
355
+ </div>
356
+ </div>
357
+
358
+ <div class="progress-bar">
359
+ <div class="progress-fill" id="progressFill"></div>
360
+ </div>
361
+ <div class="progress-text"><span id="progressPercent">0</span>% Complete (<span id="tasksDone">0</span>/<span id="tasksTotal">0</span> tasks)</div>
362
+
363
+ <!-- PHASE 1: Prerequisites -->
364
+ <div class="phase" data-phase="1">
365
+ <div class="phase-header">
366
+ <div class="phase-number">1</div>
367
+ <div class="phase-title">Prerequisites & Setup</div>
368
+ <div class="phase-time">~15 min</div>
369
+ </div>
370
+ <ul class="task-list">
371
+ <li class="task">
372
+ <input type="checkbox" id="t1">
373
+ <div class="task-content">
374
+ <label class="task-label" for="t1">Install Docker & Docker Compose</label>
375
+ <div class="task-details">Required for local WordPress development</div>
376
+ <button class="toggle-btn" onclick="toggleDetails(this)">Show commands ▼</button>
377
+ <div class="collapsible">
378
+ <div class="task-code">sudo apt install docker.io docker-compose<br>sudo usermod -aG docker $USER<br># Log out and back in</div>
379
+ </div>
380
+ </div>
381
+ </li>
382
+ <li class="task">
383
+ <input type="checkbox" id="t2">
384
+ <div class="task-content">
385
+ <label class="task-label" for="t2">Install Node.js (v18+)</label>
386
+ <div class="task-details">Required for OpenClaw</div>
387
+ <button class="toggle-btn" onclick="toggleDetails(this)">Show commands ▼</button>
388
+ <div class="collapsible">
389
+ <div class="task-code">curl -fsSL https://deb.nodesource.com/setup_18.x | sudo -E bash -<br>sudo apt install nodejs</div>
390
+ </div>
391
+ </div>
392
+ </li>
393
+ <li class="task">
394
+ <input type="checkbox" id="t3">
395
+ <div class="task-content">
396
+ <label class="task-label" for="t3">Install & Configure OpenClaw</label>
397
+ <div class="task-details">AI assistant that orchestrates everything</div>
398
+ <button class="toggle-btn" onclick="toggleDetails(this)">Show commands ▼</button>
399
+ <div class="collapsible">
400
+ <div class="task-code">npm install -g openclaw<br>openclaw configure</div>
401
+ </div>
402
+ </div>
403
+ </li>
404
+ <li class="task">
405
+ <input type="checkbox" id="t4">
406
+ <div class="task-content">
407
+ <label class="task-label" for="t4">Install required skills</label>
408
+ <div class="task-details">wordpress-pro, frontend-design, programmatic-seo, aka-wireframe-wp</div>
409
+ </div>
410
+ </li>
411
+ </ul>
412
+ </div>
413
+
414
+ <!-- PHASE 2: Business Config -->
415
+ <div class="phase" data-phase="2">
416
+ <div class="phase-header">
417
+ <div class="phase-number">2</div>
418
+ <div class="phase-title">Gather Business Information</div>
419
+ <div class="phase-time">~10 min</div>
420
+ </div>
421
+ <ul class="task-list">
422
+ <li class="task">
423
+ <input type="checkbox" id="t5">
424
+ <div class="task-content">
425
+ <label class="task-label" for="t5">Collect 15 business variables</label>
426
+ <div class="task-details">These inject into all content</div>
427
+ <button class="toggle-btn" onclick="toggleDetails(this)">Show list ▼</button>
428
+ <div class="collapsible">
429
+ <div class="task-code">1. Business name<br>2. Industry/niche<br>3. Location (City, State)<br>4. Service radius<br>5. Primary service → first Authority Hub<br>6. Secondary services (4-6) → more Hubs<br>7. Target audience<br>8. Top 3 customer pain points<br>9. Brand voice (professional/friendly/etc)<br>10. Unique value proposition<br>11. Phone number<br>12. Email<br>13. Business address<br>14. Hours of operation<br>15. Trust signals (years, clients, awards)</div>
430
+ </div>
431
+ </div>
432
+ </li>
433
+ <li class="task">
434
+ <input type="checkbox" id="t6">
435
+ <div class="task-content">
436
+ <label class="task-label" for="t6">Define target cities/areas</label>
437
+ <div class="task-details">List all cities within your service radius for location pages</div>
438
+ </div>
439
+ </li>
440
+ <li class="task">
441
+ <input type="checkbox" id="t7">
442
+ <div class="task-content">
443
+ <label class="task-label" for="t7">Create business-config.json</label>
444
+ <div class="task-details">Save to .factory/config/aka-wireframe/</div>
445
+ </div>
446
+ </li>
447
+ </ul>
448
+ </div>
449
+
450
+ <!-- PHASE 3: Local WordPress -->
451
+ <div class="phase" data-phase="3">
452
+ <div class="phase-header">
453
+ <div class="phase-number">3</div>
454
+ <div class="phase-title">Local WordPress Setup</div>
455
+ <div class="phase-time">~15 min</div>
456
+ </div>
457
+ <ul class="task-list">
458
+ <li class="task">
459
+ <input type="checkbox" id="t8">
460
+ <div class="task-content">
461
+ <label class="task-label" for="t8">Create project directory</label>
462
+ <div class="task-code">mkdir -p ~/.openclaw/workspace/[project-name]<br>cd ~/.openclaw/workspace/[project-name]</div>
463
+ </div>
464
+ </li>
465
+ <li class="task">
466
+ <input type="checkbox" id="t9">
467
+ <div class="task-content">
468
+ <label class="task-label" for="t9">Create docker-compose.yml</label>
469
+ <div class="task-details">WordPress + MariaDB + phpMyAdmin</div>
470
+ </div>
471
+ </li>
472
+ <li class="task">
473
+ <input type="checkbox" id="t10">
474
+ <div class="task-content">
475
+ <label class="task-label" for="t10">Create .htaccess file</label>
476
+ <div class="task-details">For pretty permalinks</div>
477
+ </div>
478
+ </li>
479
+ <li class="task">
480
+ <input type="checkbox" id="t11">
481
+ <div class="task-content">
482
+ <label class="task-label" for="t11">Start Docker containers</label>
483
+ <div class="task-code">sudo docker compose up -d</div>
484
+ </div>
485
+ </li>
486
+ <li class="task">
487
+ <input type="checkbox" id="t12">
488
+ <div class="task-content">
489
+ <label class="task-label" for="t12">Complete WordPress installation</label>
490
+ <div class="task-details">Go to http://localhost:8080 and set up</div>
491
+ </div>
492
+ </li>
493
+ <li class="task">
494
+ <input type="checkbox" id="t13">
495
+ <div class="task-content">
496
+ <label class="task-label" for="t13">Set permalinks to "Post name"</label>
497
+ <div class="task-details">Settings → Permalinks → Post name → Save</div>
498
+ </div>
499
+ </li>
500
+ </ul>
501
+ </div>
502
+
503
+ <!-- PHASE 4: Theme Development -->
504
+ <div class="phase" data-phase="4">
505
+ <div class="phase-header">
506
+ <div class="phase-number">4</div>
507
+ <div class="phase-title">Theme & Design System</div>
508
+ <div class="phase-time">~45 min</div>
509
+ </div>
510
+ <ul class="task-list">
511
+ <li class="task">
512
+ <input type="checkbox" id="t14">
513
+ <div class="task-content">
514
+ <label class="task-label" for="t14">Define color palette</label>
515
+ <div class="task-details">Primary, secondary, accent, background colors</div>
516
+ </div>
517
+ </li>
518
+ <li class="task">
519
+ <input type="checkbox" id="t15">
520
+ <div class="task-content">
521
+ <label class="task-label" for="t15">Choose typography</label>
522
+ <div class="task-details">Heading font + body font from Google Fonts</div>
523
+ </div>
524
+ </li>
525
+ <li class="task">
526
+ <input type="checkbox" id="t16">
527
+ <div class="task-content">
528
+ <label class="task-label" for="t16">Create theme folder structure</label>
529
+ <div class="task-details">wp-content/themes/[theme-name]/</div>
530
+ </div>
531
+ </li>
532
+ <li class="task">
533
+ <input type="checkbox" id="t17">
534
+ <div class="task-content">
535
+ <label class="task-label" for="t17">Build style.css with design tokens</label>
536
+ <div class="task-details">CSS custom properties for colors, fonts, spacing</div>
537
+ </div>
538
+ </li>
539
+ <li class="task">
540
+ <input type="checkbox" id="t18">
541
+ <div class="task-content">
542
+ <label class="task-label" for="t18">Create functions.php</label>
543
+ <div class="task-details">Enqueue styles, scripts, register menus, post types</div>
544
+ </div>
545
+ </li>
546
+ <li class="task">
547
+ <input type="checkbox" id="t19">
548
+ <div class="task-content">
549
+ <label class="task-label" for="t19">Build header.php & footer.php</label>
550
+ <div class="task-details">Site navigation and footer links</div>
551
+ </div>
552
+ </li>
553
+ <li class="task">
554
+ <input type="checkbox" id="t20">
555
+ <div class="task-content">
556
+ <label class="task-label" for="t20">Create front-page.php</label>
557
+ <div class="task-details">Hero, about, services, hub links, CTA sections</div>
558
+ </div>
559
+ </li>
560
+ <li class="task">
561
+ <input type="checkbox" id="t21">
562
+ <div class="task-content">
563
+ <label class="task-label" for="t21">Create page.php template</label>
564
+ <div class="task-details">For AKA pages and standard pages</div>
565
+ </div>
566
+ </li>
567
+ <li class="task">
568
+ <input type="checkbox" id="t22">
569
+ <div class="task-content">
570
+ <label class="task-label" for="t22">Activate theme in WordPress</label>
571
+ <div class="task-details">Appearance → Themes → Activate</div>
572
+ </div>
573
+ </li>
574
+ </ul>
575
+ </div>
576
+
577
+ <!-- PHASE 5: Programmatic SEO -->
578
+ <div class="phase" data-phase="5">
579
+ <div class="phase-header">
580
+ <div class="phase-number">5</div>
581
+ <div class="phase-title">Programmatic SEO Pages</div>
582
+ <div class="phase-time">~30 min</div>
583
+ </div>
584
+ <ul class="task-list">
585
+ <li class="task">
586
+ <input type="checkbox" id="t23">
587
+ <div class="task-content">
588
+ <label class="task-label" for="t23">Create SEO data files</label>
589
+ <div class="task-details">seo-data/locations.json, services.json, faqs.json</div>
590
+ </div>
591
+ </li>
592
+ <li class="task">
593
+ <input type="checkbox" id="t24">
594
+ <div class="task-content">
595
+ <label class="task-label" for="t24">Register custom post types</label>
596
+ <div class="task-details">location_page, service_location, faq_page, comparison_page</div>
597
+ </div>
598
+ </li>
599
+ <li class="task">
600
+ <input type="checkbox" id="t25">
601
+ <div class="task-content">
602
+ <label class="task-label" for="t25">Create SEO page generator PHP</label>
603
+ <div class="task-details">inc/programmatic-seo.php with generate functions</div>
604
+ </div>
605
+ </li>
606
+ <li class="task">
607
+ <input type="checkbox" id="t26">
608
+ <div class="task-content">
609
+ <label class="task-label" for="t26">Generate location pages</label>
610
+ <div class="task-details">One page per city in service area</div>
611
+ </div>
612
+ </li>
613
+ <li class="task">
614
+ <input type="checkbox" id="t27">
615
+ <div class="task-content">
616
+ <label class="task-label" for="t27">Generate service + location pages</label>
617
+ <div class="task-details">[service]-[city] combinations</div>
618
+ </div>
619
+ </li>
620
+ <li class="task">
621
+ <input type="checkbox" id="t28">
622
+ <div class="task-content">
623
+ <label class="task-label" for="t28">Generate FAQ pages</label>
624
+ <div class="task-details">/learn/[topic]/ pages</div>
625
+ </div>
626
+ </li>
627
+ <li class="task">
628
+ <input type="checkbox" id="t29">
629
+ <div class="task-content">
630
+ <label class="task-label" for="t29">Generate comparison pages</label>
631
+ <div class="task-details">/compare/[a]-vs-[b]/ pages</div>
632
+ </div>
633
+ </li>
634
+ <li class="task">
635
+ <input type="checkbox" id="t30">
636
+ <div class="task-content">
637
+ <label class="task-label" for="t30">Create hub/index pages</label>
638
+ <div class="task-details">/areas-we-serve/, /learn/, /compare/, /all-services/</div>
639
+ </div>
640
+ </li>
641
+ </ul>
642
+ </div>
643
+
644
+ <!-- PHASE 6: AKA Content -->
645
+ <div class="phase" data-phase="6">
646
+ <div class="phase-header">
647
+ <div class="phase-number">6</div>
648
+ <div class="phase-title">AKA Framework Content</div>
649
+ <div class="phase-time">~2 hours</div>
650
+ </div>
651
+ <ul class="task-list">
652
+ <li class="task">
653
+ <input type="checkbox" id="t31">
654
+ <div class="task-content">
655
+ <label class="task-label" for="t31">Generate AKA strategy document</label>
656
+ <div class="task-details">Complete wireframe with all hubs, knowledge, answer pages mapped</div>
657
+ </div>
658
+ </li>
659
+ <li class="task">
660
+ <input type="checkbox" id="t32">
661
+ <div class="task-content">
662
+ <label class="task-label" for="t32">Create Authority Hub 1 content</label>
663
+ <div class="task-details">4,000-word pillar page + 15 knowledge + 25 answers</div>
664
+ </div>
665
+ </li>
666
+ <li class="task">
667
+ <input type="checkbox" id="t33">
668
+ <div class="task-content">
669
+ <label class="task-label" for="t33">Create Authority Hub 2 content</label>
670
+ <div class="task-details">4,000-word pillar page + 15 knowledge + 25 answers</div>
671
+ </div>
672
+ </li>
673
+ <li class="task">
674
+ <input type="checkbox" id="t34">
675
+ <div class="task-content">
676
+ <label class="task-label" for="t34">Create Authority Hub 3 content</label>
677
+ <div class="task-details">4,000-word pillar page + 15 knowledge + 25 answers</div>
678
+ </div>
679
+ </li>
680
+ <li class="task">
681
+ <input type="checkbox" id="t35">
682
+ <div class="task-content">
683
+ <label class="task-label" for="t35">Create Authority Hub 4 content</label>
684
+ <div class="task-details">4,000-word pillar page + 15 knowledge + 25 answers</div>
685
+ </div>
686
+ </li>
687
+ <li class="task">
688
+ <input type="checkbox" id="t36">
689
+ <div class="task-content">
690
+ <label class="task-label" for="t36">Create Authority Hub 5 content</label>
691
+ <div class="task-details">4,000-word pillar page + 15 knowledge + 25 answers</div>
692
+ </div>
693
+ </li>
694
+ <li class="task">
695
+ <input type="checkbox" id="t37">
696
+ <div class="task-content">
697
+ <label class="task-label" for="t37">Process internal links</label>
698
+ <div class="task-details">Convert [LINK:...] placeholders to URLs</div>
699
+ </div>
700
+ </li>
701
+ <li class="task">
702
+ <input type="checkbox" id="t38">
703
+ <div class="task-content">
704
+ <label class="task-label" for="t38">Import AKA content to WordPress</label>
705
+ <div class="task-details">Run import script or trigger-aka.php</div>
706
+ </div>
707
+ </li>
708
+ </ul>
709
+ </div>
710
+
711
+ <!-- PHASE 7: Navigation & Internal Linking -->
712
+ <div class="phase" data-phase="7">
713
+ <div class="phase-header">
714
+ <div class="phase-number">7</div>
715
+ <div class="phase-title">Navigation & Internal Linking</div>
716
+ <div class="phase-time">~20 min</div>
717
+ </div>
718
+ <ul class="task-list">
719
+ <li class="task">
720
+ <input type="checkbox" id="t39">
721
+ <div class="task-content">
722
+ <label class="task-label" for="t39">Build header navigation menu</label>
723
+ <div class="task-details">Services dropdown, Treatment Guides dropdown, Locations, About, Contact</div>
724
+ </div>
725
+ </li>
726
+ <li class="task">
727
+ <input type="checkbox" id="t40">
728
+ <div class="task-content">
729
+ <label class="task-label" for="t40">Build footer with link columns</label>
730
+ <div class="task-details">Services, Locations, Resources, Contact info</div>
731
+ </div>
732
+ </li>
733
+ <li class="task">
734
+ <input type="checkbox" id="t41">
735
+ <div class="task-content">
736
+ <label class="task-label" for="t41">Verify no orphan pages</label>
737
+ <div class="task-details">Every page should have incoming links</div>
738
+ </div>
739
+ </li>
740
+ <li class="task">
741
+ <input type="checkbox" id="t42">
742
+ <div class="task-content">
743
+ <label class="task-label" for="t42">Add breadcrumbs to templates</label>
744
+ <div class="task-details">For better UX and SEO</div>
745
+ </div>
746
+ </li>
747
+ </ul>
748
+ </div>
749
+
750
+ <!-- PHASE 8: Optimization -->
751
+ <div class="phase" data-phase="8">
752
+ <div class="phase-header">
753
+ <div class="phase-number">8</div>
754
+ <div class="phase-title">Performance & SEO Optimization</div>
755
+ <div class="phase-time">~20 min</div>
756
+ </div>
757
+ <ul class="task-list">
758
+ <li class="task">
759
+ <input type="checkbox" id="t43">
760
+ <div class="task-content">
761
+ <label class="task-label" for="t43">Add preconnect hints</label>
762
+ <div class="task-details">For Google Fonts, CDNs</div>
763
+ </div>
764
+ </li>
765
+ <li class="task">
766
+ <input type="checkbox" id="t44">
767
+ <div class="task-content">
768
+ <label class="task-label" for="t44">Inline critical CSS</label>
769
+ <div class="task-details">Above-the-fold styles in &lt;head&gt;</div>
770
+ </div>
771
+ </li>
772
+ <li class="task">
773
+ <input type="checkbox" id="t45">
774
+ <div class="task-content">
775
+ <label class="task-label" for="t45">Defer JavaScript loading</label>
776
+ <div class="task-details">Use defer/async for non-critical scripts</div>
777
+ </div>
778
+ </li>
779
+ <li class="task">
780
+ <input type="checkbox" id="t46">
781
+ <div class="task-content">
782
+ <label class="task-label" for="t46">Optimize images</label>
783
+ <div class="task-details">WebP format, lazy loading, proper sizing</div>
784
+ </div>
785
+ </li>
786
+ <li class="task">
787
+ <input type="checkbox" id="t47">
788
+ <div class="task-content">
789
+ <label class="task-label" for="t47">Add SEO meta tags</label>
790
+ <div class="task-details">Title, description, OG tags for each page type</div>
791
+ </div>
792
+ </li>
793
+ <li class="task">
794
+ <input type="checkbox" id="t48">
795
+ <div class="task-content">
796
+ <label class="task-label" for="t48">Add schema markup</label>
797
+ <div class="task-details">LocalBusiness, FAQPage, Service schemas</div>
798
+ </div>
799
+ </li>
800
+ </ul>
801
+ </div>
802
+
803
+ <!-- PHASE 9: Deployment -->
804
+ <div class="phase" data-phase="9">
805
+ <div class="phase-header">
806
+ <div class="phase-number">9</div>
807
+ <div class="phase-title">Deployment</div>
808
+ <div class="phase-time">~30 min</div>
809
+ </div>
810
+ <ul class="task-list">
811
+ <li class="task">
812
+ <input type="checkbox" id="t49">
813
+ <div class="task-content">
814
+ <label class="task-label" for="t49">Export database from local</label>
815
+ <div class="task-code">docker exec [container] mysqldump -u wordpress -pwordpress wordpress > backup.sql</div>
816
+ </div>
817
+ </li>
818
+ <li class="task">
819
+ <input type="checkbox" id="t50">
820
+ <div class="task-content">
821
+ <label class="task-label" for="t50">Replace localhost URLs with production domain</label>
822
+ <div class="task-code">sed 's|http://localhost:8080|https://yourdomain.com|g' backup.sql > production.sql</div>
823
+ </div>
824
+ </li>
825
+ <li class="task">
826
+ <input type="checkbox" id="t51">
827
+ <div class="task-content">
828
+ <label class="task-label" for="t51">Zip theme folder</label>
829
+ <div class="task-code">cd wp-content/themes && zip -r theme-name.zip theme-name/</div>
830
+ </div>
831
+ </li>
832
+ <li class="task">
833
+ <input type="checkbox" id="t52">
834
+ <div class="task-content">
835
+ <label class="task-label" for="t52">Upload theme to production host</label>
836
+ <div class="task-details">Via SFTP or hosting file manager</div>
837
+ </div>
838
+ </li>
839
+ <li class="task">
840
+ <input type="checkbox" id="t53">
841
+ <div class="task-content">
842
+ <label class="task-label" for="t53">Import database to production</label>
843
+ <div class="task-details">Via phpMyAdmin or command line</div>
844
+ </div>
845
+ </li>
846
+ <li class="task">
847
+ <input type="checkbox" id="t54">
848
+ <div class="task-content">
849
+ <label class="task-label" for="t54">Activate theme on production</label>
850
+ <div class="task-details">Appearance → Themes → Activate</div>
851
+ </div>
852
+ </li>
853
+ <li class="task">
854
+ <input type="checkbox" id="t55">
855
+ <div class="task-content">
856
+ <label class="task-label" for="t55">Flush permalinks on production</label>
857
+ <div class="task-details">Settings → Permalinks → Save (no changes needed)</div>
858
+ </div>
859
+ </li>
860
+ <li class="task">
861
+ <input type="checkbox" id="t56">
862
+ <div class="task-content">
863
+ <label class="task-label" for="t56">Install SSL certificate</label>
864
+ <div class="task-details">Usually via hosting panel or Let's Encrypt</div>
865
+ </div>
866
+ </li>
867
+ <li class="task">
868
+ <input type="checkbox" id="t57">
869
+ <div class="task-content">
870
+ <label class="task-label" for="t57">Test all pages and links</label>
871
+ <div class="task-details">Spot check navigation, internal links, forms</div>
872
+ </div>
873
+ </li>
874
+ </ul>
875
+ </div>
876
+
877
+ <!-- PHASE 10: Final -->
878
+ <div class="phase" data-phase="10">
879
+ <div class="phase-header">
880
+ <div class="phase-number">10</div>
881
+ <div class="phase-title">Final Checklist</div>
882
+ <div class="phase-time">~10 min</div>
883
+ </div>
884
+ <ul class="task-list">
885
+ <li class="task">
886
+ <input type="checkbox" id="t58">
887
+ <div class="task-content">
888
+ <label class="task-label" for="t58">Submit sitemap to Google Search Console</label>
889
+ <div class="task-details">yourdomain.com/sitemap.xml</div>
890
+ </div>
891
+ </li>
892
+ <li class="task">
893
+ <input type="checkbox" id="t59">
894
+ <div class="task-content">
895
+ <label class="task-label" for="t59">Set up Google Analytics</label>
896
+ <div class="task-details">GA4 tracking code in header</div>
897
+ </div>
898
+ </li>
899
+ <li class="task">
900
+ <input type="checkbox" id="t60">
901
+ <div class="task-content">
902
+ <label class="task-label" for="t60">Configure contact forms</label>
903
+ <div class="task-details">Test form submissions, set up notifications</div>
904
+ </div>
905
+ </li>
906
+ <li class="task">
907
+ <input type="checkbox" id="t61">
908
+ <div class="task-content">
909
+ <label class="task-label" for="t61">Verify mobile responsiveness</label>
910
+ <div class="task-details">Test on phone, tablet, and desktop</div>
911
+ </div>
912
+ </li>
913
+ <li class="task">
914
+ <input type="checkbox" id="t62">
915
+ <div class="task-content">
916
+ <label class="task-label" for="t62">Run PageSpeed Insights</label>
917
+ <div class="task-details">Target 80+ mobile, 90+ desktop</div>
918
+ </div>
919
+ </li>
920
+ <li class="task">
921
+ <input type="checkbox" id="t63">
922
+ <div class="task-content">
923
+ <label class="task-label" for="t63">Document project for handoff</label>
924
+ <div class="task-details">Credentials, tech stack, customization notes</div>
925
+ </div>
926
+ </li>
927
+ </ul>
928
+ </div>
929
+
930
+ <!-- Notes Section -->
931
+ <div class="notes-section">
932
+ <h3>📝 Project Notes</h3>
933
+ <textarea class="notes-textarea" id="projectNotes" placeholder="Add project-specific notes, URLs, credentials (save locally only)..."></textarea>
934
+ <div class="btn-group">
935
+ <button class="btn btn-outline" onclick="saveProgress()">💾 Save Progress</button>
936
+ <button class="btn btn-outline" onclick="resetProgress()">🔄 Reset All</button>
937
+ <button class="btn" onclick="exportProgress()">📤 Export</button>
938
+ </div>
939
+ </div>
940
+
941
+ <footer>
942
+ <p>Authority Site Builder SOP — Based on the AKA Framework</p>
943
+ <p>Generates 200+ pages in 4-6 hours with AI assistance</p>
944
+ </footer>
945
+ </div>
946
+
947
+ <script>
948
+ // Initialize
949
+ const checkboxes = document.querySelectorAll('input[type="checkbox"]');
950
+ const progressFill = document.getElementById('progressFill');
951
+ const progressPercent = document.getElementById('progressPercent');
952
+ const tasksDone = document.getElementById('tasksDone');
953
+ const tasksTotal = document.getElementById('tasksTotal');
954
+ const projectNotes = document.getElementById('projectNotes');
955
+
956
+ tasksTotal.textContent = checkboxes.length;
957
+
958
+ // Load saved progress
959
+ function loadProgress() {
960
+ const saved = localStorage.getItem('authoritySiteSOP');
961
+ if (saved) {
962
+ const data = JSON.parse(saved);
963
+ checkboxes.forEach(cb => {
964
+ if (data.tasks && data.tasks[cb.id]) {
965
+ cb.checked = true;
966
+ cb.closest('.task').classList.add('done');
967
+ }
968
+ });
969
+ if (data.notes) {
970
+ projectNotes.value = data.notes;
971
+ }
972
+ }
973
+ updateProgress();
974
+ }
975
+
976
+ // Save progress
977
+ function saveProgress() {
978
+ const tasks = {};
979
+ checkboxes.forEach(cb => {
980
+ if (cb.checked) tasks[cb.id] = true;
981
+ });
982
+ const data = {
983
+ tasks,
984
+ notes: projectNotes.value,
985
+ savedAt: new Date().toISOString()
986
+ };
987
+ localStorage.setItem('authoritySiteSOP', JSON.stringify(data));
988
+ alert('Progress saved!');
989
+ }
990
+
991
+ // Reset progress
992
+ function resetProgress() {
993
+ if (confirm('Reset all progress? This cannot be undone.')) {
994
+ localStorage.removeItem('authoritySiteSOP');
995
+ checkboxes.forEach(cb => {
996
+ cb.checked = false;
997
+ cb.closest('.task').classList.remove('done');
998
+ });
999
+ projectNotes.value = '';
1000
+ updateProgress();
1001
+ }
1002
+ }
1003
+
1004
+ // Export progress
1005
+ function exportProgress() {
1006
+ const tasks = {};
1007
+ checkboxes.forEach(cb => {
1008
+ if (cb.checked) tasks[cb.id] = true;
1009
+ });
1010
+ const data = {
1011
+ tasks,
1012
+ notes: projectNotes.value,
1013
+ exportedAt: new Date().toISOString()
1014
+ };
1015
+ const blob = new Blob([JSON.stringify(data, null, 2)], { type: 'application/json' });
1016
+ const url = URL.createObjectURL(blob);
1017
+ const a = document.createElement('a');
1018
+ a.href = url;
1019
+ a.download = 'authority-site-sop-progress.json';
1020
+ a.click();
1021
+ }
1022
+
1023
+ // Update progress bar
1024
+ function updateProgress() {
1025
+ const done = Array.from(checkboxes).filter(cb => cb.checked).length;
1026
+ const percent = Math.round((done / checkboxes.length) * 100);
1027
+ progressFill.style.width = percent + '%';
1028
+ progressPercent.textContent = percent;
1029
+ tasksDone.textContent = done;
1030
+
1031
+ // Update phase completion
1032
+ document.querySelectorAll('.phase').forEach(phase => {
1033
+ const phaseCheckboxes = phase.querySelectorAll('input[type="checkbox"]');
1034
+ const phaseDone = Array.from(phaseCheckboxes).filter(cb => cb.checked).length;
1035
+ if (phaseDone === phaseCheckboxes.length && phaseCheckboxes.length > 0) {
1036
+ phase.classList.add('complete');
1037
+ } else {
1038
+ phase.classList.remove('complete');
1039
+ }
1040
+ });
1041
+ }
1042
+
1043
+ // Checkbox change handler
1044
+ checkboxes.forEach(cb => {
1045
+ cb.addEventListener('change', () => {
1046
+ cb.closest('.task').classList.toggle('done', cb.checked);
1047
+ updateProgress();
1048
+ });
1049
+ });
1050
+
1051
+ // Toggle details
1052
+ function toggleDetails(btn) {
1053
+ const collapsible = btn.nextElementSibling;
1054
+ collapsible.classList.toggle('show');
1055
+ btn.textContent = collapsible.classList.contains('show') ? 'Hide ▲' : 'Show commands ▼';
1056
+ }
1057
+
1058
+ // Auto-save on notes change
1059
+ projectNotes.addEventListener('input', () => {
1060
+ clearTimeout(projectNotes.saveTimeout);
1061
+ projectNotes.saveTimeout = setTimeout(saveProgress, 2000);
1062
+ });
1063
+
1064
+ // Load on page load
1065
+ loadProgress();
1066
+ </script>
1067
+ </div><!-- end main-content -->
1068
+
1069
+ <script>
1070
+ // Password protection
1071
+ const correctHash = '1338';
1072
+
1073
+ function checkPassword() {
1074
+ const input = document.getElementById('password-input').value;
1075
+ const error = document.getElementById('password-error');
1076
+
1077
+ if (input === correctHash) {
1078
+ document.getElementById('password-overlay').classList.add('hidden');
1079
+ document.getElementById('main-content').classList.add('unlocked');
1080
+ sessionStorage.setItem('sop-unlocked', 'true');
1081
+ } else {
1082
+ error.classList.add('show');
1083
+ document.getElementById('password-input').value = '';
1084
+ document.getElementById('password-input').focus();
1085
+ }
1086
+ }
1087
+
1088
+ // Allow Enter key to submit
1089
+ document.getElementById('password-input').addEventListener('keypress', function(e) {
1090
+ if (e.key === 'Enter') checkPassword();
1091
+ });
1092
+
1093
+ // Check if already unlocked this session
1094
+ if (sessionStorage.getItem('sop-unlocked') === 'true') {
1095
+ document.getElementById('password-overlay').classList.add('hidden');
1096
+ document.getElementById('main-content').classList.add('unlocked');
1097
+ }
1098
+ </script>
1099
+ </body>
1100
+ </html>