我试图在Blogger中美化我的代码.我已将Google JS和CSS文件链接到我的模板.问题是我希望代码在页面加载时被美化,所以我prettyPrint();在模板上添加了页面加载事件.
<body onload="prettyPrint();">
此代码无法执行.但是,如果我在控制台中手动键入prettyPrint(),我的代码会正确地进行修饰.博客模板是否会手动调用JS函数?
编辑我通过在每个需要代码美化的帖子中手动调用函数来实现它(见下文).不过,我想知道为什么我不能在模板上做到这一点.
<pre class="prettyprint linenums lang-js">
function testCode(){
}
</pre>
// I have to do this in every post :-s
<script type="text/javascript">
prettyPrint();
</script>
Run Code Online (Sandbox Code Playgroud)
编辑2的自述说,我不应该使用prettyPrint()直接作为处理器,但在封闭包裹它来代替.所以我添加了这个代码,类似于自述文件中的示例,<head>但是无济于事.
<script type='text/javascript'>
window.addEventListener('load', function (event) { prettyPrint() }, false);
</script>
Run Code Online (Sandbox Code Playgroud)
要么
<script type='text/javascript'>
document.addEventListener('DOMContentLoaded',function() {
prettyPrint();
});
</script>
Run Code Online (Sandbox Code Playgroud)
编辑3我的模板HTML只是默认的动态视图(经典)模板,如上所述添加了美化库.
编辑4这是一个演示问题的链接:http://testprettyprint.blogspot.com/2013/02/blog-post.html - 代码块没有自动美化但是如果你打开Chrome的控制台并输入prettyPrint()代码将正确突出显示.
编辑5之所以我认为这是我的问题而不是博主,因为这个人仍然使用相同的技术来修饰他的代码:http://errorbuster.blogspot.com/2012/07/prettify-syntax-highlighter-for-blogger.html
编辑6正如Jeffery To在他的回答中指出的那样,Dynamics View使用AJAX加载博客内容,因此在加载实际内容之前,任何对文档加载的JS调用都将被执行.因此,对实际博客内容而不是文档执行的任何JavaScript都是无效的.所以我想现在的问题是如何挂钩到动态查看ajax:complete事件,如果有这样的事情,但我怀疑有.谢谢所有回复的人.我不确定这是否可以算作一个bug,但我会向博客提出一个问题.
结论请阅读Jeffery To的答案.他发现事件要调用该函数.
如何在博客博客中集成社交内容储物柜?我们看到WordPress博客和网站的数量,
但在blooger.com博客中你看不到插件选项
有没有人有另一种方式或类似的东西?我希望访客在阅读我的帖子之前喜欢,推特或g +.
谢谢
直到最近,我使用以下内容将 Python 代码(空格很重要)发布到 blogspot.com:
<div style="overflow-x: scroll ">
<table bgcolor="#ffffb0" border="0" width="100%" padding="4">
<tbody><tr><td><pre style=" hidden;font-family:monaco;">
my code here
</pre></table></div>
Run Code Online (Sandbox Code Playgroud)
大约一周前,帖子开始获取额外的换行符,因此所有这些都是双倍行距的。使用简单的<pre>标签是不好的(除了失去颜色)b/c 它还导致双换行符,而<code>标签与空白混淆。我想我可以只添加 *4 ---但这是不赞成的或者 HTML 风格的上帝。
对此的标准答案(就像在 SO 上一样)是通过使用 css(我不太了解)来获得语法着色或突出显示,例如在上一个 SO question here 中讨论的那样。我遇到的问题是所有这些解决方案都需要从 Web 上的服务器加载资源。但是,如果(例如 5 年后)该资源消失了,则代码的 html 版本将根本无法呈现。如果我知道 Javascript,我想我可能会解决这个问题。
着色问题本身是微不足道的,可以通过使用<style>具有各种定义的标签来解决。但是解析很困难;至少我在尝试自己解析 Python 方面没有取得太大进展。多行字符串是一种特殊的痛苦。我可以忽略困难的情况并编写简单的情况。
TextMate 有一个命令Create HTML from Document。结果相当冗长,但可以粘贴到帖子中。但是如果你有 3 个代码段,那么它就像 1000 行或其他东西。当然,它是一个文档,因此您必须在粘贴之前进行实际剪切。
有没有简单的 Python 解析器?更好的解决方案?
更新:我编写了自己的语法高亮解析器。也许仍然有点问题,但它非常简单且是一个独立的解决方案。我把它贴在这里。Pygments 也是一个不错的选择。
在blogspot上显示代码时,已经有几个关于如何美化代码的线程:如何使用blogger/blogspot进行美化?和什么是我需要采取很好的Java代码格式化添加到我的博客/ Blogspot的博客的步骤是什么?.
我试过google的美化http://code.google.com/p/google-code-prettify/和syntaxhighlighter http://alexgorbatchev.com/SyntaxHighlighter/.两者都很好.但是,我感兴趣的是哪个具有更好的性能 - 这是这个线程不同的地方.
压缩
YSlow告诉我,我的浏览器都没有被压缩.但是,我不是自己托管网站,我使用谷歌的blogspot进行托管.所以,我不认为我能在这里做很多事情.正确?
缓存 Google的美化和syntaxhighlighter都使用javascript文件和样式表.他们分别在谷歌服务器和亚马逊服务器上托管他们.如果我自己托管文件,我可以使用Apache Http Server并在HTTP响应上设置缓存标头,以便返回的用户不会继续下载它们.如果我不是自己主持并利用blogspot的免费托管,我无能为力,对吗?
服务器ping时间 这是一个点头测试.当我ping谷歌的美化时,我得到:
Pinging googlecode.l.google.com [209.85.143.82] with 32 bytes of data:
Reply from 209.85.143.82: bytes=32 time=5ms TTL=53
Reply from 209.85.143.82: bytes=32 time=4ms TTL=53
Reply from 209.85.143.82: bytes=32 time=4ms TTL=53
Reply from 209.85.143.82: bytes=32 time=5ms TTL=53
Run Code Online (Sandbox Code Playgroud)
当我ping syntaxhighlighter时:
Pinging www.alexgorbatchev.com [69.163.149.228] with 32 bytes of data:
Reply from 69.163.149.228: bytes=32 time=148ms TTL=47
Reply from 69.163.149.228: bytes=32 time=146ms TTL=47
Reply from 69.163.149.228: bytes=32 time=146ms …Run Code Online (Sandbox Code Playgroud)