网站链接规划，什么时候在新窗口/标签打开页面，什么时候在当前页打开？

| 发表评论 | 2,389 人已阅

这是一个老话题，最近正好被客户问起过，索性整理一下想法。

我们的设计原则：如果没有任何条件，一律默认在原窗口跳转

以下是条件

主观条件

如果觉得当前页面对你的转化比较重要，不希望用户关闭打断转化，就用新窗口。比如商城网站，用户订单页面上就等着付款了，要展示个条款页面，肯定是用弹出新页了。其他带表单的页面也是如此，在这样的页面上要少放链接。不过这个主观条件容易被滥用，有些人会觉得自己每个页面都是重要的…

客观条件

目标页面没有跳回原页面的链接的，原页面上这个链接就要用新窗口/标签打开目标页。比如跳到站外的，那肯定是要新窗口了。

补充

因为鼓励尽量在原窗口跳转，所以站内也要尽量做好内链，比如导航设置合理、下级页面有返回上级页面的专门链接、面包屑链接，等等…方便用户能快速找到原页面位置。总之设计中要活用各种方便用户逛网站的手段，防止迷路。

最后，电脑端对用户来说或许多几个标签页无所谓，手机端打开多标签就非常不方便了。手机浏览器切换标签麻烦，标签多了卡顿也明显，所以在手机端尤其要遵守在站内避免打开新标签的原则。在微信等APP内置浏览器中更是没有新标签的功能，一定要想好怎样只用当前窗口做交互。如果怕造成转化损失，可以有这样的手段：

– 如果新页面内容不多，可以考虑用浮层展示，避免掉这个跳转。
– 如果新页面内容多，必须跳转的，除了打开新标签，还可以考虑用本地存储、Cookie等手段保留用户在原页面的数据，比如填到一半的表单数据，方便用户回来后继续填写。

给Gravity Forms表单的电话号码增加11位手机号码格式

| 发表评论 | 8,790 人已阅

Gravity Forms提供了强大的表单系统，但是它的电话号码格式却没有11位手机号码的格式，虽然我们可以用International这个选项代替（就是不限制格式），但终归不够完美。查了一下官方文档，把这个需求给填上吧。

直接上代码：

add_filter( 'gform_phone_formats', 'brain1981_phone_format' );
function brain1981_phone_format( $phone_formats ) {
	$phone_formats['china mobile'] = array(
		'label'       => '手机号码',
		'mask'        => false,
		'regex'       => '/^1(?:3\d|4[4-9]|5[0-35-9]|6[67]|7[013-8]|8\d|9\d)\d{8}$/', //手机号码正则
		'instruction' => "11位手机号码",
	);
	return $phone_formats;
}

查看详细 »

微信小程序支付功能开发与踩坑经验总结

| 30 条评论 | 59,285 人已阅

2021年3月11日更新：
本文虽受到一定关注，但时隔3年多，其中代码以及安全性都已过时，为避免各位踩坑，请移步我的另外一篇文章：https://blog.brain1981.com/2354.html
本文评论区大家所提出的其他问题，也都已在这篇博客列出的代码中解决，如果你不是用WordPress也没关系，其中PHP部分稍加修改即可使用。

以下是原文：

早有耳闻微信小程序的支付功能开发是一步一坑，这两天果然踩了个遍。除了简要到令人愤怒的官方文档外，网上所有能搜到的相关文章，也没有任何一篇提供的代码是能够顺利跑通的。好在还有一部分前人的经验可以吸取，再加上个人的一点直觉引导，终于在凌晨的时候真机测试通过。

趁热打铁把踩过的坑罗列一遍，最后会附上真机跑通的代码。

首先是小程序支付功能的申请。在半年前我有另一个小程序项目，虽然当时没有开通小程序微信支付的需求，但是我留意过应用号（小程序号）后台微信支付的相关选项。当时，这个小程序因为绑定过已认证的服务号，因此小程序支付是可以直接申请的，无需任何费用。但是这次的项目，同样是另一个已经绑定过认证服务号的小程序，在微信支付界面，提示我要认证当前的小程序号才能开通微信支付，也就是说，绑定服务号还不够，必须把这个小程序号也交300元认证后，才给开通支付功能！真的很坑，好在客户没有什么怨言，非常配合地就把认证给办了…

一天后小程序号认证通过，就有了申请支付的入口：

果断选右边那个，根据给出的提示，到商户平台里面用小程序的appid绑定就行了。 查看详细 »

LNMP环境下PHP error日志的分段存储

| 发表评论 | 2,743 人已阅

之前记录过一篇如何建立并查看PHP报错日志的文章，见这里：https://blog.brain1981.com/1824.html

最近治下某个网站遭到攻击，产生了大量的PHP报错日志，甚至大量占用了磁盘空间。PHP日志文件是持续写入的，如果一直生成新的日志，这一个文件就会变得很大，无法打开。我又不想彻底关闭报错日志记录，只能对其进行分段，把每天的日志分为不同文件存储。 查看详细 »

上海WordPress / WooCommerce网站建设、微信小程序开发

