Custom CSS & JS Tests
Test any change you can code.
Add your own CSS and JavaScript to a variation, or let AI write it for you, then test it on the pages you choose. Perfect for the changes a visual editor can’t make.
Sticky add-to-cart style test
CSS & JS test · 2 variations · Day 6
1 .product-form__submit {
2 position: sticky; bottom: 0;
3 background: #111827;
4 border-radius: 999px;
5 }}
Control
Rainbow Stripe Kids Crew
Add to cart
2.71%—conv. rate
Variation A
Rainbow Stripe Kids Crew
Add to cart
3.08%+13.7%conv. rate
How it works
From idea to live CSS & JS test in nine steps.
This is the same flow you'll use in the app. Most merchants finish setup in under ten minutes.
1Step 1 · Name your CSS & JS testName your CSS & JS testGive the test a name and a goal, like conversion rate or add-to-cart rate. The goal becomes the primary metric on your results.
Step 1 · Name your CSS & JS testName your CSS & JS testGive the test a name and a goal, like conversion rate or add-to-cart rate. The goal becomes the primary metric on your results.
app.erayaai.com/tests/style/create
Nova OutdoorsPRO+ Create New Test
Dashboard
Tests
Test Ideas
Audiences
Integrations
Settings
← BackCreate Style Test
1Name & Description
2Test Variations
3Styles & Javascript
4Targeting
5Visual & Extra Changes
6Audience
7Conversion Counting
8Configure Analytics
9Review & Launch
Style Test Details
Provide a name and description for your style test Read more
Test Name
Sticky add-to-cart style test
Choose a clear, descriptive name for your test27/100
Description (Optional)
Does a sticky, rounded add-to-cart button lift conversion rate?
Add details about your test objectives and hypothesis79/500
Primary Goal
Select the metric that will determine the winner
Conversion rate
Revenue per visitor
Average order value
Add-to-cart rate
Checkout started rate
Profit
PreviousNext
Step 2 · Split traffic between versionsSplit traffic between versionsRun your current site as the control against up to three variations, and choose how traffic is split.
app.erayaai.com/tests/style/create
Nova OutdoorsPRO+ Create New Test
Dashboard
Tests
Test Ideas
Audiences
Integrations
Settings
← BackCreate Style Test
✓Name & Description
2Test Variations
3Styles & Javascript
4Targeting
5Visual & Extra Changes
6Audience
7Conversion Counting
8Configure Analytics
9Review & Launch
Configure Style Test Variations
Set up variation names and traffic allocation for your style test Learn more →
A
Name
Control
Traffic
34%
Type
ControlB
Name
Variation A
Traffic
33%
Type
VariationC
Name
Variation B
Traffic
33%
Type
Variation+ Add Variation
Control 34%Variation A 33%Variation B 33%
Traffic is balanced — totals 100% Auto-Distribute
PreviousNext
Step 3 · Write or generate your codeWrite or generate your codeAdd custom CSS and JavaScript to each variation, or describe the change and generate it with AI. Set injection timing if your code needs to wait.
app.erayaai.com/tests/style/create
Nova OutdoorsPRO+ Create New Test
Dashboard
Tests
Test Ideas
Audiences
Integrations
Settings
← BackCreate Style Test
✓Name & Description
✓Test Variations
3Styles & Javascript
4Targeting
5Visual & Extra Changes
6Audience
7Conversion Counting
8Configure Analytics
9Review & Launch
Styles & Javascript
Add custom CSS and JavaScript to each variation.
A · ControlB · Variation A
CSSJavaScript
1 .product-form__submit {
2 position: sticky; bottom: 0;
3 background: #111827;
4 border-radius: 999px;
5 }}
✦ Generate with AIInjection timing0 ms
PreviousNext
Step 4 · Choose where it runsChoose where it runsRun the code on every page, or only on pages that match your rules.
app.erayaai.com/tests/style/create
Nova OutdoorsPRO+ Create New Test
Dashboard
Tests
Test Ideas
Audiences
Integrations
Settings
← BackCreate Style Test
✓Name & Description
✓Test Variations
✓Styles & Javascript
4Targeting
5Visual & Extra Changes
6Audience
7Conversion Counting
8Configure Analytics
9Review & Launch
Targeting
Choose the pages this CSS and JavaScript runs on.
Every pageRun the code on every page of your store.
Specific pagesOnly run the code on pages that match your rules.URL contains /products/×URL contains /collections/×+ Add rule
PreviousNext
Step 5 · Layer extra changes on topLayer extra changes on topOptional. Add an offer or a content change to any variation.
app.erayaai.com/tests/style/create
Nova OutdoorsPRO+ Create New Test
Dashboard
Tests
Test Ideas
Audiences
Integrations
Settings
← BackCreate Style Test
✓Name & Description
✓Test Variations
✓Styles & Javascript
✓Targeting
5Visual & Extra Changes
6Audience
7Conversion Counting
8Configure Analytics
9Review & Launch
Visual & extra changes
Optional. Stack extra changes onto a variation — a different template, theme, page, redirect, content edit or offer — on top of what this test already varies.
AControlBVariation A2CVariation B
BVariation AVariant33%
OOfferFree shipping over $75
CContentHero headline and badge under the price
+ Add another change
PreviousNext
Step 6 · Target the right shoppersTarget the right shoppersRun the test for every visitor or only a saved audience, such as mobile visitors.
app.erayaai.com/tests/style/create
Nova OutdoorsPRO+ Create New Test
Dashboard
Tests
Test Ideas
Audiences
Integrations
Settings
← BackCreate Style Test
✓Name & Description
✓Test Variations
✓Styles & Javascript
✓Targeting
✓Visual & Extra Changes
6Audience
7Conversion Counting
8Configure Analytics
9Review & Launch
Audiences
Decide who enters this test: pick a target audience, and set which other tests it should never run alongside. Read more
Selected Audience+ Add Audience
All VisitorsDefault
Everyone who visits your store
US mobile shoppers
Visitors from the United States on a phone
location is US AND device is mobile
Returning customers
Visitors who have been to the store before
visitor_type is returning
US mobile shoppers will be used for targeting this test.
Mutually Exclusive Tests
Stop a visitor entering this test and another one at the same time, so neither can influence the other's results.
Worth doing whenever two tests could affect the same metric. Necessary when they compete for a change only one can make — the same template, redirect or theme.
Set up exclusion groupPreviousNext
Step 7 · Decide which orders countDecide which orders countChoose whether every order counts, or only orders containing certain products.
app.erayaai.com/tests/style/create
Nova OutdoorsPRO+ Create New Test
Dashboard
Tests
Test Ideas
Audiences
Integrations
Settings
← BackCreate Style Test
✓Name & Description
✓Test Variations
✓Styles & Javascript
✓Targeting
✓Visual & Extra Changes
✓Audience
7Conversion Counting
8Configure Analytics
9Review & Launch
How would you like to measure conversions when viewing results?
This only changes how orders are counted in your results — it does not change who sees the test.
Count all orders, regardless of products in the orderEvery order placed by a visitor who saw this test counts toward your results.
Count only orders containing certain productsUseful when testing quantity discounts, bundle offers, or product-specific promotions, where unrelated purchases would skew your results.
Selected Products
2 products selected
Trail Runner JacketNova Outdoors
Packable Down VestNova Outdoors
PreviousNext
Step 8 · Pick the metrics that matterPick the metrics that matterEraya tracks 30+ metrics on every test. Choose the ones you want up front and drag them into order.
app.erayaai.com/tests/style/create
Nova OutdoorsPRO+ Create New Test
Dashboard
Tests
Test Ideas
Audiences
Integrations
Settings
← BackCreate Style Test
✓Name & Description
✓Test Variations
✓Styles & Javascript
✓Targeting
✓Visual & Extra Changes
✓Audience
✓Conversion Counting
8Configure Analytics
9Review & Launch
Configure Analytics
Eraya records 30+ metrics on every test. Choose the ones you want on the front page of your results and drag them into the order you want them in. Your Primary metric is the goal you picked in Name & Description, and always shows.
Add-to-cart ratePrimary
The goal you picked for this test
Conversion rateAlways shown
Orders divided by sessions
Average order value
Average spend per completed order
Revenue per visitor
Total revenue divided by visitors
Profit
Revenue minus product cost
PreviousNext
Step 9 · Review, preview and go liveReview, preview and go liveSee every setting on one page, then preview each variation on your store. When it looks right, take the test live.
app.erayaai.com/tests/style/create
Nova OutdoorsPRO+ Create New Test
Dashboard
Tests
Test Ideas
Audiences
Integrations
Settings
← BackCreate Style Test
✓Name & Description
✓Test Variations
✓Styles & Javascript
✓Targeting
✓Visual & Extra Changes
✓Audience
✓Conversion Counting
✓Configure Analytics
9Review & Launch
Style Test Configuration Preview
Review your style test configuration before launching.
Test Details
Test Name
Sticky add-to-cart style test
Description
Does a sticky, rounded add-to-cart button lift conversion rate?
Audience
Selected Audience
US mobile shoppers
Audience Rules
location is USdevice is mobile
Styles & Javascript
AControlControlNo custom code34% traffic
BVariation ASticky add-to-cart CSS33% traffic
CVariation BSticky bar + JS timer33% traffic
PreviousCreate Preview
Built for changes the editor can’t make.
01
Custom CSS
Restyle layouts, buttons and spacing for one variation only.
02
Custom JavaScript
Add behaviour such as sticky bars, timers or reordered sections.
03
Generate with AI
Describe the change in plain words and let AI write the code.
04
Page targeting
Run code on every page or only on the pages that match your rules.
Merchant reviews
Rated 5.0 by Shopify merchants.
“We’ve been collaborating with Eraya to enhance our pricing strategies and improve margin structures. The team has helped us move beyond basic cost plus models to deliver better value for our customers. We’re still early in the process but already seeing promising results — the Eraya team has been instrumental in designing testing strategies and analytics that work with our complex product set.”
FF
Fulton Fish MarketUnited States
Fulton Fish MarketUnited States“Love the App!! It is definitly a hidden gem. Has all the functions of the Big Player, but for a fraction of costs. Would recommend 10/10!”
M
maleup®Germany
maleup®Germany“Awesome app, easy to use and Rishabh is very helpful with anything you need”
LS
LUX SKINShopify App Store review
LUX SKINShopify App Store review