Rich-text Reply

Variations mixing with original after saving

lthornton 06-02-16
Accepted Solution

Variations mixing with original after saving

I'm trying to AB test a h1 header on my site and after making the variation with the different copy, once I save and then go out to preview it, it looks like it saved the variation with parts of the orginal and the change made. Why is this occuring and how do I fix it?

robertchan 06-02-16
 

Re: Variations mixing with original after saving

Sometimes after saving, the cache has yet to refresh. For a quick fix, go to options and click on Experiment Type and hit apply. That will refresh the cache.

You can also check that what you're previewing is the latest revision of your edits by entering console and typing optimizely.revision - compare the number in your preview with the number you get after you hit save in your experiment.
Robert Chan

Experimentation Hero
CouchPsycho 06-02-16
 

Re: Variations mixing with original after saving

[ Edited ]

You mean for example:

Your h1-original is "What a great headline." and your h1-variation is "Do wah diddy diddy dum diddy do" and when you preview the variation you get something like "What a dumdiddy do" ?

 

Soory haven't seen the experts reply...




"the essence of the creative act is to see the familiar as strange." (anonymous)
lthornton 06-02-16
 

Re: Variations mixing with original after saving

Yes it exactly did that!

JasonDahlin 06-02-16
 

Re: Variations mixing with original after saving

Hi @lthornton,

Can share a link to a page where the experiment is running (if you have force parameters enabled, a URL where the test should run and the Experiment ID is enough to let us force the experiment on that page, even if your experiment is not actually live).

--Jason Dahlin
Analytics and Testing Guru Smiley Happy
Experimentation Hero
lthornton 06-02-16
 

Re: Variations mixing with original after saving

It's www.springbot.com. The experiment is paused right now though.

lthornton 06-03-16
 

Re: Variations mixing with original after saving

@JasonDahlinIt seems to be the problem is that Optimizely isn't saving the variation correctly. It's only includes part of the headline change.
lthornton 06-03-16
 

Re: Variations mixing with original after saving

@CouchPsycho do you know of any solution to this?
CouchPsycho 06-03-16
 

Re: Variations mixing with original after saving

To help you, i need to see the generated Javascript Code of each variation. Can you post it?



"the essence of the creative act is to see the familiar as strange." (anonymous)
lthornton 06-03-16
 

Re: Variations mixing with original after saving

@CouchPsycho I think this is it. 

<script src="//cdn.optimizely.com/js/6044230997.js"></script><script id="optimizely_synchronous_script_89073" src="//optimizely.s3.amazonaws.com/js/preview/d9e285f69c7041ff5cc9df6bdbe680138bd79e2ab4b219087821244a46a2fe99.js"></script>

CouchPsycho 06-03-16
 

Re: Variations mixing with original after saving

Not really :-) At the bottom of you optimizely editor window there is a part for the javascript its label says "edit code" or "hide code", depending on if it is already opended or not. Within this part, you see the JS-Code of your variation and this is exactly the code i was talking about.



"the essence of the creative act is to see the familiar as strange." (anonymous)
lthornton 06-03-16
 

Re: Variations mixing with original after saving

@CouchPsycho I see what your taking about. Posting it below. The original text is "8 Omnichannel Marketing Strategies to Help Your Store Increase Purchases by 45%". The variation is "Fashion, the Ecommerce Evolution and the Omnichannel Imperative"

