Optimize
3.3K members online now
3.3K members online now
Learn how to create your first experiment and get tips on creating A/B, redirect, and multivariate tests.
Guide Me
star_border
Reply

Hiding an element via display:none; only works in editor mode, preview still shows element

Follower ✭ ✭ ☆
# 1
Follower ✭ ✭ ☆

Hi there,

 

today I started implementing the Optimizer (via GTM) and went straight into thinking of a test (it seems to appear in the <head> section). The idea is that a specific logo (a trust logo/widget in our online shop) is visible by standard and the div-container gets a display:none for half of the visitors. So I want to see how the conversion is affected by seeing or not seeing the trust seal.

 

I therefore went into the editor mode, clicked on my element and simply chose "REMOVE". Checking the CSS (via the <> icon on the top right) it says:

 

#widget_fixed_container {
  display : none;
}

Now the web preview still shows the widget and the diagnostics says:

 

Page modified after initial load

 

I am quite unsure how to handle this now. Viewing the source code of the preview page I was hoping to find the specified CSS code, but I don't. What could someone suggest in doing?

 

Thanks a lot for reading

 

Benjamin

Marked as Best Answer.
Solution
Accepted by topic author Benjamin S
June

Hiding an element via display:none; only works in editor mode, preview still shows element

Follower ✭ ✭ ☆
# 2
Follower ✭ ✭ ☆

I might have found the issue. After changing the targeting rules it works, I might have had a little mistake in that. So I guess for anyone who experiences the same behaviour (editor = OK, preview = NOT OK) could look into the TARGETING and check for errors.

Hiding an element via display:none; only works in editor mode, preview still shows element

Participant ✭ ☆ ☆
# 3
Participant ✭ ☆ ☆

Thank you for coming back with an update for this post, you just solved my issue!

Hiding an element via display:none; only works in editor mode, preview still shows element

Follower ✭ ✭ ☆
# 4
Follower ✭ ✭ ☆

Glad I could point at least one person into the right direction. By the time using Optimize I also came across the situation that one extension in my Chrome was blocking the Optimize container. Very weird since it didn't block Tag Manager. But a bit of trial & error gave me a working preview.

 

If you carefully check that

* you used the correct variant to preview,

* the targeting is correct and works (the testing option is good since I need to fiddle around with regex a lot for targeting rules) and

* you can exclude extensions for script blocking

 

you should have a good chance to be fine.

Hiding an element via display:none; only works in editor mode, preview still shows element

Participant ✭ ☆ ☆
# 5
Participant ✭ ☆ ☆

This is really useful! I was going crazy because what I saw in edit mode didn't match what I saw in preview mode... didn't even think to check the targeting rules until I saw your post. And your other suggestions will definitely help too the next time I run into something weird. Thanks again.