谷歌blogger平台建立国内可访问博客攻略

一、最近关于网站的想法 建立个人独立博客，从不会到目前基本能简单搭建已经过去了3、4年了，在我最初接触到的wordcodess到dede再到discuz，这个过程以前写过一篇 文章介绍 。当时是抱了多大的希望在这上面，自己看看都觉得愚不可及，在这过程中我注册过不少的域名，换过不...

一、最近关于网站的想法

建立个人独立博客，从不会到目前基本能简单搭建已经过去了3、4年了，在我最初接触到的wordcodess到dede再到discuz，这个过程以前写过一篇文章介绍。当时是抱了多大的希望在这上面，自己看看都觉得愚不可及，在这过程中我注册过不少的域名，换过不少的网站标题，从上手wordcodess再转移其它阵地，……哦对了，我还用xiuno轻论坛程序弄过一段时间论坛……，到近期在wordcodess坚持了比较长的一段时间，林林总总，前前后后，一句话：折腾博客本身比写博客用的心思更多，这样的历程当然是走歪了。但是这几年下来，自己虽然越来越懂一点网络异事，设置不少模板主题功能，到头来，翻翻自己以前所写的少许原创文章，更多的感觉是空洞与荒芜。为了让经常翻看博客内容的自己不感到平淡无味，将更多的心思汇焦在如何写出有价值的博文，这是每一人博主老生常谈又难以持续的事。

而接触blogger是近个把月的事，在之前的几个月，我一直在等待一个bbs管理程序的完善，就是上面我提到的xiuno，在官方网站中我们可以了解到，这是一款面向千万级数据的轻论坛程序。在它最新的版本中，我发现这个程序界面作了很大调整，加之该程序确实在速度方面有很大优势，如果稍加改造，用来作博客程序也是很牛的。同时bss程序可以等于bss+cms+blog，也就是bss程序本身可以作各种文章管理系统的扩展，这一点对于一个虽然名不见经传的小博客来说，也是非常愿意接受的。因此我一直关注这个程序（xiuno3）的完善，从近期新版本各种测试、各种BUG的解决，以及基本插件的制作，等等，全部是xiuno作者一个人在独任，偶有一些兴趣网友对模板开发进行开发、制作了少量插件，但是从程序本身来说，新版本并不完善，至于在安装过程中常常出现问题，好在作者建立了交流QQ交流群，问题都可以及时在那里有回应。对于这个程序速度的优势，促使的向作者发出了一个要求，请作者制作一个wordcodess转xiuno的插件，方面我等技术白菜好搬家。这个问题抛出后，作者热情的作了回应，表示这个要求简单，等论坛程序基本功能完善成型后，会制作。于是便等待着，但是在这过程中我逐渐发现，这个程序适合对于有一定程序基础的人使用，官方这篇文章也说得很明白。

最近接触到在国内还有人基于blogger创建博客，这是一个好现象，既然别人可以弄，我也可以弄的，也许花点小钱也是值得的。原因我想了解谷歌blogger的人都明白。

二、了解blogger

想了解一个事物，我们应该看它的背景、历程以及经营理念。

关于blogger。最直接客观的请大家移步维基对blogger的介绍（需翻墙），如果不济，也可以看看国内百度百科blogger介绍。Blogger创建历史悠久，比如新浪成立1998年12月，算是老牌互联网运营者，新浪旗下的新浪博客是2005年才正式上线，而blogger作为提供个人资讯发布平台，于1999年8月就创建了，从一开始即高歌猛进的发展。2003年，谷歌公司收购了运营blogger的公司Pyra Labs，从此后，blogger被招入谷歌麾下，收费的功能全部免费，服务器也由谷歌公司运作，给广大的blogger博主带来了一波大福利。而其托管的主站点blogspot.com，在全球排名第四。

blogger在谷歌旗下，必然会贯彻谷歌“不作恶”的经营理念，在这个理念的指导下，我认为blogger最大的特色是藏巧于拙。对比国内新浪博客之流，blogger的逼格简直就是对其秒杀。我们拿新浪博客与blogger的界面，来看图说事。

上图是blogger官网风格

以上图片是新浪博客官网风格

我们可以对比发现，blogger官方主站，简洁清爽，只对blogger平台功能作介绍。新浪博客官方主站的尿性，是全CMS聚合，布满广告，让人分散注意力。

