Skip to content

Instantly share code, notes, and snippets.

@phy25
Created January 31, 2014 13:50
Show Gist options
  • Save phy25/8732381 to your computer and use it in GitHub Desktop.
Save phy25/8732381 to your computer and use it in GitHub Desktop.
Google Analytics 广告统计向导
<!DOCTYPE html>
<html lang="zh">
<head><meta charset="utf-8" />
<title>Google Analytics 广告统计向导</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<style>
body{font:14px "Microsoft Yahei",Arial,Helvetica,sans-serif;color:#333;margin:0;}
#wrapper{max-width:940px;width:800px;width:auto;margin:0 auto;padding:0 5px;position:relative;}
img{border:none}
label{font-weight: bold;}
abbr[title]{cursor: help; border-bottom: 1px dotted #999;}
h1{font-size:1.6em;}
h2{font-size:1.3em;margin:10px 0}
h1,h2,.clear{clear:both;}
ul{margin:5px 0 5px 60px;padding:0;}
ul li{list-style:circle;margin:0.5em 0;}
p{margin:10px 0}
a{color:#3466A6;padding:2px 4px;text-decoration: none;}
a:hover{color:#000;background:#CAE1FF}
.hide,.fuck_G_F_W{display:none}
.clear{clear:both;}
</style>
</head>
<body>
<div id="wrapper">
<h1>Google Analytics 广告统计向导</h1>
<h2>生成广告统计地址</h2>
<p>生成的地址只是指定了广告内容参数。参数建议使用英文、数字、下划线、横划线。</p>
<form id="getLink"><fieldset>
<p>
<label for="url">源地址 *</label> <input type="url" id="url" placeholder="http://" size="30" required />
<br /><small>请确保填入的页面中已经包括了 Google Analytics 统计代码,否则是不会起作用的。</small>
</p>
<p>
<label for="utm_source">广告来源 *</label>
<input type="text" id="utm_source" placeholder="newsletter" size="30" required />
<small>来自哪个网站或传单</small>
</p>
<p>
<label for="utm_medium">广告媒介 *</label>
<input type="text" id="utm_medium" placeholder="email" size="30" required />
<small>广告来源是哪一类的</small>
</p>
<p>
<label for="utm_term">广告关键词</label>
<input type="text" id="utm_term" placeholder="" size="30" />
<small>在搜索引擎投放了哪个关键词的广告</small>
</p>
<p>
<label for="utm_content">广告内容</label>
<input type="text" id="utm_content" placeholder="" size="30" />
<small>指向同一页面的广告内容有什么不同</small>
</p>
<p>
<label for="utm_campaign">广告名称 *</label>
<input type="text" id="utm_campaign" placeholder="newproduct" size="30" required />
<small>广告的是什么东西</small>
</p>
<p>
<label for="useanchor">使用 # 代替 ? 统计</label> <input type="checkbox" id="useanchor" />
<br /><small>如果统计代码设置了 <a href="https://developers.google.com/analytics/devguides/collection/gajs/methods/gaJSApiCampaignTracking#_gat.GA_Tracker_._setAllowAnchor" target="_blank">_setAllowAnchor(true)</a>,此项要选中。<br />不建议使用这种统计方式,很容易丢广告参数。</small>
</p>
<p>
<input id="getLinkSubmit" type="submit" value="生成" />
<span id="result" class="hide">
<input type="text" id="result_url" size="30" />
</span>
</p>
</fieldset></form>
<h2>几个例子</h2>
<p>不必同时使用中英文标识。前三个例子来自 <a href="http://support.google.com/analytics/answer/1037445?hl=zh-CN"><abbr title="Google Analytics">GA</abbr> 帮助中心文章</a>。</p>
<table>
<tbody>
<tr>
<td>&nbsp;</td>
<td><strong>横幅广告</strong></td>
<td><strong>电子邮件广告系列</strong></td>
<td><strong>每次点击付费关键字</strong></td>
<td><strong>通过微博发出的广告</strong></td>
<td><strong>博客里的广告</strong></td>
</tr>
<tr>
<td><strong>广告来源 utm_source</strong></td>
<td>生活搜索 citysearch</td>
<td>简报1 newsletter1</td>
<td>搜索推广 overture</td>
<td>新浪微博 sinat</td>
<td>博客 blog</td>
</tr>
<tr>
<td><strong>广告媒介 utm_medium</strong></td>
<td>横幅 banner</td>
<td>电子邮件 email</td>
<td>每次点击费用 cpc</td>
<td>推送链接 pushlink</td>
<td>博客 inlinelink</td>
</tr>
<tr>
<td><strong>广告关键词 utm_term</strong></td>
<td>波士顿 Boston</td>
<td>7月 July</td>
<td><em>[所购买的关键字]</em></td>
<td>&nbsp;</td>
<td>&nbsp;</td>
</tr>
<tr>
<td><strong>广告内容 utm_content</strong></td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>&nbsp;</td>
<td>更新 update</td>
<td>我的名字 my_name</td>
</tr>
<tr>
<td><strong>广告名称 utm_campaign</strong></td>
<td>产品A productA</td>
<td>产品A productA</td>
<td>产品A productA</td>
<td><abbr title="博客页面">blog/1.html</abbr></td>
<td>关于我 about</td>
</tr>
</tbody></table>
<p>几个小提示:</p>
<ol>
<li>仅在需要时添加标记</li>
<li>仅使用您需要的广告系列变量</li>
</ol>
<h2>查看统计报告</h2>
<p>在 <a href="https://www.google.com/analytics/web/">Google Analytics 后台</a> 的 报告 &raquo; 标准报表 &raquo; 流量来源 &raquo; 来源 &raquo; 广告系列 查看。</p>
<hr />
<p>&copy; <a href="//phy25.com/">Phy</a> @ <a href="//zenzone.tk/">ZENZONE</a> 2013</p>
</div>
<script>
//------------------------------------
// heavily based on the Quirksmode addEvent contest winner, John Resig
// addEvent
function addEvent(obj, type, fn){
if(obj && obj.addEventListener) obj.addEventListener(type,fn,false);
else if(obj.attachEvent){
obj["e"+type+fn]=fn;
obj[type+fn]=function(){obj["e"+type+fn](window.event);}
obj.attachEvent("on"+type,obj[type+fn]);
}
}
function $id(id){
return document.getElementById(id);
}
addEvent($id('getLink'), 'submit', function(e){
var result;
result = $id('url').value;
if($id('useanchor').checked){
result += '#';
}else{
result += '?';
}
result += 'utm_source=' + encodeURIComponent($id('utm_source').value);
result += '&utm_medium=' + encodeURIComponent($id('utm_medium').value);
result += '&utm_campaign=' + encodeURIComponent($id('utm_campaign').value);
if($id('utm_term').value) result += '&utm_term=' + encodeURIComponent($id('utm_term').value);
if($id('utm_content').value) result += '&utm_content=' + encodeURIComponent($id('utm_content').value);
$id('result').style.display = 'inline';
$id('result_url').value = result;
$id('result_url').select();
$id('getLinkSubmit').value = '生成并全选';
e.preventDefault();
return false;
});
</script>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment