Rich-text Reply

I can't track an element after I've dragged it from another part of the page.

mikerodger123 09-22-16

I can't track an element after I've dragged it from another part of the page.

Hi guys and gals,

 

I'm setting up a goal by tracking one element on the page.

The challenge is this.

The element i'm trying to drag is dragged from another part of the page.

 

When I click on the element to track, it tracks something else.

 

What can I do about this?

JasonDahlin 09-22-16
 

Re: I can't track an element after I've dragged it from another part of the page.

Hi @mikerodger123,

From my experience, this sometimes happens when using WYSIWYG editors.

A couple of suggestions:

1- The WYSIWIG offers a couple different ways to move things around - if you used "Move and Resize" try using"Rearange" instead (or vice-versa).

 

2- If that doesn't work, try assigning "track clicks" to the element before moving it.

 

If it still doesn't work, then it's probably a pathing issue that can be easily resolved by having someone with some jQuery skills look at the page and provide you the selector that you should use to manually create the click goal.  (If you'll share a link to the page adn let us know which element you want tracked, someone in the community will let you know how to set up your click goal).

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

Re: I can't track an element after I've dragged it from another part of the page.

Thank you Jason. I've re-setup the variations and goals like you suggested.

Also, when I'm tracking an entire <div> as a goal, if someone clicks on any one of the multiple elements within that <div>, would the goal be triggered?
JasonDahlin 09-23-16
 

Re: I can't track an element after I've dragged it from another part of the page.

Hi @mikerodger123 - Yes, it should track any click inside the <div> that you are tracking.

In this example, a click on any of the <li> inside of "theThing", would meet the click goal set up on "theThing".

 

<div class="theThing">
    <ul>
        <li>...</li>
        <li>...</li>
        <li>...</li>
    </ul>
</div>
--Jason Dahlin
Analytics and Testing Guru Smiley Happy
Experimentation Hero

Re: I can't track an element after I've dragged it from another part of the page.

Hi Jason,

 

Thank you. I tested your suggestions. The goal is still not being tracked.

Is there someone / a number I can call at Optimizely with jQuery skills who I can work with?

 

Re: I can't track an element after I've dragged it from another part of the page.

Here is the link to the page I want to track:

 

http://investingnews.com/category/daily/resource-investing/precious-metals-investing/silver-investin...

 

And a screenshot of the element I want to track.

 

I want to track it after it's been re-arranged / moved-resized to the top of the page where the 2 red arrows are pointing. We don't want the element to overlap other parts of the page, so the elements below the new placement of this red-boxed element will need to slide down.

1474643902782screensave.png

 

I've tested setting the goal before AND after moving the element.

I've tried both rearranging AND moving/resizing features.

 

I think the problem is this.

 

Here's what the page looks like after the bottom element has been brought to the top:

 

Select element.png


Now, after I edit the goal, another screen opens up. In this preview mode (see screenshot below), the element isn't moved to the top of the page and therefore the element can't be selected. If you scroll to the bottom of the preview mode screen, the element at the bottom is NOT selected either (if it was it would the element would be outlined in a red box).

Edit goals.png

 

What kind of custom code or other solutions can fix this?

robertchan 09-23-16
 

Re: I can't track an element after I've dragged it from another part of the page.

The tracking you're using via the WYSIWYG is not targeting the selector you expect it to target. You can track the item you want fine by doing the following:

 

1) Create a new click goal and in the advanced section, put the following selector: 

 

.index-text-ad:eq(0) a

 

2) In console without previewing the experiment or anything (so just on the original URL), copy and paste the following code I created for you, you'll be able to see that a click is triggering for the links I assume you want to track:

 

$('.index-text-ad:eq(0) a').on('click', function(){ console.log('ELEMENT CLICKED') });
Robert Chan

Experimentation Hero