另外，新浪博客之流对大陆人与非大陆人是区别对待的。我找了新浪博客台湾版与新浪博客香港版本的界面，这两个地方的新浪博客，我随便找的两个博主网址进去，等了很久都没有自动广告弹窗出来，博客界面干干净净的。但是新浪博客大陆版本就不同了，请看下面第三张图，随便一个大陆博客，点开进去后，都是必须自动弹出广告窗，自己无法设置，往往一个页面要加载半天，才出来，不仅影响浏览，更要紧的是，对在上面开设博客的人的网络自由权的侵犯，同时对网友的不友好。说白了，在中国有哪个互联网巨头公司不是这个尿性，不管影不影响别人的体验，反正老子就是要这样：

上图是新浪博客，其中一个博客的界面，左上角右下角的广告很影响体验

上面二图分别是台湾新浪博客（图片丢失）与香港新浪博客的界面，均没有弹窗广告

再看blogger博客界面……下图是本人在blogger建的博客。完全由你随心所欲的设计，没有强制弹窗广告，挂不挂广告由你自己作主，另外你想怎么DIY就怎么DIY。如果你是代码修改能手，可以把它打造成它亲爹都认不出来的样子【玩笑用语:)】，这就是网络自由权利的享受，不会太受制于人，能掌握自己的著作的权利。

三、blogger博客与中国特情

对于中国特色社会主义的互联网，我在上一篇文章发了牢骚。肉身在这里，怨天尤人并不能带来任何的改善，唯有借助技术的力量，行动起来，才能做一点点自己喜欢的事。本人基于blogger建立博客的事，实际上在几个月前就弄好了，当时没有考虑到可以通过技术手段，实现让大陆非翻墙访问博客，因此建好后导入原wordcodess中的文章数据，基本上就没有管理了，见这篇文章。后来逐渐摸索出下面分享的技术手段时，我便彻底与wordcodess断绝关系了，同时也熄灭了打算用xiuno建立博客的想法，以后……在一段很长的期间内……我会以blogger为主，继续开展我的博客之旅。

四、如何建立大陆可访问的blogger博客

在谈论建大陆可访问的blogger博客之前，有一个问题应该首先解决，那就是你应该先掌握翻墙姿势，只有这个掌握之后，以后你登录blogger后台管理博客（包括模板修改、博文发布等）才方便。至于翻墙姿势的排练，并不是今天的主题，这个问题大伙可以在网络上搜索秘笈，即使花一点小钱，也是完全该考虑的。接下来，介绍本博文的主要内容【备注：本文章所介绍的技术，很白菜的，请熟练blogger的朋友可忽略】：

1、注册blogger博客。

第一步比较简单，待你翻墙成功后，进入blogger官网，跟着一步一步的引导，创建一个blogger博客是容易的，创建成功后，在blogger博客所发布的博文是以blogspot.com的二级域名生成，如“abc.blogspot.com”（abc是你自己设置的个性二级域名）作为你的博客网址。这时，如果并不考虑让墙内未翻墙的人来访问你的博客，那么你就可以随心所欲的开启自己的博客之旅了。由于你又想墙内的人不翻墙访问你的博客，在blogspot.com已经遭封锁的情况下，以下方式目前看来是最经济可行的。郑重申明，以下方法并非本人原创，我只是参考后将成功的经验分享在此，相关地方会有原始出处。

2、blogger后台绑定独立域名并解析域名

进入blogger后台，点击设置-基本-发布，选择设置“第三方网址”，点开后，将你自己的独立域名输入，等待谷歌分配一个专属你博客的网址，然后在你的域名服务商那里进行解析设置，将谷歌分配的专属网址用CNAME记录，然后同去寻找谷歌未被封锁的ip进行A记录解析，回到blogger后台，等待设置生效。本步骤详见【重灌狂人】这篇文章：在Blogger部落格設定自己的專屬網址（blogspot自訂網域名稱）。

对于域名托管的选择，建议放在国外域名托管商，以免域名有被国家相关部门收回的风险，本人目前选择namesilo.com托管，便宜、老牌、隐私保护终身免费，比godday便宜。国内域名托管商好处是操作简明，中文界面，速度给力。至于推荐的国内域名托管商，找带着大哥就行。

3、如何选择blogger模板

blogger博客绑定好自定义域名后，在大陆慢慢等，博客有时也能访问到，因为避免了blogspot域名的加载。但是博客内容中的css js等使用了大量的谷歌服务，因此我们需要对模板进行修改。在修改模板之前，我们应当找一套非官方的模板，blogger官方模板修改起来有诸多问题，不建议用。模板有免费有收费的，在互联网上我一向是喜欢不要钱的东西。不要钱不意味着不好，个人博客不必搞得像cms论坛杂志类网站花哨，简单实用就好，我们图的是blogger的服务器。免费模板可以在这个网址找：newbloggerthemes.com，收费的，在这个网站：https://themeforest.net，有不少优秀的模板。模板下载之前，看看模板官方站对下载安装的说明先。

