2018年8月6日星期一

转载:修改为国内可访问的blogger模板

要修改为国内可访问的模板,需要解决模板中的三个问题: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,但是我们在上面的第四步已经解决了。

原始地址https://www.lawpai.com/2016/10/blogger.html

一键分享 Share

评论