| 发表评论 | 1,222 人已阅

JennyStudio作为一家小而美的建站公司，已拥有数十家长期客户，其中更有多家上市公司。我们把接到的每一个项目都当作自己的孩子一样培育，由此获得了大量客户的信任和长期合同。我们尤其擅长基于WordPress和WooCommerce的定制网站开发，如您有这方面的需求，请移步JennyStudio上海网站建设。

基于WordPress和WooCommerce的网站开发，我们从不采用任何他人主题（无论免费还是收费主题），避免各种第三方不确定因素造成的技术困扰和侵权可能。
我们只做整站成品，为客户独立设计和开发定制自己的网站。因此我们出手的WordPress/WooCommerce网站不存在打开慢、设置烦、操作难、不符合中国人使用习惯等常见问题，更不可能和任何一个网站“撞脸”。

基于WordPress和WooCommerce做网站的公司有很多，他们中的绝大部分承接建站项目的流程是这样的：
买一款国外主题 -> 装几个插件 -> 配上客户自己的产品图片和文案 -> 上线 查看详细 »

CentOS7.4安装新版node.js过程记录整理

| 发表评论 | 7,402 人已阅

发现阿里云的云主机可以按最短一周时常购买了，以后做测试环境，花点小钱买台短期主机做测试的成本又降低了（虽然ECS总体还是涨价了）。这次想尝试一下在最新的CentOS下安装node.js会不会踩坑，于是开干。

在失败了多次，东拼西凑了很多文章和教程后，终于把nodejs（8.7.0）给装上了，下面整理所用命令行以及过程。 查看详细 »

ES6学习笔记 – 字符串和数值扩展

| 发表评论 | 5,583 人已阅

记录一下几个简单的ES6的字符串和数值方法

字符串扩展

字符串查找（当前版本Chrome已支持）

let a = "hello world!";
a.startsWith("hello"); //true
a.endsWith("!"); //true
a.includes("w"); //true
 
//第二个参数表示搜索位置索引
a.startsWith("ello" , 1); //true
a.endsWith("hello" , 5); //true
a.includes("hello" , 5); //false

查看详细 »

ES6学习笔记 – let、const和块及作用域

| 2 条评论 | 5,424 人已阅

最近粗略看了一下ES6的一些特性，如果运用成熟，写JS的感觉将比ES5要愉悦很多。随着微信小程序开发量的增加，自己也觉得是时候拿起ES6了。买了一本阮一峰的《ES6标准入门》，从第二章开始慢慢看了起来。在自己的博客上也整理一些笔记，记录学习轨迹。

let 和 const 命令声明的变量，有严格的块级作用域限制，当前{}内声明的变量，在当前{}外无法使用；同一作用域下在变量声明之前，也不能使用；否则都会报错。另外，不允许重复声明同一变量。

for(let i=0 ; i<3; i++){
  let i="a";
  console.log(i); //输出三次a；在()内声明的i和在{}内声明的i并不在同一作用域内
}
console.log(i); //报错

查看详细 »

上海WordPress网站建设、微信小程序开发、H5页面设计制作

| 11 条评论 | 28,139 人已阅

置顶文章：这些年来我们已经积累了几十家客户，两百多个由我们独立完成的项目案例。JennyStudio作为一家正规建站公司，团队虽小，能量却很大，我们把每一个项目当作自己的孩子一样培育。长期承接外包项目，若你有WordPress相关的建站需求，微信小程序开发需求、H5页面设计制作需求，请移步JennyStudio上海网站建设。

我们尤其专长基于WordPress的各种类型的网站开发，和大部分靠WordPress吃饭的公司不同的是： 查看详细 »

微信小程序地图开发经验更新

| 1 条评论 | 10,974 人已阅

几个月前踩过一个坑，在微信小程序页面上，用setData更新地图上的marker数据，地图并不会改变，而且这个问题当时只在真机上调试才会发生，之前在小程序开发工具中调试并没有发现，使我开发到很晚还要回过头来找问题，浪费了不少时间，当时也用一篇博客记录了这个问题 https://blog.brain1981.com/1696.html，用地图组件控制接口wx.createMapContext的translateMarker方法修改坐标，绕过了这个坑。

大半年过去了，似乎已经淡忘了这个问题，这几天那个小程序有个较大的继续开发需求，使我又回到了小程序开发中来。测试了一下之前的地图，发现translateMarker修改坐标在真机上居然也有小概率会失效。原因暂时不明。微信小程序在这半年里面已经更新过二十多个版本，自然也没办法去追述到底是更新导致了我的问题，还是当时就没写好… 不过时隔多日再回头看文档，发现还是有一些新东西可用的。

先想办法解决这个老问题，查了一下资料，原来map这种级别高的系统原生组件，是不会跟着页面数据的修改而重新渲染的。如果要更新map上的marker，势必要重新渲染map，那么就要强制渲染一下。最简单的方法是给map组件上添加一个if语法。通过绑定map的值（0或1），修改map组件的显示与否 查看详细 »