Rich-text Reply

Switch images per video at product detail page

c_molpeceres 03-24-16

Switch images per video at product detail page

Hi!

 

I'm new to Optimezely and I was trying to run a test, on the product detail pages, to see if switching to the video shows as default instead of the images improve conversion, as people that see the video converts lot better. 

 

Could someone help me with it?

 

Thanks!

 

JDahlinANF 03-24-16
 

Re: Switch images per video at product detail page

@c_molpeceres - I expect you will need your developers' input.  Without seeing your current product detail page, it's impossible to get too far into specifics, but here are a couple of general approaches you can discuss with your project team / developers:

 

Assumption: Your product detail page already has access to videos on it, perhaps as a thumbnail that the user clicks to make that the main image.

 

Approach 1: Let the page load and do a "click" on the thumbnail that causes the main image to switch to the video.  This may cause a lot of flashing, but this is probably the easiest way to make it work.

 

Approach 2: Write some javascript that determines the correct URL for the video of the product you are looking at and update the main product image to be "whatever is required to make it a video" (that may mean changing the main location from an image to a video or maybe your video is simply a large animated gif).  You may also need to change the thumbnails so that the video's thumbnail is the one that is "selected" rather than the default product thumbnail, otherwise you will have UX issues when people click them.

 

Approach 3: Have the developers write the page such that if a certain class is present on the product's wrapper, the default image is the video.  For example, if your product currently has a wrapper such as

<div id="product" class="">
 <!-- HTML here for the product -->
</div>

You could modify it to

<div id="product" class="video_first">
 <!-- HTML here for the product -->
</div>

And the product placement would automatically make the video the current image.

 

 

Re: Switch images per video at product detail page

Hi!

 

Thank you for your answer. 

 

Is quite helpful, the unique issue is that we don't have currently any backend developer in house. I think I  localize what you said on the code, although is not exactly the same. If I add "-first" to what is in bold so it showns as class+"video-first", would it work?

 

Many thanks!

 

<div id="player" class="player loading player-1459498145257 js-player-fullscreen no-fullscreen-support"><div class="video-wrapper"><div class="video"><div class="telecine invisible"><video preload=""></video></div>