今天分享一些关于Blogger主题方面优化的一些小技巧，希望可以帮助你更好地优化你的 Blogger 博客，以下是一些小技巧：
一 . 防止移动端重定向
当你在 Blogger 上创建博客并启用移动版时，你可能会发现在移动浏览器上打开博客页面时会出现自动跳转到移动版页面的情况。尽管你在设置中移动端选择使用桌面主题，但是它还是会跳转到移动页面，在你的文章页url后面加上?m=0。这在某些情况下可能会是一个问题，因为读者可能想要查看桌面版页面，而不是移动版页面。幸运的是，您可以使用 JavaScript 代码来避免这种自动跳转。
以下是一段可以用于防止自动跳转到移动版页面的 JavaScript 代码：
<script type='text/javascript'>
//<![CDATA[
var uri = window.location.toString();
if (uri.indexOf("%3D","%3D") > 0) {
var clean_uri = uri.substring(0, uri.indexOf("%3D"));
window.history.replaceState({}, document.title, clean_uri);
}
var uri = window.location.toString();
if (uri.indexOf("%3D%3D","%3D%3D") > 0) {
var clean_uri = uri.substring(0, uri.indexOf("%3D%3D"));
window.history.replaceState({}, document.title, clean_uri);
}
var uri = window.location.toString();
if (uri.indexOf("&m=1","&m=1") > 0) {
var clean_uri = uri.substring(0, uri.indexOf("&m=1"));
window.history.replaceState({}, document.title, clean_uri);
}
var uri = window.location.toString();
if (uri.indexOf("?m=1","?m=1") > 0) {
var clean_uri = uri.substring(0, uri.indexOf("?m=1"));
window.history.replaceState({}, document.title, clean_uri);
}
//]]>
</script>这段代码通过搜索 URL 中包含的特定字符串来检测是否正在访问移动版页面，并使用 window.history.replaceState() 方法将这些字符串从 URL 中删除。这样，读者就可以在移动浏览器上查看桌面版页面，而无需手动输入完整的 URL。
如果您在 Blogger 上创建了一个移动版博客，并且希望读者能够自由地选择查看桌面版页面还是移动版页面，那么使用这段 JavaScript 代码可能是一个不错的选择。请注意，这段代码仅适用于移动版博客，如果您的博客没有启用移动版，那么这段代码也不会对您的博客产生任何影响。
二 . 自定义TITLE标签
下面这段代码是用于 Blogger 博客主题中的 HTML 模板中的 <title> 元素的。它的作用是根据当前页面的类型（主页或文章页面）来设置网页标题。下面是对这段代码的详细解释：
<title>
<b:if cond='data:blog.url == data:blog.homepageUrl'>
<data:blog.pageTitle/>
<b:else/>
<data:view.title.escaped/>-<data:blog.title/>
</b:if>
</title>当当前页面是博客主页时，<title> 元素的内容将设置为博客标题（<data:blog.pageTitle/>）。如果当前页面是博客文章页面，则标题将设置为文章标题（<data:view.title.escaped/>）后跟一个短划线和博客标题（<data:blog.title/>）。
这段代码中使用的 <b:if> 和 <b:else> 标签是 Blogger 的模板语言中的条件语句。cond 属性指定了一个条件，如果该条件为真，则执行 <b:if> 标签中的代码，否则执行 <b:else> 标签中的代码。
因此，这段代码可以根据当前页面的类型来设置适当的网页标题，使博客主页和文章页面的标题都能够清晰明了地显示在浏览器选项卡中。
三 . 使用代码高亮
在Blogger模板文件中添加highlight.js的CSS和JavaScript文件引用，很多人都是在<head>标签中引入，个人建议在</body>的前面加入会好一些，这样避免因为网络延迟的时候堵塞页面。因为blogger不能创建自己的js和css文件，只能够通过外部链接的方式引入或者直接写在html里面（如果代码量少可以直接写入html中），是自己的情况而定。
以下代码：
<link href='//cdn.bootcss.com/highlight.js/9.12.0/styles/atom-one-light.min.css' rel='stylesheet'/>
<script src='//cdn.bootcss.com/highlight.js/9.12.0/highlight.min.js'/>这段代码将会在你的页面中引入highlight.js所需的样式和功能。然后，你需要在页面加载时调用highlight.js的初始化函数，以确保代码块正确地被高亮显示。在Blogger中，可以通过添加以下代码到你的模板文件中来实现：
<script>hljs.initHighlightingOnLoad();</script>使用方法：
这里面是你的代码....
</code></pre>
function sayHello() {
console.log('Hello, world!');
}
sayHello();
</code></pre>
目前highlight支持的编程语言高亮超过200种，包括常见的编程语言（如C++、Java、Python、Ruby、PHP、HTML、CSS、JavaScript 、Kotlin、Swift、Elixir、Rust等...）。
有些时候你还需要将代码中的特殊符号转义为HTML实体你可以使用这个转换一下：https://www.dujup.com/p/ads.html
最后，希望这些小技巧可以帮到你。
Social Plugin