如何对web页面进行可视化埋点

1.进入之后,默认情况下是浏览模式,您需要选择“标记模式”才可以进行埋点;

2.您需要先对页面进行“标注”,用于分析页面浏览情况;

您可以对标注的页面进行命名,并可以选择标识的颜色进行区分,然后定义页面URL的规则,点击保存;

3.URL匹配规则:使用默认推荐匹配方式标注页面,根据实际需要也可以选择精确匹配和模糊匹配;

(1)推荐匹配:URL地址前面使用,默认保留最后两层。具体URL: http://*/kb/dashboard.action,标注所有以/kb/dashboard.action结尾的页面。

(2)URL地址信息完整展示,具体URL:http://www.uyunsoft.cn/kb/dashboard.action,标注URL地址为:http://www.uyunsoft.cn/kb/dashboard.action的页面信息。

(3)模糊匹配:URL规则支持一个""和两个"*",分别代表忽略部分和忽略后面,""目前只支持出现在规则的最后面。

举例如下:

http://www.yoururl.com/* 代表应用下第一级路径下的所有页面

http://www.yoururl.com/** 代表应用下第二级路径下的所有页面

http://www.yoururl.com/** 代表应用下所有页面

如果URL中带参数,一样可以利用""和"**"规则定义符合条件的页面: http://www.yoururl.com/index.php?a=\&b=*

4.标记页面元素

(1)用户要标记页面或元素,先进入“标记模式”;

(2)为了准确的匹配到元素,特对一个元素进行了多种标记, 以防标记错误的selector值导致元素匹配不到;

1)selector值为:a#create-page-button 可以匹配到 选择器a#create-page-button 和a#create-page-button>span;

2)selector值为: a#create-page-button>span,那就只能匹配到自己,是无法匹配父类a#create-page-button;

3)selector值为: header#header>nav>div>div:nth-child(1)>ul>li:nth-child(3)是无法匹配到该元素;

(3)查看标注页面信息:点击右上角的查看标注,标注后的页面信息,都会在“页面”列表中进行展现;

(4)查看元素信息:点击右上角的查看标注,标注后的页面信息,都会在“操作”列表中进行展现;

最后更新于 20th Sep 2016