4、修改blogger模板

在修改你的模板之前，建议你看看这位牛人的博客：WFUBLOG，这个博客里面介绍了，blogger博客模板的有关备份、版本管理、代码注释与修改、小工具的制作使用等等丰富而深入的内容，对于专心致志blogger博客的博友来说，磨刀不误砍柴工，了解blogger的一些基本知识后，再修改模板是很有必要的。

而我的经验，是将模板上传到github上进行版本管理，但是不必将任何小改动都更改在github上，我的方式是：如果仅仅是对一两处参数的调整……因为这对整个博客界面影响不大……就暂不上传到github，当作了比较大的改动，比如删除调整小工具、引用外部js代码、css变更等删除或添加一大段代码后才上传，同时每次作好修改的说明，方便时间长了之后自己查看。

要修改为国内可访问的模板，需要解决模板中的三个问题：css提取后放国内再调用、js提取放国内调用、禁用blogger官方自动加载的css js，我们以这个免费模板为例，点击下载得到一压缩文件，解压后得找到以“xml”结尾的文件，然后用notepad++软件（不要用记事本）打开下面分别详述：

（1）提取模板css放国内调用，并禁用blogger自动加载的css。

第一步：搜索<b:skin>与</b:skin>，发现这之间的代码是黄颜色的，这就是我们要提取的主要css代码，将下面中css代码提取出来：
<b:skin> <![CDATA[ 这里面是css代码 ]]> </b:skin>提取方式为：将<![CDATA[与]]>之间的代码全部剪切，用notepad++保存一份以“.css”为后缀的文本，将这个文本上传到你的静态文件托管空间，比如我用七牛云空间，放置我的css文件，得到一个外链网址。原代码就变成:
<b:skin><![CDATA[]]></b:skin>再将其加上以下字符，变成以下模样：
&lt;!--<b:skin><![CDATA[]]></b:skin>这是为了注释blogger官方自动加载的类似以下外调的文件，由于blogger官方被墙，该外调就影响网站的显示：
<link type='text/css' rel='stylesheet' href='//www.blogger.com/static/v1/widgets/1937454905-widget_css_bundle.css' />第二步：回到xml文件，在
&lt;!--<b:skin></b:skin>下面加入这行代码：
<link href='这里放css外链网址' rel='stylesheet' type='text/css'/>把刚才你放在静态储存空间的外链网址粘贴进去。至此，博客本身使用的css你已经成功外部调用了。

第三步：一头一尾禁止blogger加载官方代码

一头有两处：
<head>替换为：
&lt;!--<head>--&gt;&lt;head&gt;</head>替换为：
&lt;/head&gt;&lt;!--</head>--&gt;一尾，在xml文本末尾会有自动加载的一系列的代码，我们仍然需要屏蔽掉，通过下面的方法注释：
将</body>替换为以下代码：
&lt;!--</body>--&gt;&lt;/body&gt;
（2）模板主要使用的js放国内空间并调用

回到刚才我们下载的模板文件夹，其中有一个以“jquery.min”命名的js文件，打开xml代码在大约382行发现有一行代码调用js：
<script src='https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js' type='text/javascript'/>该代码中引用的链接就是上述文件中的“jquery.min”文件。

我们将刚才下载得到的“jquery.min”js文件，放在你的静态储存空间，如七牛，得到外链地址，然后再把上述地址替换为：
<script src='你的外链地址' type='text/javascript'/>这样我们就把模板主要调用的js放在国内调用了，以便能正常访问。

到了这一步，模板基本上被我们修改得可以用在国内使用了。现在我们就将这个修改的xml文件上传到blogger，看看效果如果。

5、其它说明

模板中还有其它一些自带的js与css，这些还是可以通过上述方法外部调用的，甚至我们可以将这些css js合并调用，但是这样修改起来就比较麻烦了，如何取舍看大家自己考虑。

对于上述步骤调用的js需说明一点:在xml文件</body>上方会自动加载blogger官方的js，但是我们在上面的第四步已经解决了。

---

2017.5.10修订

---

欢迎大家有兴趣加入我在google+创建的“blogger中国大陆圈”社群。地址：https://plus.google.com/u/0/communities/108820787357025980625 

欢迎加入blogger技术交流QQ群:125691905 

备注

本文参考的网址如下
（平凡梦想、My Memory） http://before.zojon.com/2012/11/blogger.html http://blog.rechar.net/2016/02/properly-use-blogger.html http://blog.iljw.me/2016/09/blogger.html http://www.superchao.info/2013/11/blogger_10.html