出来混，迟早要还的。不知道我国的山寨先驱王兴老师对美团如今被铺天盖地的山寨感受如何（虽然也是一山寨）？他就是旗帜，他就是方向。这导致只要口袋里还有200块钱（域名+主机）的人，就相信自己可能是个CEO了。无数团购网站如闻到肉味的蚂蚁一般在全国各地冒出来，大量农民工找到了创业的解决方案，好吧，这也可以算是件好事。
能不能把这些分散的团购资源集中到一起展示，让消费者可以货比三家？作为团购垂直分类的hao123——团购导航应运而生。
凭借第三方在线工具的协助，通过对 WordPress 的定制可以迅速实现这一项目，节省全新开发所需要的时间成本和人力成本。
首先确定需要实现的功能和呈现方式：
- 自动获取自动发布；
- 列表页/首页显示每个产品的5个字段：名称、缩略图、当前价格、原始价格、结束时间。
- 详细页可以看到产品具体信息，重要的是，让它看起来真的像是我们经验中的产品展示的样子，而不是一篇普通的博客文章。
- 可以按地区查看，毕竟本地服务是这类站点的一个特色。
如何避免目前大多数团购导航存在的问题：
- 首页文件过大，大部分直接读取了原始大小的图片（只是缩放了显示尺寸）。
解决方案：本地生成小尺寸的缩略图；
- 获取字段过多，频繁获取几十个站点的数据，导致运行效率低下，经常造成浏览器假死。
解决方案：去掉“目前团购人数”，这不是消费者重点关注的内容，为了这个数字频繁取值损失效率得不偿失。只在目标站点更新的时候获取一次数据就够了。宗旨是：简单，易用（够用就好）
方案确定之后就可以开工了——
第一步：用第三方在线工具把目标站点抓取成Feed。
通过Yahoo pipes、Feed43或者 Dapper 把目标站的内容按照需要烧制成Feed。
由于Feed只有3个字段：标题、内容和时间，除了这3个字段，我们还需要当前价格、原始价格和团购结束时间。
方法是把这3个数据追加到标题上，用一个特殊符号“︰”间隔开（便于后期处理），注意这个不是冒号，只是个貌似冒号的制表符号，不管用什么符号，只要这个符号不会跟标题中的字符一样就可以，因此选择平常极少用到的符号作为字段的间隔符。
团购结束时间是比较麻烦的部分，因为各个站点采用的格式不一样，这意味着我们要在这个数据上进行再加工。大多网站用JavaScript显示倒计时，获取不到具体数字，但是可以得到辅助数据，那么——
1）大部分站点在剩余时间附近的div标签内通常会有 diff=”149445000″ 这一形式的数据，把那串数字获取到，它表示剩余时间的毫秒/秒数；
2）某些站点这一数字出现在页面的javaScript中，而不是HTML标签里，一样把它获取过来。
3）可以直接得到结束日期的，组织成“年月日”连缀的格式，如“20100101”；
第二步：用WordPress的插件获取Feed内容
可以用的插件是 FeedWordPress 或者 wp-o-matic，它们都可以定时自动获取Feed，区别是后者可以把图片获取到本地。
根据Feed的不同来源分配到不同的地区类别里，Tag则用来区分来源站点。
这样，我们的团购导航就可以按地区查看，也可以按来源站点查看。
第三步：生成缩略图
也有两个插件可以选用：WP-Thumbnails或者post-thumb，它们可以把正文中第一张图片处理成你定义的大小，全自动执行。
WP-Thumbnails 是国人写的一款插件，能够精确抓取和裁剪，并按月份存储到不同目录。缺点是抓取效率低，10多个缩略图需要刷新3至5次，3分钟才能完成。
post-thumb 抓取相对快些，前台刷新1次即可全部自动生成，缺点是有10%的概率会出现缩略图匹配不正确的情况，即某个缩略图会被多篇不相关的文章调用。
根据插件的说明文档代码粘贴至index.php和archive.php的列表循环中，让缩略图显示到首页和列表页。
第四步：用javaScript进行乾坤大挪移，拆分并填充各字段内容
鉴于你不是一个代码小白，所以我只说要点，如果不幸你真的是代码小白，我对你能从开头看到这里表示惊讶，同时也很抱歉。
1）把标题上的产品名称、当前价格、原价、团购到期时间分配到各自的位置；
function fixText(){ //找到标题所在位置
var pName = document.getElementsByClassName("tt");
for (var i=0;i<pName.length;i++){
var getStr = pName[i].firstChild.nodeValue; //获取标题中所有字符
var restoredArray = getStr.split("︰");//split()是重点，把标题中的各字段分开
var Na=restoredArray[0] //赋值
var Np=restoredArray[1];
var Op=restoredArray[2];
var Nd=restoredArray[3];
var okNp = document.createTextNode("￥" + Np);//创建节点内容
var okOp = document.createTextNode("原价：￥" + Op);
var okNd = document.createTextNode(Nd);
var newPrice = document.getElementsByClassName("new-price")[i];
var oldPrice = document.getElementsByClassName("old-price")[i];//找到位置
var dNumber = document.getElementsByClassName("what-date")[i].setAttribute("data-num",Nd);//把时间参数存进data-num这个属性，这是HTML5支持的自定义方式，目前浏览器不支持THML5也没关系，不影响显示，只是通不过W3C校验
pName[i].innerHTML = Na;//重写标题，去掉价格和时间，避免浏览者看到这些“暗号”产生困惑
newPrice.appendChild(okNp);//填充内容
oldPrice.appendChild(okOp);
//dNumber.appendChild(okNd);
}
}
2）处理得到的时间参数，把剩余天数的值存入变量dNumber
var dNumber = whatdate[i].getAttribute("data-num");//从自定义的data-num属性里得到参数
if (dNumber<10){
dNumber = dNumber;//直接可以得到剩余天数的数值不变
}
else if (dNumber>21600 && dNumber<432000){ //当得到剩余时间为秒数时，划定5天范围，1天=86400秒=24小时X60分X60秒
dNumber = Math.floor(dNumber/86400);
}
else if (dNumber>21600000 && dNumber<432000000){//当得到剩余时间为秒数时，划定5天范围，1天=86400000秒=24小时X60分X60秒X1000毫秒
dNumber = Math.floor(dNumber/86400000);
}
else if (dNumber>432000000 && dNumber<2277135700){
dNumber = Math.floor(dNumber/311040000); //个别网站数字巨大，不知道是什么意思，尝试除以一个恰当的参数，使得到的剩余天数与该网站的实际情况相符就行了
}
else if (dNumber>10 && dNumber<120){//当得到的剩余时间为小时时，划定5天的范围
dNumber = Math.floor(dNumber/24);
}
else if (dNumber>20100601 && dNumber<20201213){ //当得到的时间为“年月日”时，划定日期范围
dNumber = dNumber.substring(6)- endD; //计算与当前日期(endD)的时间差值
if (dNumber <0){
dNumber = 30 + dNumber;
}
}
else {
dNumber = 0;//未知情况，假定当天结束好了
}
如果加载页面的同时处理这一堆数据的话，浏览器可能会卡死，让这个函数延迟2秒执行
setTimeout("timeCounter()",2000);
3）产品详细页可以这样处理
var p_bigPicture = document.getElementById("content").getElementsByTagName("img")[0]; //找到正文内容中的第一张图片
p_bigpic.appendChild(p_bigPicture); //把这张图移动到想要的位置
让详细页看起来更接近淘宝的产品页，符合网上购物者习惯中的印象，不至于把他们吓一跳。
完整的javaScript文件可以参考：layout.js（挪移页面元素完善布局）, timecounter.js（计算剩余时间并启动倒计时）
第五步：WordPress 中的一点设置
Settings > Writing Settings > Formatting
把“WordPress should correct invalidly nested XHTML automatically”勾上，避免因抓取内容中不规范的标签而导致页面错乱，WordPress会自动校正，把标签闭合。
OK，打完收功。成品在此：http://www.TuanGouX.com
问答时间：
Q：大叔你弄这玩意儿花了多长时间？
A：13天。从决定要做，到确定方案，尝试各种实现的方法，经历无数失败试验和调整，再到全部部署完工。
Q：这算不算是垃圾站啊？
A：有时候你在为人民服务和公民道德楷模两者之间只能二选其一。实际上TuanGouX收到若干团购网站的CEO来信要求收录，其中某些具有远见卓识CEO表示可以为此付费。
Q：有现成的团购导航程序下载为什么不用？
A：可以用。不用的原因是：1）这套PHP还有很大改进空间；2）WordPress更值得信赖；3）WordPress可以按照自己想法定制，可选用的第三方资源也很丰富。
Q：写这个指南你有什么不可告人的目的吗？
A：有。双赢的推广方式。你了解到新知识（如果算知识的话）的同时也记住了这个网站。不是吗？
Q：能不能公开这个 WordPress 主题？
A：不能。留口饭吃好伐？哥还指望这项目上市呢！至少这个总结已经可以帮你把实现目标的时间缩短了一半，有些体力活还是应该亲自体验一下，才能了知人间疾苦，才知道珍惜生活是不是？
最后，愿上帝保佑这些团购网站不要死得太快。
《