Split URL created, configured and tested, everything is working as expected: traffic is being evenly distributed, query parameters are being transferred, audiences, goals, all set! We are ready to start this Split URL test, except if you also want to apply styles on the experiment pages...
Since Split URLs tests do not offer the possibility to customize/style pages through the Visual Editor, an option is to set up an "hybrid" experiment: Split URL + Personalization Experiment
1. Setup your Split URL Experiment
Create your Split URL experiment as usual, detailed instructions can be found here: Set Up Your First Split URL Experiment
2. Get the Experience and Variations IDs
Once you have finished configuring the variations of the experience, take note of the Variations IDs, from the Experience summary page, copy the link from the preview of the variation:
The link copied will be similar to this:
v=100368636 -This is the Variation ID: 100368636
e=10036216 - This is the Experience ID: 10036216
3. Setup a Personalization for your Variation Page
Now it is time to create a personalization for your variation page (details: What about Personalizations?). Use the visual editor to apply styles and customize the page.
4. Setup a Custom Audience for your Personalization
To show the personalization only to visitors coming from the Split URL Test and the specific variation, we will include a Custom Audience:
JS Condition 1: (replace with the Split URL Original Page URL)
document.referrer == "https://urlFromtheOriginalPage.com"
JS Condition 2: (replace with the Experience and Variation ID previously noted)
convert.historicalData.experiments[splitURLExpID].variation_id == "variationID"
This is it! You have successfully applied styles to a Split URL Experiment Page!