40行代码构建blog——Airpub试用

前几天在多说上看到一个新项目:Airpub,非常简洁,并且只需要静态环境支持,便想尝试一下。

Airpub将文章、内容都存于多说服务器,其它资源存放在七牛云CDN,用户只需要一个简单的index.html,40行代码就可以构建自己的博客了,非常方便。

当然,你也可以自己安装整套,但需要Bower支持,而Bower又需要Node.js,总之非常的折腾,个人更推荐40行的方式搭建:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
<!DOCTYPE html>
<html ng-app="airpub" ng-controller="global">
  <head ng-controller="meta">
    <base href="/" />
    <meta charset="UTF-8">
    &lt;title ng-bind="title"&gt;&lt;/title&gt;
    <meta name="fragment" content="!" />
    <meta name="description" content="{{description}}">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
    <!-- dependencies stylesheets and scripts -->
    &lt;link rel="stylesheet" href="http://static.duoshuo.com/airpub/airpub-dependencies.min.css"&gt;
    <script src="http://static.duoshuo.com/airpub/airpub-dependencies.min.js"></script>
    <!-- default theme: chill -->
    &lt;link rel="stylesheet" href="http://airpub.qiniudn.com/themes/chill/css/chill.min.css" /&gt;
    &lt;link rel="shortcut icon" type="image/x-icon" href="http://airpub.qiniudn.com/themes/chill/favicon.ico" /&gt;
  &lt;/head&gt;
  &lt;body ng-controller="base" ng-class="state.current.controller"&gt;
    <div ui-view="layout"></div>
    <!-- airpub configs -->
    <script>
      var airpubConfigs = {        
        name: 'Airpub', // 博客名称
        description: 'Just another Airpub blog', // 博客描述
        url: 'http://your-uri', // 博客站点永久链接
        themePath: 'http://airpub.qiniudn.com/themes', // 博客主题根目录,目前支持七牛CDN
        upyun: { // 用于上传图片
          bucket: 'mybucket', // 又拍云 bucket 配置 (可选)
          form_api_secret: 'xxxxxx' // 又拍云 form_api_secret (可选)
        }
      };
      var duoshuoQuery = {
        short_name: 'your_duoshuo_short_name' // 修改成你的多说 short_name
      };
    </script>
    <!-- duoshuo embed js -->
    <script src="http://static.duoshuo.com/embed.unstable.js"></script> 
    <!-- airpub angular app -->
    <script src="http://static.duoshuo.com/airpub/dist/airpub.min.js"></script>
  &lt;/body&gt;
&lt;/html&gt;

以上代码来自 Airpub官网

Airpub有哪些优点?

简洁、轻快,兼容多种设备并且搭建成本低。至于MarkDown编辑器就是看个人了,我本人很讨厌MarkDown。

缺点呢?

对搜索引擎不够友好。前端暴露又拍云bucket,需要经常更换,否则可能会被篡改图片。

如何自定义主题?

作者在GitHub提供了 默认主题 ,其中含有各种变量。制作好以后,修改40行中的引用地址即可。

评论

  1. 北京seo
    北京seo

    来看看

    回复
  2. bye
    bye

    不错

    回复
  3. Rain_Division
    Rain_Division

    最近你比较活跃啊 居然更新了好几篇←_←

    回复
    1. banri
      banri

      嗯,最近没什么事情所以……哇咔咔

      回复
      1. Rain_Division
        Rain_Division

        年底了居然不忙了。。不科学啊←_←

        回复
        1. banri
          banri

          毕竟大四狗。。

          回复
          1. Rain_Division
            Rain_Division

            o_O这是坐等解放的节奏啊

            回复
            1. banri
              banri

              都考完快一个月了,死活不放假,整天蹲着论文又不知道怎么写,所以我已经开始写主题消磨时间了。。。。。。。。。。。。。。。

              回复
              1. Rain_Division
                Rain_Division

                ←_←的确是

              2. banri
                banri

                Airpub的,不过这种东西基本写出来后期适配各种程序都比较方便

              3. Rain_Division
                Rain_Division

                _(:з」∠)_新主题?Typecho的?

  4. 一树小草
    一树小草

    同不喜欢md,我感觉还不如BBcode

    回复
    1. 一树小草
      一树小草

      不闭合的标签都是邪道。

      回复
      1. banri
        banri

        我也好习惯BBcode啊。。。Markdown真是适应不来,我还得强迫自己用,因为typecho github airpub都是MD。。。尼玛啊。。。

        回复
  5. Kunr
    Kunr

    为何讨厌md呢, 明明就那么棒

    回复
    1. banri
      banri

      就比如说链接吧,不能直接设置为新窗口...所以只能自己手写html…… 排版也是十分的不适应

      回复
      1. hanabi
        hanabi

        这个其实是一些md解析器支持的语法不够。比如用Ruby写的Kramdown解析器就支持_blank语法:[Link](http://example.com){:target="_blank"},但typecho使用的php markdown extra目前还不支持(当然以后就不清楚了)。而Markdown标准本身是很优秀的,对写文真的帮助很大。

        回复
        1. banri
          banri

          原来如此,感谢科普。。。Typecho上的这个MD真是用的我醉了,他的第二个链接解析也有问题,识别不出来 = = 只能识别第一个...............

          回复
          1. hanabi
            hanabi

            目前语法支持最广的就Kramdown了(其兼容了php markdown extra的语法)。Typecho也是支持{}写法的。比如:
            [Link](http://example.com "title"){.a-class #a-id}
            [Link]

            : http://example.com "title" {.a-class #a-id}

            回复
            1. banri
              banri

              我想了一个解决办法……因为本来主题中就载入了JQ库,我直接在common.js里加了一句$(".content a").attr("target","_blank"); 自动给文字内的a标签添加新窗口属性……23333,我已经能习惯MD了

              回复
              1. banri
                banri

                可以选择范围的 我选择的就是.content a 也就是正文内的所有a标签~~~

              2. hanabi
                hanabi

                这样自动会给所有a标签加target,不怎么好呢。MD习惯就好。我有点想改用jekyll写博了,博文直接以MD文件存放,而且使用Kramdown,不过最近没时间折腾。

            2. banri
              banri

              哈哈哈哈 多说这脑残表情转义...我去试试 =w= 感谢科普

              回复
      2. Kunr
        Kunr

        md 只是一个标准, 主要还是看编译器啦, 排版什么的话..真没办法了.

        回复
  6. hanabi
    hanabi

    这个看到过。不过,对比一下平台,我真宁愿把数据放Github Pages也不是多说,之前用多说几次刷不出评论让我有后怕的感觉。另外,讨厌Markdown就......- -,我很喜欢用←_←

    回复
    1. banri
      banri

      之前多说的服务器确实不太行,后来已经没问题了,去年我就再也没出现过刷不开的情况啦~~~~不过数据这东西,确实还是放在自己手上放心一点

      回复
      1. Kunr
        Kunr

        之前多说添加了服务器的宽带, 虽然还是一样抽风.. 数据你放各种主机商/vps/云还不是在别人手上..

        回复
        1. hanabi
          hanabi

          所以说这是相对的,就看哪个更稳定咯。我以为,静态blog放各种git平台比放多说放心。毕竟git同步,自己磁盘里总会有一份备份。

          回复
  7. banri
    banri

    写这篇文的时候又被markdown给恶心了一次

    回复