接上一篇 定制WooCommerce的账户详情(用户资料)页，增加自定义字段，修改默认字段 后，本文记录一下如何修改WooCommerce用户中心的edit-address以及购买商品结帐页面的字段。所有修改还是为了符合国内用户的书写习惯，把姓名合并成一个字段，去掉email字段，把地址栏从2行变成1行。
修改之前是这样的：
首先是去掉lastname、city和address_2这些没必要的字段 查看详细
WooCommerce是一款非常流行的WordPress电商插件。然而也听到很多人反映，它并太符合中国用户的使用习惯。国内用户的电商网站使用习惯大多是被淘宝培养出来的，因此如果要基于WordPress + WooCommerce搭建一个面向国人的小型电商网站，为提高用户体验，还是要对WooCommerce做不少改造的。在做过N个相关项目后，我觉得有必要分几篇文章，把WooCommerce值得改造的点和改造过程总结一下。我的原则还是能不用插件就不用插件，几十行代码能搞定的事情，肯定不会考虑用插件。本文先说说如何自定义账户中心的用户资料页。
首先，默认的WC用户资料页大致是这样的：
查看详细
今天在做一个H5项目的时候，发现使用JS的focus命令在iOS浏览器（包括微信）中无法调出键盘。试过N种方法都不起作用，谷歌了一些国外的帖子后，才知道iOS下，通过JS调用键盘是被禁止的，亦或许是一个bug。在这种情况下，其实focus事件已经执行了，只是iPhone键盘跳不出来，比较蛋疼。
因此在输入框上调用focus事件，无论原生，还是jQuery类似下面的JS代码无效：
$("#inputElement").focus(); |
但是可以监听其他点击事件，在回调中添加这个命令就可以了，比如 查看详细
用jQyery UI的draggable可以很方便地在PC端实现页面元素的可拖放，不过jQyery UI不是为移动端而写的，因此这个draggable方法在手机上无效。这么普通的问题，当然已经有了现成的解决方法，那就是再加一个jQuery UI Touch Punch插件即可。jQuery UI Touch Punch下载点这里。
这样组合后在手机上测试基本完美，不过很快发现在安卓手机上，无论是原生浏览器还是微信内置浏览器上，都无法在draggable的元素上执行click点击事件，其子元素也不行；在iOS上倒是一切正常。经过排查，发现其实并非click事件不能执行，而是安卓上对touch的敏感度实在太大，太容易覆盖掉click事件，其实快速的多点几次click还是有一定概率能执行的。但这样显然不符合项目的要求了，于是我考虑用touchstart-touchmove-touchend来做一些代替click的事。其实就是判断一下手指滑动的距离，距离大的就什么都不变，当做滑动，距离小的就当作click事件去做点击的事。
这种low问题就不多展开了，直接上代码， 查看详细
这个问题在最近的一个项目中反复出现，页面显示截图如下：
由于报错并没有提示是哪个文件哪行代码出问题，所以起初我只能通过一个个关闭插件来排查问题。首先，在这个网站上我用了WP Super Cache插件，关闭它后，报错变得时有时无；同时这个网站上我用了WPML、BuddyPress等大体量的插件，发现关闭其中任何一个，这个报错就不会出现。那么似乎问题就出在这些插件互相间的兼容问题上。然而这几个插件目前来说都是难以被替代的，如果禁用会导致开发成本大大增加，郁闷之余，把项目先放在一边，先陪儿子们玩去了… 查看详细
给WordPress文章添加点赞功能，其基本思路就是给每篇文章添加一个自定义字段，用这个自定义字段存储赞数；在客户端用Cookie存储是否已经点赞的变量。给BuddyPress的帖子添加点赞功能，思路也是一样的，但BP的帖子和自定义字段在数据库中并不保存在WP原来的表中，要读取/操作它们就要用BP自己的API。给BuddyPress添加的点赞功能，效果如图：
查看详细
最近两周一直在忙一个基于BuddyPress的项目，从选定BuddyPress，到项目上线，中间踩了不少原本不曾料想的坑，争取尽可能多的总结出来。
首先，和WooCommerce一样，要对BuddyPress进行主题定制，就要先在自己主题根目录下新建一个buddypress.php的模板，所有外围框架样式都可以往这个模板上堆，这里就不扩展了。
其次，如需要对BuddyPress的主题、结构等做更多定制，就要在主题根目录下新建一个buddypress文件夹，把插件目录\plugins\buddypress\bp-templates\bp-legacy\buddypress内的所有文件都复制进来；另外还要把\plugins\buddypress\bp-templates\bp-legacy\css下的buddypress.css复制到主题的css文件夹下；如果你是基于WP自带主题，比如twentyeleven开发的，还需要把twentyeleven.css放到主题的css文件夹下，并且重命名为buddypress-twentyeleven.css。 查看详细
最近在一个H5项目中，碰到了传说中的video标签在安卓版微信浏览器内被强制全屏播放问题。原计划在视频播放完毕后，页面发生video的ended事件时，应该显示分享和进入转化页的按钮，如图：
查看详细
最近项目很多，就没什么时间更新博客。在碰到同一个问题的时候，时隔一个月居然先后求教搜索引擎两次，比如本文标题的这个问题。其实在第一次解决后，做个笔记，第二次再碰到就可以直接解决，而不用再到处找答案了。所以，还是记录一下这个问题的解决吧。
这个问题是我修改主机上一个网站的域名绑定的时候碰到的。在改了LNMP的vhost配置文件和网站路径、域名解析也完成后，用新的域名访问网站，就出现了这样的open_basedir报错：
查看详细
现在二维码的应用已经很普及了，在我们的每个网站上都可以看见，比如右下角的当前页二维码。一般我们用qrserver.com的在线生成器就能轻松在页面上实现任何文本的二维码，不过有时候qrserver.com服务器响应会变慢，甚至当掉，这样二维码就显示不出来了。而且使用qrserver.com这个资源的人越来越多，服务器压力的增加使得它的可靠性正在变低，是时候找一些替代方案了。于是我尝试了WordPress后台能搜到的几款人气看上去不错的二维码插件，做一下总结。
后台搜索关键词：QR Code
和关键词同名的插件，自然是牌第一了，激活量不错。使用
[qrcode url="http://abc.com" margin="10" size="100" before="QR Code" after="QR Code"]
这样的短代码在任何地方生成二维码。不过这款插件本身就是qrserver.com接口生成二维码的，因此没有任何可靠性的增加，果断放弃。 查看详细