归档 2014

Highlightjs 添加代码行号

Highlightjs是一款优秀的代码高亮Js组件,可以很方便地对各种语言编写的代码添加语法高亮样式。

然而,Highlightjs默认是不包括显示代码行号(Line Number)这一特性的,不过可以通过简单的JS代码和CSS样式表实现对Highlightjs的行号显示功能。

参考博文链接:syntax-highlighting-with-highlightjs

Javascript代码:


//numbering for pre>code blocks
$(function(){
    $('pre code').each(function(){
        var lines = $(this).text().split('\n').length - 1;
        var $numbering = $('<ul/>').addClass('pre-numbering');
        $(this)
            .addClass('has-numbering')
            .parent()
            .append($numbering);
        for(i=1;i<=lines;i++){
            $numbering.append($('<li/>').text(i));
        }
    });
});

实际上很简单,首先找到代码块$('pre code')。然后取得内容并按照换行符split,我们可以得到代码块的行数。最后,我们构建一个包含从数字1到行数n的行号列表,然后把这个列表追加到</pre>和</code>的闭合标签之间。

此外通过添加适当的css样式将行号列表渲染到代码的左手边缘。使用时请结合页面样式对下面的css做出相应修改。


pre {
    position: relative;
    margin-bottom: ...

继续阅读

django-blog-zinnia v0.13 SAE即用版

django-blog-zinnia是目前github上最活跃的django weblog引擎
github项目链接:https://github.com/Fantomas42/django-blog-zinnia
感谢博客引擎作者Fantomas42的辛勤付出!

根据SAE的环境配置了一个zinnia v0.13的即用版
网盘链接:http://pan.baidu.com/s/1i3wZrM1

django-blog-zinnia项目需要配置的地方:
1. 1/mysite/settings.py:

  • 20行 MYSQL_USER = ''  #MYSQL USERNAME
  • 21行 MYSQL_PASS = ''  #MYSQL PASSWORD
  • 22行 MYSQL_DB   = ''   #MYSQL DBNAME
  • 38行 ALLOWED_HOSTS = [''] #允许访问的主机列表
  • 98行 SECRET_KEY = ''  #应用密钥,可以通过[random.choice(string.letters + ...

继续阅读

Python与Java的主要区别

原文链接:Python vs Java: Key Differences

Python and Java are two very different programming languages, but both can be useful tools for modern developers. If you are thinking about learning to program for the first time, then you might find ...

继续阅读

Jquery实现Bootstrap树形列表

参考链接:http://jsfiddle.net/jhfrench/GpdgF/

效果如下所示:

继续阅读

多说【最近访客】JS插件通用代码使用方法

多说【最近访客】JS插件可以显示近期访问过你的博客并且已经使用向多说授权过的社交网络账号登录的用户头像,效果如下图所示。

多说最近访客JS插件

最近访客JS插件的添加步骤如下:

1. 添加多说公用JS代码,每个页面只需添加一次。


<!--多说js加载开始,一个页面只需要加载一次 -->
<script type="text/javascript">
var duoshuoQuery = {short_name:"您的多说二级域名"};
(function() {
    var ds = document.createElement('script');
    ds.type = 'text/javascript';ds.async = true;
    ds.src = 'http://static.duoshuo.com/embed.js';
    ds.charset = 'UTF-8';
    (document.getElementsByTagName('head')[0] || document.getElementsByTagName('body')[0]).appendChild(ds);
})();
</script>
<!--多说js加载结束,一个页面只需要加载一次 -->

2. 在需要显示最近访客的位置添加class="ds-recent-visitors"的容器,比如div元素:<div class="ds-recent-visitors"></div>

容器可指定的属性列表如下:

data-avatar-size="45" ...

继续阅读

每月存档

明年