PageSourceSearch

https://crazyrocket.io/support

html crazyrocket.io collected 2026-10-02 05:52:23 UTC 41,673 bytes, 1,070 lines download raw bytes

1<!doctype html>
2<html lang="en">
3
4<head>
5    <meta charset="utf-8" />
6    
7
8    <meta property="og:title" content="CrazyRocket - Boost opt-in rates and ignite sales with gamified pop-ups.">
9    <meta property="og:description" content="CrazyRocket is the gamified pop-up platform that allows you to collect up to 3x compared to classic pop-ups.">
10    <meta property="og:image" content="https://www.crazyrocket.io/assets/fb-thumbnail.jpg">
11    <meta property="og:url" content="https://www.crazyrocket.io/">
12    <meta name="twitter:card" content="summary_large_image">
13
14    <meta property="og:site_name" content="CrazyRocket">
15    <meta name="twitter:image:alt" content="Collect more e-mails and boost sales with Gamified Pop-ups. #shopify @CrazyRocketApp">
16
17
18
19    <meta name="twitter:site" content="CrazyRocketApp">
20
21    <link rel="icon" type="image/png" href="https://www.crazyrocket.io/assets/img/favicon-16x16.png">
22    <link rel="apple-touch-icon" sizes="76x76" href="https://www.crazyrocket.io/assets/img/apple-icon.png">
23    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
24
25    <title>Get started with CrazyRocket, gamified pop-ups for your Shopify store</title>
26
27    <meta content='width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0' name='viewport' />
28    <meta name="viewport" content="width=device-width" />
29
30    <link href="https://www.crazyrocket.io/assets/css/bootstrap.min.css" rel="stylesheet" />
31    <link href="https://www.crazyrocket.io/assets/css/paper-kit.css" rel="stylesheet" />
32    <link href="https://www.crazyrocket.io/assets/crazyrocket.css" rel="stylesheet" />
33
34    <link rel="preconnect" href="https://fonts.googleapis.com">
35    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
36    <link href="https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap" rel="stylesheet">
37
38
39    <link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.4.1/css/all.css" integrity="sha384-5sAR7xN1Nv6T6+dT2mhtzEpVJvfS3NScPQTrOxhwjIuvcA67KV2R5Jz6kr4abQsz" crossorigin="anonymous">
40
41
42    <!-- cookie consent -->
43    <link rel="stylesheet" href="https://cdn.jsdelivr.net/gh/orestbida/[email protected]/dist/cookieconsent.css" />
44
45    <style>
46        body {
47            font-family: "Poppins", sans-serif;
48            -webkit-font-smoothing: antialiased;
49            -moz-osx-font-smoothing: grayscale;
50        }
51
52        .navbar .navbar-brand {
53            padding-left: 0;
54            margin-left: 0;
55        }
56
57        .navbar .navbar-translate {
58            margin-left: -20px;
59        }
60
61        /* Nav links — always dark (default for all pages) */
62        .navbar .navbar-nav .nav-item .nav-link {
63            color: #333 !important;
64            text-shadow: none;
65        }
66
67            .shopify, .shopify-home {
68            background-color: #8bc249;
69            border-color: #8bc249;
70            font-size: 15px !important;
71            padding-left: 10px !important;
72            color: #ffffff !important;
73            --rem: 16;
74            transition: all 0.5s ease;
75            border: none;
76            border-radius: 30px;
77            box-shadow: none;
78            cursor: pointer;
79            display: inline-block;
80            font-weight: 600;
81            font-size: 18px;
82            padding: 0 18px;
83            line-height: 50px;
84            text-align: center;
85            text-decoration: none;
86            -webkit-user-select: none;
87            touch-action: manipulation;
88        }
89
90            .shopify:hover {
91            
92            }
93    </style>
94</head>
95
96<body class="profile">
97    <!-- Floating cookie settings button -->
98    <a href="#" onclick="CookieConsent.showPreferences(); return false;" id="cc-settings-btn" title="Cookie Settings" style="position:fixed;bottom:14px;left:14px;z-index:9999;font-size:28px;text-decoration:none;background:rgba(255,255,255,0.9);width:44px;height:44px;border-radius:50%;display:flex;align-items:center;justify-content:center;box-shadow:0 2px 8px rgba(0,0,0,0.15);transition:transform 0.2s;cursor:pointer" onmouseover="this.style.transform='scale(1.15)'" onmouseout="this.style.transform='scale(1)'">🍪</a>
99
100    <nav class="navbar navbar-expand-lg fixed-top navbar-transparent nav-down" color-on-scroll="150">
101        <div class="container">
102            <div class="navbar-translate">
103                <div class="navbar-header">
104                    <a class="navbar-brand" href="/"><img id="logo-white" src='https://www.crazyrocket.io/content/logo-small.png'></a>
105                </div>
106                <button class="navbar-toggler navbar-burger" type="button" data-toggle="collapse" data-target="#navbarToggler" aria-controls="navbarTogglerDemo02" aria-expanded="false" aria-label="Toggle navigation">
107                    <span class="navbar-toggler-bar"></span>
108                    <span class="navbar-toggler-bar"></span>
109                    <span class="navbar-toggler-bar"></span>
110                </button>
111            </div>
112            <div class="collapse navbar-collapse">
113                <ul class="navbar-nav ml-auto">
114
115                    <li class="nav-item">
116                        <a class="nav-link" href="/#features"><span style="float:left;margin-left:10px">Features</span></a>
117                    </li>
118                    <li class="nav-item">
119                        <a class="nav-link" href="/pricing"><span style="float:left;margin-left:10px">Pricing</span></a>
120                    </li>
121                    <li class="nav-item">
122                        <a class="nav-link" href="/support"><span style="float:left;margin-left:10px">Support</span></a>
123                    </li>
124                    <li class="nav-item" style="margin-left:10px; margin-top:-5px">
125                        <a style="padding-left:20px !important; margin-top:-5px" class="install-app btn btn-round shopify">
126                            INSTALL
127                        </a>
128                    </li>
129                </ul>
130            </div>
131        </div>
132    </nav>
133
134    
135
136<style>
137    /*.header-image {
138        -webkit-filter: drop-shadow(12px 12px 45px rgba(0,0,0,0.5));
139    }*/
140    body {
141        color: #2f2f2f;
142    }
143
144    .card-pricing ul li {
145        margin-bottom: 0 !important;
146    }
147</style>
148<style type="text/css">
149    .full-screen .background .container {
150        margin-top: 5%;
151    }
152
153    .full-screen.login .demo-card {
154        background-color: #F36A7C;
155        color: #ffffff !important;
156        max-width: 100%;
157        box-shadow: 0px 10px 10px -5px rgba(0,0,0,0.5);
158    }
159
160
161
162    .title {
163        font-size: 30px;
164    }
165
166    body {
167        color: #333 !important;
168        background-color: #ffffff;
169    }
170
171    a {
172        color: #000000;
173    }
174
175    .field-validation-error {
176        display: block;
177        clear: both;
178        color: #000000;
179        margin-top: 5px;
180        width: 100%;
181    }
182
183    h2 {
184        color: white !important;
185    }
186
187    h4 {
188        font-size: 18px;
189    }
190
191    .space-top {
192        margin-top: 20px;
193    }
194
195
196
197    .card-body ul {
198        padding: 20px !important;
199        margin-bottom: 0 !important;
200    }
201
202    .swal2-title {
203        color: #333 !important;
204    }
205</style>
206
207<style>
208
209
210
211
212    body {
213        background-color: #fcfbff;
214        background-position: top;
215    }
216
217    h6, h2 {
218        color: #333 !important;
219        margin-bottom: 20px;
220        font-weight: 700;
221    }
222
223    h5.description {
224        color: #6c757d !important;
225        font-weight: 400;
226        font-size: 1.1rem;
227        line-height: 1.6;
228    }
229
230    .first-container {
231        margin-top: 120px;
232    }
233
234    .card-body {
235        font-size: 18px !important;
236        padding-top: 0 !important;
237    }
238
239    .category-filters {
240        display: flex;
241        flex-wrap: wrap;
242        gap: 12px;
243        justify-content: center;
244    }
245
246    .filter-btn {
247        background: transparent;
248        border: none;
249        color: #333;
250        padding: 8px 16px;
251        font-size: 16px;
252        font-weight: 600;
253        cursor: pointer;
254        border-radius: 20px;
255        outline: none;
256        transition: background-color 0.2s ease, color 0.2s ease, box-shadow 0.2s ease;
257    }
258
259        .filter-btn:hover {
260            color: #007bff;
261        }
262
263        .filter-btn.active {
264            background: #333;
265            color: white;
266            box-shadow: 0 2px 8px rgba(0, 0, 0, 0.2);
267        }
268
269        .filter-btn:focus {
270            outline: none;
271            box-shadow: none;
272        }
273
274    #articles-container {
275        opacity: 1;
276        transition: opacity 0.3s ease;
277    }
278
279        #articles-container.fade-out {
280            opacity: 0.3;
281        }
282
283    /* Copy to clipboard styles */
284    .code-container {
285        position: relative;
286        margin: 15px 0;
287    }
288
289        .code-container code,
290        .code-container pre {
291            background-color: #f8f9fa;
292            border: 1px solid #e9ecef;
293            border-radius: 6px;
294            padding: 12px 45px 12px 15px;
295            display: block;
296            font-family: 'Courier New', Consolas, monospace;
297            font-size: 14px;
298            line-height: 1.4;
299            overflow-x: auto;
300            position: relative;
301        }
302
303    .copy-btn {
304        position: absolute;
305        top: 8px;
306        right: 8px;
307        background: #6c757d;
308        color: white;
309        border: none;
310        border-radius: 4px;
311        padding: 6px 8px;
312        cursor: pointer;
313        font-size: 12px;
314        transition: all 0.2s ease;
315        z-index: 10;
316    }
317
318        .copy-btn:hover {
319            background: #495057;
320        }
321
322        .copy-btn.copied {
323            background: #28a745;
324        }
325
326        .copy-btn i {
327            font-size: 11px;
328        }
329
330    /* Styles for code snippets with copy buttons */
331    .code-snippet {
332        position: relative;
333        background-color: #f8f9fa;
334        border: 1px solid #e9ecef;
335        border-radius: 6px;
336        padding: 12px 45px 12px 15px;
337        font-family: 'Courier New', C
337onsolas, monospace;
338        font-size: 14px;
339        line-height: 1.4;
340        margin: 15px 0;
341        overflow-x: auto;
342    }
343
344    .copy-button {
345        position: absolute;
346        top: 8px;
347        right: 8px;
348        background: #6c757d;
349        color: white;
350        border: none;
351        border-radius: 4px;
352        padding: 6px 8px;
353        cursor: pointer;
354        font-size: 12px;
355        transition: all 0.2s ease;
356        z-index: 10;
357    }
358
359        .copy-button:hover {
360            background: #495057;
361        }
362
363        .copy-button.copied {
364            background: #28a745;
365        }
366</style>
367
368
369
370
371
372<div class="wrapper" style="background-color: unset !important;">
373
374
375
376    <div class="container first-container">
377        <div class="row">
378            <div class="col-md-12 text-center" style="padding-top: 30px;">
379                <!-- Alert Banner -->
380                <div style="background: linear-gradient(135deg, #ffd700 0%, #ffed4e 50%, #fff59d 100%); border-radius: 12px; padding: 15px 30px; margin: 0 0 20px 0; box-shadow: 0 4px 15px rgba(255, 215, 0, 0.3); border: 1px solid rgba(255, 193, 7, 0.4);">
381                    <div style="display: flex; align-items: center; justify-content: center; gap: 12px; flex-wrap: wrap;">
382                        <i class="fas fa-exclamation-triangle" style="color: #856404; font-size: 20px;"></i>
383                        <span style="color: #856404; font-weight: 600; font-size: 16px;">Campaign Not Showing up?</span>
384                        <a href="/support/campaign-not-showing-up" style="color: #856404; font-weight: 700; text-decoration: underline; font-size: 16px;">Check this article before contacting the support.</a>
385                    </div>
386                </div>
387
388                <div style="background: linear-gradient(135deg, #f8f9fa 0%, #e9ecef 100%); border-radius: 20px; padding: 50px 40px; margin: 20px 0; box-shadow: 0 8px 25px rgba(0,0,0,0.08);">
389                    <h2 style="font-weight: 700; margin-bottom: 15px; font-size: 2.5rem; color: black;"><i class="fas fa-magic"></i> Quickstart Guides</h2>
390                    <h5 class="description">Launch in minutes. Learn pro tips.<br /> Get the most out of CrazyRocket.</h5>
391
392                    <!-- Category Filter Buttons -->
393                    <div class="category-filters" style="margin-top: 20px;">
394                        <button class="filter-btn" data-category="GET STARTED" onclick="filterArticles('GET STARTED')">Get Started</button>
395                        <button class="filter-btn" data-category="SHOPIFY" onclick="filterArticles('SHOPIFY')">Shopify</button>
396                        <button class="filter-btn" data-category="INTEGRATIONS" onclick="filterArticles('INTEGRATIONS')">Integrations</button>
397
398                        <button class="filter-btn" data-category="ADVANCED" onclick="filterArticles('ADVANCED')">Advanced</button>
399                        <button class="filter-btn" data-category="FAQ" onclick="filterArticles('FAQ')">FAQ</button>
400                        <button class="filter-btn" data-category="MARKETING" onclick="filterArticles('MARKETING')">Marketing</button>
401                        <button class="filter-btn" data-category="ALL" onclick="filterArticles('ALL')">All</button>
402                    </div>
403                </div>
404            </div>
405        </div>
406        <div class="space-top"></div>
407        <div class="row" id="articles-container">
408            <!-- Articles will be dynamically generated here -->
409        </div>
410    </div>
411
412    <div class="container">
413        <div class="row">
414            <div class="col-md-8 ml-auto mr-auto">
415                <div id="contact" style="background: linear-gradient(135deg, #667eea 0%, #764ba2 100%); border-radius: 15px; padding: 40px; text-align: center; color: white; box-shadow: 0 10px 30px rgba(0,0,0,0.1); margin: 20px 0;">
416                    <h2 style="color: white !important; margin-bottom: 15px;">&#x1F914; Can't find what you need?</h2>
417                    <p style="font-size: 16px; color: rgba(255,255,255,0.9); margin-bottom: 15px;">
418                        Our <a href="#" onclick="$crisp.push(['do', 'chat:open']); return false;" style="color: white; text-decoration: underline; font-weight: 600;">AI Support</a> is trained on all guides, FAQs, and real tickets.<br />
419                        If it can't solve it, a human expert will get back to you as soon as possible.
420                    </p>
421
422                    <p style="font-size: 16px; color: rgba(255,255,255,0.9); margin-bottom: 25px;">
423                        &bull; We'll reply as soon as possible from 9 AM to 8 PM CET.<br /><br />
424                        &bull; We always reply to support requests. If you don't receive a reply within 12 hours, please try to contact us again at hello[at]crazyrocket[dot]io
425                    </p>
426
427                    <div style="display: flex; gap: 20px; justify-content: center; flex-wrap: wrap;">
428                        <a href="#" onclick="$crisp.push(['do', 'chat:open'])" style="background: rgba(255,255,255,0.2); color: white; padding: 12px 24px; border-radius: 25px; text-decoration: none; transition: all 0.3s ease; display: inline-flex; align-items: center; gap: 8px; backdrop-filter: blur(10px);" onmouseover="this.style.background='rgba(255,255,255,0.3)'" onmouseout="this.style.background='rgba(255,255,255,0.2)'">
429                            <i class="fas fa-comment"></i> CONTACT SUPPORT
430                        </a>
431                    </div>
432                </div>
433            </div>
434        </div>
435
436        <div class="row">
437            <div class="col-md-8 ml-auto mr-auto text-center" style="margin-top: 30px;">
438                <a href="/support/all-articles" style="background: linear-gradient(135deg, #51cbce 0%, #667eea 100%); color: white; padding: 14px 32px; border-radius: 30px; text-decoration: none; font-weight: 600; font-size: 16px; display: inline-flex; align-items: center; gap: 10px; box-shadow: 0 6px 20px rgba(81, 203, 206, 0.4); transition: all 0.3s ease;" onmouseover="this.style.transform='translateY(-2px)'; this.style.boxShadow='0 8px 25px rgba(81, 203, 206, 0.5)'" onmouseout="this.style.transform='translateY(0)'; this.style.boxShadow='0 6px 20px rgba(81, 203, 206, 0.4)'">
439                    <i class="fas fa-list"></i> All support articles
440                </a><br><br><br>
441            </div>
442        </div>
443
444        <div class="space-top"></div>
445
446        <div class="space-top"></div>
447    </div>
448</div>
449
450<script>
451// All articles data
452    var allArticles = [
453            {
454            link: '/support/campaign-not-showing-up',
455            title: 'Spin Wheel Not Showing Up',
456            category: 'TROUBLESHOOTING',
457            description: 'Solve the most common issue when campaigns don\'t appear on your site.',
458            imageUrl: 'https://www.crazyrocket.io/content/campaign-not-showing.jpg',
459            categories: ['GET STARTED', 'FAQ', 'SHOPIFY']
460        },
461        {
462            link: '/support/faq',
463            title: 'FAQ & Troubleshooting',
464            category: 'Got questions?',
465            description: 'Check our FAQ and solve most common issues.',
466            imageUrl: 'https://www.crazyrocket.io/content/faq.jpg',
467            categories: ['FAQ']
468        },
469        {
470            link: '/support/install-on-shopify',
471            title: 'Install on Shopify',
472            category: 'SETUP',
473            description: 'Install CrazyRocket on your shop in 3 minutes.',
474            imageUrl: 'https://www.crazyrocket.io/content/install1.jpg',
475            categories: ['SHOPIFY']
476        },
477        {
478            link: '/support/install-on-woocommerce',
479            title: 'Install on WooCommerce',
480            category: 'SETUP',
481            description: 'Install on WooCommerce in 3 minutes.',
482            imageUrl: 'https://www.crazyrocket.io/content/install-woo.jpg',
483            categories: ['GET STARTED']
484        },
485        {
486            link: '/support/create-campaign',
487            title: 'Launch your first campaign',
488            category: 'GET STARTED',
489            description: 'Time to have fun! Let\'s launch your first campaign.',
490            imageUrl: 'https://www.crazyrocket.io/content/create1.jpg',
491            categories: ['GET STARTED', 'SHOPIFY']
492        },
493        {
494            link: '/support/schedule-campaign',
495            title: 'Schedule Your Campaign',
496            category: 'GET STARTED',
497            description: 'Set start and end dates for your campaign and get notified when it starts or ends.',
498            imageUrl: 'https://www.crazyrocket.io/content/schedule-campaigns.jpg',
499            categories: ['GET STARTED', 'ADVANCED']
500        },
501        {
502            link: '/support/shopify-flow',
503            title: 'Shopify Flow Integration',
504            category: 'SHOPIFY',
505            description: 'Automate workflows with Shopify Flow when customers join your campaigns.',
506            imageUrl: 'https://www.crazyrocket.io/content/shopify-flow-integration.jpg',
507            categories: ['SHOPIFY', 'INTEGRATIONS']
508        },
509        {
510            link: '/support/embed-spin-wheel-on-landing-page',
511            title: 'Embed on Your Landing Page',
512            category: 'SETUP',
513            description: 'Embed your campaign on a landing page (Premium Plan)',
514            imageUrl: 'https://www.crazyrocket.io/content/embedding.jpg',
515            categories: ['ADVANCED']
516        },
517        {
518            link: '/support/zapier-webhook',
519            title: 'Zapier Webhook',
520            category: 'INTEGRATIONS',
521            description: 'Send collected e-mails to a Zapier Webhook',
522            imageUrl: 'https://www.crazyrocket.io/content/zapier-webhook0.jpg',
523            categories: ['INTEGRATIONS']
524        },
525        {
526            link: '/support/omnisend',
527            title: 'Omnisend Integration',
528            category: 'INTEGRATIONS',
529            description: 'Send collected e-mails to Omnisend automatically.',
530            imageUrl: 'https://www.crazyrocket.io/content/omnisend0.jpg',
531            categories: ['INTEGRATIONS']
532        },
533        {
534            link: '/support/campaignmonitor',
535            title: 'CampaignMonitor Integration',
536            category: 'INTEGRATIONS',
537            description: 'Send collected e-mails to CampaignMonitor automatically.',
538            imageUrl: 'https://www.crazyrocket.io/content/campaignmonitor0.jpg',
539            categories: ['INTEGRATIONS']
540        },
541        {
542            link: '/support/activecampaign',
543            title: 'ActiveCampaign Integration',
544            category: 'INTEGRATIONS',
545            description: 'Send collected e-mails to ActiveCampaign automatically.',
546            imageUrl: 'https://www.crazyrocket.io/content/activecampaign0.jpg',
547            categories: ['INTEGRATIONS']
548        },
549        {
550            link: '/support/mailchimp',
551            title: 'Mailchimp Integration',
552            category: 'INTEGRATIONS',
553            description: 'Send collected e-mails to Mailchimp automatically.',
554            imageUrl: 'https://www.crazyrocket.io/content/mailchimp0.jpg',
555            categories: ['INTEGRATIONS']
556        },
557        {
558            link: '/support/klaviyo',
559            title: 'Klaviyo Integration',
560            category: 'INTEGRATIONS',
561            description: 'Send collected e-mails to Klaviyo automatically.',
562            imageUrl: 'https://www.crazyrocket.io/content/klaviyo0.jpg',
563            categories: ['INTEGRATIONS']
564        },
565        {
566            link: '/support/brevo',
567            title: 'Brevo Integration',
568            category: 'INTEGRATIONS',
569            description: 'Send collected e-mails to Brevo automatically.',
570            imageUrl: 'https://www.crazyrocket.io/content/brevo0.jpg',
571            categories: ['INTEGRATIONS']
572        },
573        {
574            link: '/support/mailerlite',
575            title: 'MailerLite Integration',
576            category: 'INTEGRATIONS',
577            description: 'Send collected e-mails to MailerLite automatically.',
578            imageUrl: 'https://www.crazyrocket.io/content/mailerlite0.jpg',
579            categories: ['INTEGRATIONS']
580        },
581        {
582            link: '/support/conversion-script',
583            title: 'Conversion Tracking',
584            category: 'CONVERSION TRACKING',
585            description: 'Learn how to use custom tracking scripts like Google Analytics and Facebook Pixel.',
586            imageUrl: 'https://www.crazyrocket.io/content/tracking-0.jpg',
587            categories: ['ADVANCED']
588        },
589        {
590            link: '/support/behavior-driven-notification',
591            title: 'On-site Notifications',
592            category: 'TIPS',
593            description: 'Learn how to use On-site Notifications',
594            imageUrl: 'https://www.crazyrocket.io/content/bhd0.jpg',
595            categories: ['ADVANCED']
596        },
597
598        {
599            link: '/support/setup-recaptcha',
600            title: 'Setup reCAPTCHA',
601            category: 'SECURITY',
602            description: 'Protect your campaigns from bots with Google reCAPTCHA.',
603            imageUrl: 'https://www.crazyrocket.io/content/recaptcha.jpg',
604            categories: ['ADVANCED', 'FAQ']
605        },
606        {
607            link: '/support/halloween-playbook',
608            title: '🎃 The Halloween Spin-to-Win Playbook',
609            category: 'MARKETING',
610            description: 'Launch a Halloween campaign in 15 minutes with CrazyRocket - pick a template, drop it on a page, and send a quick "Spin to Win" email.',
611            imageUrl: 'https://www.crazyrocket.io/content/halloween-playbook0.jpg',
612            categories: ['MARKETING', 'SHOPIFY']
613        },
614        {
615            link: '/support/spin-wheel-black-friday',
616            title: '🛍️ The Black Friday Spin-to-Win Playbook',
617            category: 'MARKETING',
618            description: 'Launch a Black Friday campaign in 15 minutes with CrazyRocket - select the template, embed it on a landing page, and send a compelling "Spin to Win" email.',
619            imageUrl: 'https://www.crazyrocket.io/content/bfcm-spin-wheel-shopify.png',
620            categories: ['MARKETING', 'SHOPIFY']
621        },
622        {
623            link: '/support/spin-wheel-christmas',
624            title: '🎄 The Christmas Spin-to-Win Playbook',
625            category: 'MARKETING',
626            description: 'Launch a Christmas campaign in 15 minutes with CrazyRocket - choose the festive template, embed it on a landing page, and send a joyful "Spin to Win" email.',
627            imageUrl: 'https://www.crazyrocket.io/content/xmas-spin-wheel-shopify.jpg',
628            categories: ['MARKETING', 'SHOPIFY']
629        },
630        {
631            link: '/support/spin-wheel-valentines',
632            title: '💝 The Valentine\'s Day Spin-to-Win Playbook',
633            category: 'MARKETING',
634            description: 'Launch a Valentine\'s Day campaign in 15 minutes with CrazyRocket - pick the template, drop it on a page, and send a "Spin for Love" email.',
635            imageUrl: 'https://www.crazyrocket.io/content/valentines-spin-wheel-shopify.jpg',
636            categories: ['MARKETING', 'SHOPIFY']
637        }
638];
639
640var currentFilter = 'ALL';
641
642// Function to get category from URL hash
643function getCategoryFromHash() {
644    var hash = window.location.hash.substring(1); // Remove #
645    if (!hash) return 'GET STARTED'; // Default category
646
647    // Map hash back to category
648    var hashToCategory = {
649        'get-started': 'GET STARTED',
650        'shopify': 'SHOPIFY',
651        'integrations': 'INTEGRATIONS',
652        'marketing': 'MARKETING',
653        'advanced': 'ADVANCED',
654        'faq': 'FAQ',
655        'all': 'ALL'
656    };
657
658    return hashToCategory[hash] || 'GET STARTED';
659}
660
661// Function to render articles
662function renderArticles(articles) {
663    var container = document.getElementById('articles-container');
664    var html = '';
665
666    articles.forEach(function(article) {
667        html += '<div class="col-md-4">' +
668                '<div class="card card-plain">' +
669                '<div class="card-img-top">' +
670                '<a href="' + article.link + '">' +
671                '<img class="img" src="' + article.imageUrl + '"><br /><br />' +
672                '</a>' +
673                '</div>' +
674                '<div class="card-body">' +
675                '<a href="' + article.link + '" target="_blank"><h4 class="card-title">' + article.title + '</h4></a>' +
676                '<h6 class="card-category text-muted">' + article.category + '</h6>' +
677                '<p class="card-description">' + article.description + '</p>' +
678                '</div>' +
679                '</div>' +
680                '</div>';
681    });
682
683    container.innerHTML = html;
684}
685
686// Function to filter articles by category
687function filterArticles(category) {
688    currentFilter = category;
689    var container = document.getElementById('articles-container');
690
691    // Update URL hash only if current hash is not #contact
692    var currentHash = window.location.hash;
693    if (currentHash !== '#contact') {
694        window.history.replaceState(null, null, '#' + category.toLowerCase().replace(/\s+/g, '-'));
695    }
696
697    // Add fade-out effect
698    container.classList.add('fade-out');
699
700    // Update button states
701    var buttons = document.querySelectorAll('.filter-btn');
702    buttons.forEach(function(btn) {
703        if (btn.getAttribute('data-category') === category) {
704            btn.className = 'filter-btn active';
705        } else {
706            btn.className = 'filter-btn';
707        }
708    });
709
710    // Filter articles
711    var filteredArticles;
712    if (category === 'ALL') {
713        filteredArticles = allArticles;
714    } else {
715        filteredArticles = allArticles.filter(function(article) {
716            return article.categories.indexOf(category) !== -1;
717        });
718    }
719
720    // Wait for fade-out, then render new articles and fade-in
721    setTimeout(function() {
722        renderArticles(filteredArticles);
723        container.classList.remove('fade-out');
724    }, 150);
725}
726
727// Initialize on page load
728document.addEventListener('DOMContentLoaded', function() {
729    var currentHash = window.location.hash;
730
731    // Check if hash is #contact
732    if (currentHash === '#contact') {
733        // Don't filter, just show default articles and scroll to contact
734        filterArticles('GET STARTED');
735        setTimeout(function() {
736            var contactElement = document.getElementById('contact');
737            if (contactElement) {
738                contactElement.scrollIntoView({ behavior: 'smooth', block: 'center' });
739            }
740        }, 200);
741    } else {
742        var initialCategory = getCategoryFromHash();
743        filterArticles(initialCategory);
744    }
745
746    initializeCopyButtons();
747});
748
749// Copy to clipboard functionality
750function initializeCopyButtons() {
751    // Find all code containers and add copy buttons
752    const codeElements = document.querySelectorAll('code, pre');
753
754    codeElements.forEach(function(codeElement) {
755        // Skip if it's already wrapped or is inline code
756        if (codeElement.parentElement.classList.contains('code-container') ||
757            codeElement.tagName.toLowerCase() === 'code' && !codeElement.parentElement.tagName.toLowerCase() === 'pre') {
758            return;
759        }
760
761        // Wrap the code element in a container
762        const container = document.createElement('div');
763        container.className = 'code-container';
764        codeElement.parentNode.insertBefore(container, codeElement);
765        container.appendChild(codeElement);
766
767        // Create copy button
768        const copyBtn = document.createElement('button');
769        copyBtn.className = 'copy-btn';
770        copyBtn.innerHTML = '<i class="far fa-copy"></i>';
771        copyBtn.title = 'Copy to clipboard';
772
773        // Add click event
774        copyBtn.addEventListener('click', function() {
775            copyToClipboard(codeElement.textContent, copyBtn);
776        });
777
778        container.appendChild(copyBtn);
779    });
780}
781
782function copyToClipboard(text, button) {
783    // Create a temporary textarea to copy the text
784    const textarea = document.createElement('textarea');
785    textarea.value = text.trim();
786    document.body.appendChild(textarea);
787    textarea.select();
788    document.execCommand('copy');
789    document.body.removeChild(textarea);
790
791    // Update button to show success
792    const originalHTML = button.innerHTML;
793    button.innerHTML = '<i class="fas fa-check"></i>';
794    button.classList.add('copied');
795    button.title = 'Copied!';
796
797    // Reset button after 2 seconds
798    setTimeout(function() {
799        button.innerHTML = originalHTML;
800        button.classList.remove('copied');
801        button.title = 'Copy to clipboard';
802    }, 2000);
803}
804</script>
804
805
806
807
808    <style>
809    .footer.footer-black.footer-big {
810        background-color: #111 !important;
811        color: #e0e0e0 !important;
812        font-size: 16px !important;
813    }
814
815    .footer.footer-black.footer-big a {
816        color: #e0e0e0 !important;
817        font-size: 16px !important;
818    }
819
820    .footer.footer-black.footer-big a:hover {
821        color: #fff !important;
822    }
823
824    .footer.footer-black.footer-big .copyright {
825        background-color: transparent !important;
826        color: #aaa !important;
827        font-size: 15px !important;
828    }
829
830    .footer.footer-black.footer-big li {
831        margin-bottom: 0 !important;
832    }
833
834    .footer.footer-black.footer-big ul {
835        text-align: center !important;
836    }
837
838    .footer.footer-black.footer-big hr {
839        border-color: #333 !important;
840    }
841</style>
842<footer class="footer footer-black footer-big">
843
844    <div class="container">
845        <div class="row">
846
847            <div class="col-md-12 text-center">
848                <div class="links">
849                    <ul>
850                        <li>
851                            <a href="/support/all-articles">All Support Articles</a>
852                        </li>
853                        <li>
854                            <a href="/home/privacypolicy">Privacy &amp; Cookie Policy</a>
855                        </li>
856                        <li>
857                            <a href="#" onclick="CookieConsent.showPreferences(); return false;">Cookie Settings</a>
858                        </li>
859                        <li>
860                            <a href="/home/tos">Terms of Service</a>
861                        </li>
862                    </ul>
863                    <hr>
864                    <div class="copyright">
865                        <div class="pull-left">
866                            &copy; 
866<script>document.write(new Date().getFullYear())</script>
866, made with <i class="fa fa-heart heart"></i> by CrazyRocket - P.I. 13748061002
867                        </div>
868                    </div>
869                </div>
870            </div>
871        </div>
872    </div>
873</footer>
874
875
876
877
878    
878<script src="https://www.crazyrocket.io/assets/js/jquery-3.2.1.min.js" type="text/javascript"></script>
878
879    
879<script src="https://www.crazyrocket.io/assets/js/jquery-ui-1.12.1.custom.min.js" type="text/javascript"></script>
879
880    
880<script src="https://www.crazyrocket.io/assets/js/popper.js" type="text/javascript"></script>
880
881    
881<script src="https://www.crazyrocket.io/assets/js/bootstrap.min.js" type="text/javascript"></script>
881
882
883    
883<script src="https://www.crazyrocket.io/scripts/jquery.validate.min.js"></script>
883
884    
884<script src="https://www.crazyrocket.io/scripts/jquery.unobtrusive-ajax.js" type="text/javascript"></script>
884
885    
885<script src="https://www.crazyrocket.io/scripts/jquery.validate.unobtrusive.js" type="text/javascript"></script>
885
886
887    
887<script src="https://www.crazyrocket.io/assets/js/sweetalert2.js"></script>
887
888    
888<script src="https://www.crazyrocket.io/assets/js/paper-kit.js"></script>
888
889
890    <!-- chat -->
891    
891<script type="text/javascript">window.$crisp = []; window.CRISP_WEBSITE_ID = "c96ae38e-61cf-4d31-bb02-887c7a4f0dfb"; (function () { d = document; s = d.createElement("script"); s.src = "https://client.crisp.chat/l.js"; s.async = 1; d.getElementsByTagName("head")[0].appendChild(s); })();</script>
891
892
893
894    <!-- Google Analytics - blocked until analytics consent -->
vendor: 107 bytes, lines 894-895
894
895    <script type="text/plain" data-category="analytics" src="https://www.googletagmanager.com/gtag/js?id=
895UA-127894510-1
vendor: 19 bytes, lines 895-897
895"></script>
896
897    
897<script>
898        /* --- Tracking functions (called by cookie-consent-config.js on consent) --- */
899
900        function startAnalytics() {
901            window.dataLayer = window.dataLayer || [];
902            function gtag() { dataLayer.push(arguments); }
903            window.gtag = gtag;
904            gtag('js', new Date());
905            gtag('config', 'UA-127894510-1', { 'anonymize_ip': true });
906        }
907
908        function FbOptIn() {
vendor: 647 bytes, lines 908-920
908
909            !function (f, b, e, v, n, t, s) {
910                if (f.fbq) return; n = f.fbq = function () {
911                    n.callMethod ?
912                    n.callMethod.apply(n, arguments) : n.queue.push(arguments)
913                };
914                if (!f._fbq) f._fbq = n; n.push = n; n.loaded = !0; n.version = '2.0';
915                n.queue = []; t = b.createElement(e); t.async = !0;
916                t.src = v; s = b.getElementsByTagName(e)[0];
917                s.parentNode.insertBefore(t, s)
918            }(window, document, 'script',
919            'https://connect.facebook.net/en_US/fbevents.js');
920            fbq('init', '
920296554337619368
vendor: 52 bytes, lines 920-922
920');
921            fbq('track', 'PageView');
922        
922}
923
924        var optinHotJar = function () {
vendor: 175 bytes, lines 924-927
924
925            (function (h, o, t, j, a, r) {
926                h.hj = h.hj || function () { (h.hj.q = h.hj.q || []).push(arguments) };
927                h._hjSettings = { hjid: 
9271059700
vendor: 333 bytes, lines 927-933
927, hjsv: 6 };
928                a = o.getElementsByTagName('head')[0];
929                r = o.createElement('script'); r.async = 1;
930                r.src = t + h._hjSettings.hjid + j + h._hjSettings.hjsv;
931                a.appendChild(r);
932            })(window, document, 'https://static.hotjar.com/c/hotjar-', '.js?sv=');
933        
933}
934
935        /* --- Apollo.io tracking (marketing category) --- */
936        function initApollo() {
937            // TODO: Add your Apollo.io tracking snippet here when ready.
938            // It will only fire after marketing consent is granted.
939        }
940    </script>
940
941
942    <!-- CookieConsent v3 -->
943    
943<script defer src="https://cdn.jsdelivr.net/gh/orestbida/[email protected]/dist/cookieconsent.umd.js"></script>
943
944    
944<script defer src="https://www.crazyrocket.io/scripts/cookie-consent-config.js"></script>
944
945
946    
946<script>
947        var CrazyRocket = {};
948
949        CrazyRocket.ShopifyApiKey = "ea7da5935c92276944090810897e4901";
950
951        window.addEventListener('DOMContentLoaded', function() {
952            (function($) {
953
954                var htmlDecode = function(encodedStr) {
955                    var x = jQuery("<div/>").html(encodedStr).text();
956                    return x;
957                }
958
959                window.isAuthenticated = false;
960                window.cdn = 'https://www.crazyrocket.io/';
961                window.twitterSharingText = htmlDecode('Collect more e-mails and boost sales with Gamified Pop-ups. #shopify @CrazyRocketApp');
962
963$(".install-app").click(function () {
964                    location.href="/home/install";
965                });
966
967                $(".shopify-home").click(function () {
968                    location.href = "/home/install";
969                });
970
971
972                $("#btnShareFacebook").click(function () {
973                    var url="https://crazyrocket.io";
974                    window.open('http://facebook.com/sharer/sharer.php?u=' + encodeURIComponent(url), '', 'left=0,top=0,width=650,height=420,personalbar=0,toolbar=0,scrollbars=0,resizable=0');
975                });
976
977                $("#btnShareTwitter").click(function () {
978                    var url="https://crazyrocket.io";
979                    window.open('http://twitter.com/share?url=' + encodeURIComponent(url) + '&text=' + encodeURIComponent(window.twitterSharingText), '', 'left=0,top=0,width=550,height=450,personalbar=0,toolbar=0,scrollbars=0,resizable=0');
980                });
981
982                $("#btnShareEmail").click(function() {
983                    var url="https://crazyrocket.io";
984
985                    var br = "\r\n";
986                    var txt ="Hi,\r\n\r\nI am just reaching out to let you know about CrazyRocket, a Shopify App to collect more leads and boost sales thanks to pop-up gamification.\r\n\r\nPlease check this link: "+url;
987
988
989                    var link = "mailto:"
990                                + "?subject=" + escape("Check this amazing Shopify App")
991                                + "&body=" + escape(txt);
992
993
994                    window.location.href = link;
995
996                });
997            })(jQuery);
998
999        });
1000
1001    </script>
1001
1002
1003    
1004    
1004<script>
1005// Copy to clipboard functionality
1006function copyToClipboard(text, button) {
1007    if (navigator.clipboard && window.isSecureContext) {
1008        navigator.clipboard.writeText(text).then(function() {
1009            showCopySuccess(button);
1010        }).catch(function(err) {
1011            fallbackCopyTextToClipboard(text, button);
1012        });
1013    } else {
1014        fallbackCopyTextToClipboard(text, button);
1015    }
1016}
1017
1018function fallbackCopyTextToClipboard(text, button) {
1019    var textArea = document.createElement("textarea");
1020    textArea.value = text;
1021    textArea.style.top = "0";
1022    textArea.style.left = "0";
1023    textArea.style.position = "fixed";
1024    document.body.appendChild(textArea);
1025    textArea.focus();
1026    textArea.select();
1027
1028    try {
1029        var successful = document.execCommand('copy');
1030        if (successful) {
1031            showCopySuccess(button);
1032        }
1033    } catch (err) {
1034        console.error('Fallback: Oops, unable to copy', err);
1035    }
1036
1037    document.body.removeChild(textArea);
1038}
1039
1040function showCopySuccess(button) {
1041    var originalText = button.textContent;
1042    button.textContent = 'Copied!';
1043    button.classList.add('copied');
1044
1045    setTimeout(function() {
1046        button.textContent = originalText;
1047        button.classList.remove('copied');
1048    }, 2000);
1049}
1050
1051// Initialize copy buttons for all code elements on page load
1052document.addEventListener('DOMContentLoaded', function() {
1053    var codeSnippets = document.querySelectorAll('.code-snippet');
1054
1055    codeSnippets.forEach(function(snippet) {
1056        var button = document.createElement('button');
1057        button.className = 'copy-button';
1058        button.textContent = 'Copy';
1059        button.onclick = function() {
1060            var code = snippet.textContent.replace('Copy', '').trim();
1061            copyToClipboard(code, button);
1062        };
1063        snippet.appendChild(button);
1064    });
1065});
1066    </script>
1066
1067
1068
1069</body>
1070</html>

Line numbers count LF bytes from the start of the resource, as the search results do. Vendor segments are library code the classifier recognised; they are stored but not indexed. Bytes are shown as Latin1 characters, one per byte.