Octopress嵌入新浪微博边栏
更换boottrap-theme
后,边栏只有最近发表和文章分类两项内容显得有点寒碜。于是想着添加个新浪微博的边栏试试
#### 使用微博秀服务 微博提供的一个小工具。点这里查看。
从这个工具可以得到一个iframe
片段如下:
<iframe width="100%" height="550" class="share_self" frameborder="0"
scrolling="no"
src="http://widget.weibo.com/weiboshow/index.php?language=&
width=0&
height=550&
fansRow=2&
ptype=1&
speed=0&
skin=1&
isTitle=1&
noborder=1&
isWeibo=1&
isFans=1&
uid=&
verifier=&
dpc=1"></iframe>
src中的链接,就是微博秀的页面。
改造一下,变成octopress
的边栏片段:
<section class="well">
<ul class="nav nav-list">
<li class="nav-header">微博</li>
<li><iframe width="100%" height="550" class="share_self" frameborder="0"
scrolling="no"
src="http://widget.weibo.com/weiboshow/index.php?language=&
width=0&
height=550&
fansRow=2&
ptype=1&
speed=0&
skin=1&
isTitle=1&
noborder=1&
isWeibo=1&
isFans=1&
uid=1854716251&
verifier=&
dpc=1"></iframe>
</li>
</ul>
</section>
将这个文件保存到custom/asides
目录下,并在_config.yml
中的default_asides
列表中添加custom/asides/weibo.html
。
default_asides: [custom/asides/weibo.html, custom/asides/category_list.html, custom/asides/recent_posts.html]
...
# Weibo
weibo_uid: 1854716251
weibo_verifier: verifier
接下来
rake generate
rake preview
访问localhost:4000
查看一下效果。
注: default_asides
列表中各页面的顺序就是边栏显示的顺序
####更新: 我在使用微博秀的过程中并不稳定,有时显示,有时不显示。不显示的时候直接访问URL又是有效的。
于是换一种方式, 新的weibo.html
<section class="well">
<ul id="weibo" class="nav nav-list">
<li class="nav-header">微博</li>
<li>
<iframe
width="100%"
height="500"
frameborder="0"
scrolling="no"
src="http://service.weibo.com/widget/widget_blog.php?uid=1854716251&height=500&skin=wd_02&showpic=1"
></iframe>
</li>
</ul>
</section>