$("#fancy-title-574f30abaa89c > span").replaceWith("<span style=\"\">8 Omnichannel Marketing Strategies to Help Your Store<br>\n <span id=\"bar\">Increase Purchases by <b>45%</b></span></span>");
$("#fancy-title-574f58b79fbf6 > span").replaceWith("<span style=\"\">8 Omnichannel Marketing Strategies to Help Your Store<br>\n<span id=\"bar\">Increase Purchases by<b>45%</b></span></span>");
$("b").replaceWith("<b style=\"color: #3eb049\">45%</b>");
$(".button-574f5a6f93645").replaceWith("<a href=\"http://bit.ly/1TNqNMR\" target=\"_self\" class=\"mk-button outline-btn-light button-574f5a6f93645 light outline-dimension large rounded\" onclick=\"_gaq.push(['_trackEvent', 'outbound-article', 'http://bit.ly/25By4Xr', 'Download the eBook']);\"><span>Download the eBook</span></a>");
$("#fancy-title-574f5a6f93394 > span").replaceWith("<span style=\"\">8 Omnichannel Marketing Strategies<br>\n<span id=\"bar\">to Help Your Store Increase Purchases by<b style=\"color: #3eb049\">45%</b></span></span>");
$("#fancy-title-574f5addc5684 > span").replaceWith("<span style=\"\">8 Omnichannel Marketing Strategies to Help Your Store<br>\n<span id=\"bar\">Increase Purchases by <b style=\"color: #3eb049\">45%</b></span></span>");
$("#fancy-title-57502e7fbbea3 > span").replaceWith("<span style=\"\">8 Omnichannel Marketing Strategies<br>\n<span id=\"bar\">to Help Your Store Increase Purchases by <b style=\"color: #3eb049\">45%</b></span></span>");
$("#fancy-title-57504a0757d28 > span").html("8 Omnichannel Marketing Stratergies<br>\n<span id=\"bar\">to Help Your Store Increase Purchases by <b style=\"color: #3eb049;\">45%</b></span>");
$("#fancy-title-57504eb98d07f").html("<span>8 Omnichannel Marketing Strategies<br>\n<span id=\"bar\">to Help Your Store Increase Purchases by <b style=\"color: #3eb049;\">45%</b></span></span>");
$("#fancy-title-575052d3e154a > span").replaceWith("<span style=\"\">8 Omnichannel Marketing Strategies <br>\nto Help Your Store Increase Purchases by <b style=\"color: #3eb049\">45%</b></span>");
$("#fancy-title-5750686e66684 > span").replaceWith("<span style=\"\">\nFashion, the Ecommerce Evolution\n<br>\n<span id=\"bar\">and the Omnichannel Imperative</span>");
$("#fancy-title-5750716b7b507 > span").replaceWith("<span style=\"\">Fashion, the Ecommerce Evolution\n<br>\n<span id=\"bar\">and the Omnichannel Imperative<b style=\"color: #3eb049\">45%</b></span></span>");
$("#bar").replaceWith("<span id=\"bar\">and the Omnichannel Imperative</span>");
$("#fancy-title-575191260fa99 > span").replaceWith("<span style=\"\">Fashion, the Ecommerce Evolution<br>\n<span id=\"bar\">and the <b>Omnichannel Imperative</b></span></span>");
JasonDahlin 06-03-16
 

Re: Variations mixing with original after saving

Hi @lthornton,

At least one of code in experiment 6054970232 seems incorrect.  It contains two "span opens" but only one "span close".  There should be another </span> in this line.

$("#fancy-title-5750686e66684 > span").replaceWith("<span style=\"\">\nFashion, the Ecommerce Evolution\n<br>\n<span id=\"bar\">and the Omnichannel Imperative</span>");

On the homepage, only 2 lines of code in your variation have a match on the homepage:

$("b").replaceWith("<b style=\"color: #3eb049\">45%</b>"); 
$("#bar").replaceWith("<span id=\"bar\">and the Omnichannel Imperative</span>");

None of the others match (see screen shot on pasteboard.co - the empty "Object [ ]" tells us there is no match for that line of code.  Not sure if those are supposed to exist on the homepage or not. 

 

Is it possible that your site-editor modified the page's Hero spot from $('#fancy-title-574f30abaa89c') to $('#fancy-title-5751afd0c4f80')?  If so, then what you have will need to be re-coded to match the new numbers in the fancy titles.  But, this also raises the issue that if these numbers are controlled outside of the experiment, you will need to modify the experiment every time they change on the site.

 

 

 

 

--Jason Dahlin
Analytics and Testing Guru Smiley Happy
Experimentation Hero
CouchPsycho 06-03-16
 

Re: Variations mixing with original after saving

Hi, try the advice of @JasonDahlin . If it does not help, i will have a look at your code :-)



"the essence of the creative act is to see the familiar as strange." (anonymous)
lthornton 06-03-16
 

Re: Variations mixing with original after saving

Figure it out. It was due to the dynamic selector but thankfully there was a solution for it here.

https://help.optimizely.com/QA_and_Troubleshoot/Using_Dynamic_Selectors

 

Thanks to David, @CouchPsycho@JasonDahlin for the help though. 

JasonDahlin 06-03-16
 

Re: Variations mixing with original after saving

Hi @lthornton,

Exactly what I thought.

Be sure to take a look at the code that the WYSIWYG editor creates for you once you remove the dynamic selectors.  Often, when an ID is not available, I see WYSIWIG editors create code like

 

$('h1:eq(3)');

 

Which may be a fine way to target your page's 4th <h1> right now, but if you or another content editor happens to add a new <h1> above the one you are looking at, you will suddenly be attempting to change the new 4th <h1>. tag when the one you really want to change is now the 5th. (Similar if you are trying to target the last item in a set, the WYSIWIG may grab the 4th one and you think everything is fine, but when you expand the set to 6 items, it is still grabbing the 4th rather than the "last".

 

IMO, if you are able to add custom classes to the items that you want to modify, you should do so.  Edit the page and add unique classes to each thing that you want to modify then use Optimizely to target *those* classes.  I see one of the items on your page now has the class "optimizely-12345" on it, so maybe this is already your plan.

--Jason Dahlin
Analytics and Testing Guru Smiley Happy
Experimentation Hero