Diff -- /var/www/vhosts/3dshawn.com/abforge.3dshawn.com/TEMPLATES/abforge_experiments.html
Diff
/var/www/vhosts/3dshawn.com/abforge.3dshawn.com/TEMPLATES/abforge_experiments.html
added on local at 2026-07-01 17:31:44
Added
+202
lines
Removed
-0
lines
Context
0
unchanged
Blobs
from
to 8c6f55f5bf24
to 8c6f55f5bf24
Unified diff
Naive LCS-based line diff. Additions in emerald, deletions in rose. Both sides decompressed live from BLOB_STORE.| 1 | <div class="page-header"> | |
| 2 | <div><h1>Experiments</h1><p>$site_name · A/B + multi-variate tests.</p></div> | |
| 3 | <a class="btn btn-brand" href="/experiments.cgi?site_id=$site_id&new=1">+ New experiment</a> | |
| 4 | </div> | |
| 5 | ||
| 6 | [if:$show_new] | |
| 7 | <div class="card"> | |
| 8 | <div class="card-header"><h3 class="card-title">Create experiment</h3></div> | |
| 9 | <form method="POST" action="/experiments.cgi?site_id=$site_id"> | |
| 10 | <input type="hidden" name="create_test" value="1"> | |
| 11 | <div class="row-2"> | |
| 12 | <div class="form-row"> | |
| 13 | <label class="form-label">Name</label> | |
| 14 | <input class="form-input" name="name" placeholder="e.g. Hero CTA copy v2" required> | |
| 15 | </div> | |
| 16 | <div class="form-row"> | |
| 17 | <label class="form-label">Type</label> | |
| 18 | <select class="form-select" name="test_type"> | |
| 19 | <option value="ab">A/B (two-arm)</option> | |
| 20 | <option value="mvt">MVT (multi-variant)</option> | |
| 21 | <option value="split_url">Split URL</option> | |
| 22 | <option value="redirect">Redirect</option> | |
| 23 | </select> | |
| 24 | </div> | |
| 25 | </div> | |
| 26 | <div class="row-3"> | |
| 27 | <div class="form-row"> | |
| 28 | <label class="form-label">Match URLs</label> | |
| 29 | <select class="form-select" name="target_url_match"> | |
| 30 | <option value="any">Any URL</option> | |
| 31 | <option value="contains">Path contains</option> | |
| 32 | <option value="prefix">Path starts with</option> | |
| 33 | <option value="exact">Exact path</option> | |
| 34 | <option value="regex">Regex</option> | |
| 35 | </select> | |
| 36 | </div> | |
| 37 | <div class="form-row"> | |
| 38 | <label class="form-label">URL value</label> | |
| 39 | <input class="form-input" name="target_url_value" placeholder="/pricing"> | |
| 40 | </div> | |
| 41 | <div class="form-row"> | |
| 42 | <label class="form-label">Traffic %</label> | |
| 43 | <input class="form-input" name="traffic_pct" type="number" value="100" min="1" max="100"> | |
| 44 | </div> | |
| 45 | </div> | |
| 46 | <div class="form-row"> | |
| 47 | <label class="form-label">Primary goal (optional)</label> | |
| 48 | <select class="form-select" name="goal_id"> | |
| 49 | <option value="">No goal (track exposure only)</option> | |
| 50 | [loop:@goals]<option value="$id">$name</option>[/loop] | |
| 51 | </select> | |
| 52 | </div> | |
| 53 | <button class="btn btn-brand">Create</button> | |
| 54 | <a class="btn btn-ghost" href="/experiments.cgi?site_id=$site_id">Cancel</a> | |
| 55 | </form> | |
| 56 | </div> | |
| 57 | [/if] | |
| 58 | ||
| 59 | [if:$has_current] | |
| 60 | [if:$current.has_winner] | |
| 61 | <div class="card" style="background:linear-gradient(135deg,rgba(34,197,94,0.10) 0%,rgba(168,85,247,0.10) 100%);border:1px solid rgba(34,197,94,0.4);border-radius:12px;padding:20px;margin-bottom:18px"> | |
| 62 | <div style="display:flex;align-items:flex-start;gap:14px;flex-wrap:wrap"> | |
| 63 | <div style="font-size:32px;line-height:1">🏆</div> | |
| 64 | <div style="flex:1;min-width:240px"> | |
| 65 | <div style="font-weight:700;font-size:11px;color:#22c55e;letter-spacing:1.5px;text-transform:uppercase;margin-bottom:4px">AutoWinner declared a winner</div> | |
| 66 | <div style="font-size:18px;font-weight:700;color:#fff;margin-bottom:6px">$current.winner_variant_name <span style="font-size:13px;color:#a78bfa;font-weight:500;margin-left:8px">at $current.confidence_pct confidence</span></div> | |
| 67 | [if:$current.has_summary] | |
| 68 | <div style="font-size:13px;color:#cbd5e1;line-height:1.5;margin-top:10px;padding:12px 14px;background:rgba(168,85,247,0.10);border-left:3px solid #a78bfa;border-radius:6px"> | |
| 69 | <div style="font-size:10px;color:#a78bfa;text-transform:uppercase;letter-spacing:1px;font-weight:700;margin-bottom:6px">⚡ AI analysis</div> | |
| 70 | $current.winner_summary | |
| 71 | </div> | |
| 72 | [/if] | |
| 73 | [if:!$current.has_summary] | |
| 74 | <div style="font-size:11px;color:#94a3b8;margin-top:6px">AI summary pending. Set <code>anthropic.api_key</code> + enable <code>anthropic.enabled</code> in admin_config to get auto-generated explanations of why the winner won.</div> | |
| 75 | [/if] | |
| 76 | </div> | |
| 77 | </div> | |
| 78 | </div> | |
| 79 | [/if] | |
| 80 | ||
| 81 | <div class="card"> | |
| 82 | <div class="card-header"> | |
| 83 | <div> | |
| 84 | <h3 class="card-title">$current.name <span class="badge $current.status">$current.status</span></h3> | |
| 85 | <p class="card-sub">$current.test_type · Matches: $current.target_url_match $current.target_url_value · Traffic $current.traffic_pct%</p> | |
| 86 | </div> | |
| 87 | <div class="flex gap-8"> | |
| 88 | [if:$current.status_draft] | |
| 89 | <form method="POST" action="/experiments.cgi?site_id=$site_id&id=$current.id" style="display:inline;"> | |
| 90 | <input type="hidden" name="start_test" value="$current.id"> | |
| 91 | <button class="btn btn-brand btn-sm">Start</button> | |
| 92 | </form> | |
| 93 | [/if] | |
| 94 | [if:$current.status_running] | |
| 95 | <form method="POST" action="/experiments.cgi?site_id=$site_id&id=$current.id" style="display:inline;"> | |
| 96 | <input type="hidden" name="pause_test" value="$current.id"> | |
| 97 | <button class="btn btn-secondary btn-sm">Pause</button> | |
| 98 | </form> | |
| 99 | <form method="POST" action="/experiments.cgi?site_id=$site_id&id=$current.id" style="display:inline;"> | |
| 100 | <input type="hidden" name="stop_test" value="$current.id"> | |
| 101 | <button class="btn btn-ghost btn-sm">Stop</button> | |
| 102 | </form> | |
| 103 | [/if] | |
| 104 | [if:$current.status_paused] | |
| 105 | <form method="POST" action="/experiments.cgi?site_id=$site_id&id=$current.id" style="display:inline;"> | |
| 106 | <input type="hidden" name="start_test" value="$current.id"> | |
| 107 | <button class="btn btn-brand btn-sm">Resume</button> | |
| 108 | </form> | |
| 109 | [/if] | |
| 110 | <form method="POST" action="/experiments.cgi?site_id=$site_id" onsubmit="return confirm('Delete this experiment and all its data?')" style="display:inline;"> | |
| 111 | <input type="hidden" name="delete_test" value="$current.id"> | |
| 112 | <button class="btn btn-danger btn-sm">Delete</button> | |
| 113 | </form> | |
| 114 | </div> | |
| 115 | </div> | |
| 116 | ||
| 117 | <table class="table"> | |
| 118 | <thead><tr><th>Variant</th><th class="right">Traffic</th><th class="right">Exposures</th><th class="right">Conversions</th><th class="right">CR</th><th class="right">Lift</th><th class="right">Significance</th><th></th></tr></thead> | |
| 119 | <tbody> | |
| 120 | [loop:@variants] | |
| 121 | <tr> | |
| 122 | <td><strong>$name</strong>[if:$is_control] <span class="badge">CONTROL</span>[/if]</td> | |
| 123 | <td class="num">$traffic_pct%</td> | |
| 124 | <td class="num">$exposures</td> | |
| 125 | <td class="num">$conversions</td> | |
| 126 | <td class="num">$cr%</td> | |
| 127 | <td class="num">$lift%</td> | |
| 128 | <td class="num">$significance%</td> | |
| 129 | <td> | |
| 130 | <details> | |
| 131 | <summary class="muted text-sm" style="cursor:pointer;">Edit</summary> | |
| 132 | <form method="POST" action="/experiments.cgi?site_id=$site_id&id=$current.id" style="margin-top:8px;"> | |
| 133 | <input type="hidden" name="update_variant" value="$id"> | |
| 134 | <input class="form-input" name="vname" value="$name" placeholder="Name"> | |
| 135 | <input class="form-input mt-8" name="vpct" value="$traffic_pct" type="number" min="0" max="100" placeholder="Traffic %"> | |
| 136 | <textarea class="form-textarea mt-8" name="changes" placeholder='{"ops":[{"selector":".cta","op":"text","value":"Get started now"}]}'>$changes</textarea> | |
| 137 | <button class="btn btn-sm btn-primary mt-8">Save</button> | |
| 138 | </form> | |
| 139 | </details> | |
| 140 | </td> | |
| 141 | </tr> | |
| 142 | [/loop] | |
| 143 | </tbody> | |
| 144 | </table> | |
| 145 | ||
| 146 | <form method="POST" action="/experiments.cgi?site_id=$site_id&id=$current.id" style="margin-top:10px;"> | |
| 147 | <input type="hidden" name="add_variant_to" value="$current.id"> | |
| 148 | <input class="form-input" name="name" placeholder="Variant name" style="max-width:280px; display:inline-block;"> | |
| 149 | <button class="btn btn-secondary btn-sm">+ Add variant</button> | |
| 150 | </form> | |
| 151 | </div> | |
| 152 | [/if] | |
| 153 | ||
| 154 | [if:$has_tests] | |
| 155 | <div class="card"> | |
| 156 | <div class="card-header"><h3 class="card-title">All experiments</h3></div> | |
| 157 | <table class="table"> | |
| 158 | <thead><tr><th>Name</th><th>Type</th><th>Status</th><th class="right">Exposures</th><th class="right">Conversions</th><th></th></tr></thead> | |
| 159 | <tbody> | |
| 160 | [loop:@tests] | |
| 161 | <tr> | |
| 162 | <td><strong>$name</strong></td> | |
| 163 | <td>$test_type</td> | |
| 164 | <td><span class="badge $status">$status</span></td> | |
| 165 | <td class="num">$exposures_total</td> | |
| 166 | <td class="num">$conversions_total</td> | |
| 167 | <td class="right"><a class="btn btn-sm btn-ghost" href="/experiments.cgi?site_id=$site_id&id=$id">Open</a></td> | |
| 168 | </tr> | |
| 169 | [/loop] | |
| 170 | </tbody> | |
| 171 | </table> | |
| 172 | </div> | |
| 173 | [/if] | |
| 174 | ||
| 175 | [if:!$has_tests] | |
| 176 | [if:!$show_new] | |
| 177 | <div class="card" style="background: linear-gradient(135deg, rgba(255,122,61,0.08), rgba(124,58,237,0.06)); border-color: rgba(255,122,61,0.25);"> | |
| 178 | <div class="card-header"> | |
| 179 | <h3 class="card-title">Run your first experiment</h3> | |
| 180 | </div> | |
| 181 | <p class="text-sm" style="line-height:1.7; margin: 0 0 14px 0;"> | |
| 182 | An <strong>experiment</strong> is how you find out what actually converts on <em>$site_name</em>. Show two (or more) variations of the same page — a different headline, a different CTA button, a different price — and let real visitors vote with their clicks. ABForge tracks who saw what, who converted, and tells you which one won with statistical confidence. | |
| 183 | </p> | |
| 184 | <div class="row-3" style="margin-bottom: 18px;"> | |
| 185 | <div> | |
| 186 | <div style="font-weight:700; color: var(--brand-2); margin-bottom:4px;">1. Pick what to test</div> | |
| 187 | <p class="text-sm muted" style="margin:0; line-height:1.5;">Copy, layout, color, price, offer — anything you can change on a page and want to prove earns more.</p> | |
| 188 | </div> | |
| 189 | <div> | |
| 190 | <div style="font-weight:700; color: var(--brand-2); margin-bottom:4px;">2. Configure variants + traffic split</div> | |
| 191 | <p class="text-sm muted" style="margin:0; line-height:1.5;">A/B (50/50), multi-variate (any split), or holdout (5% control forever). Set a goal so we know what "winning" means.</p> | |
| 192 | </div> | |
| 193 | <div> | |
| 194 | <div style="font-weight:700; color: var(--brand-2); margin-bottom:4px;">3. Let it run — then ship the winner</div> | |
| 195 | <p class="text-sm muted" style="margin:0; line-height:1.5;">We call statistical significance for you. You get a clean recommendation, not a spreadsheet full of p-values.</p> | |
| 196 | </div> | |
| 197 | </div> | |
| 198 | <a class="btn btn-brand" href="/experiments.cgi?site_id=$site_id&new=1">+ Create your first experiment</a> | |
| 199 | <a class="btn btn-ghost" href="/goals.cgi?site_id=$site_id" style="margin-left:8px;">Set a goal first →</a> | |
| 200 | </div> | |
| 201 | [/if] | |
| 202 | [/if] |