使用 vimblog 来写 wordpress 文章

在台式机上有配过,用过几次,后来写博客少了,用 vim 来写就更少了。现在再在笔记本上配一次,备忘一下。

在 vim 中写(或者说管理)wordpress 的插件应该不少,至少随便找到的有 Vimpressvimblog ,这里用的是后者。

使用方法很简单:

  1. 下载 vimblog.vim 文件,并放到 vim 的根目录下,如:~/.vim/
  2. 修改 vimblog.vim 文件,在里面的 get_personal_data 函数中填上博客的信息,如:login(用户名)、passwd(密码)和 site(博客地址,不带 http://),别的参数一般不用修改。
  3. 修改 vim 配置文件(.vimrc 或 gvimrc 等),在里面添加以下代码:
    1
    2
    3
    if !exists('*Wordpress_vim')
        runtime vimblog.vim
    endif
  4. 测试:vim 里运行 :Blog rp 来获取最近的 10 篇文章,有输出就 OK 了,没的话重新看下是否写错了如博客信息等。

继续阅读“使用 vimblog 来写 wordpress 文章”

终解决WordPress循环登录

在阿修说折腾了WordPress循环登录前后,我的博客也遇到了这样的问题。症状就是:错误时如往常一样提示错误,正确的用户名和密码则刷新后返回登录界面,无任何提示。

Google了好久的“wordpress 循环登录”,虽说相关的文章很多,但大多都是copy过来的,几乎一模一样。总的来说就是通过修改wp-includes目录下pluggable.php文件的wp_set_auth_cookie函数来修改Cookie。可惜的是,这个方法对我的博客不起作用。

阿修怀疑是Akismet插件的缘故,可是他说删了这个插件无作用。我回忆了一下,我没有升级过这个插件,所以应该不是这个的问题。不过,抱着试一试的心理,还是删掉了来看看,结果果然是没用。
继续阅读“终解决WordPress循环登录”

自定义search form

WordPress 中使用 get_search_form() 得到自定义 search form 的方法

此处说的自定义 search form,是指通过 get_search_form 来调用生成的,而不是直接 code 在所需要的地方的方法。

其实在 Codex 中的词条 get_search_form 中有详细的说明,此处权当是简单的翻译。

一些示例

下面是一些内建或自定义 search form 的代码示例。

内建的 search form

当主题中没有 searchform.php 文件时,WordPress 将使用内建的 search form:
继续阅读“自定义search form”

使用wp_reset_query()重置query

使用 wp_reset_query() 来重置查询

琢磨着为单篇文章添加上随机文章之类,因为已经写好了一个随机文章的函数,所以,直接在 single.php 中调用即可。

可是,页面卡住了,CPU 100了。换了个浏览器,依然如此。将新添加的语句注释掉,正常。函数的问题?可是,404 页面工作正常啊!将语句替换为简单的 echo 语句,一切正常。

再次调用函数,刷新,等待加载。N久之后,终于开始刷新出来了。可是,为什么是无数的文章而不是原本的单篇文章的呢?赶紧停止加载,去看代码。

仔细查看代码,终于发现了问题。我写的随机文章函数使用的是 wp_query() 方法,然后,里面是一个 loop,而添加的单篇文章的时候又位于其 loop 里面。而 $post 之类都是全局变量,这样,随机文章函数就重写了一系列的全局变量,从而导致了悲剧。
继续阅读“使用wp_reset_query()重置query”

开启CodeColorer可视化编辑

为 CodeColorer 在 TinyMCE 中添加可视化编辑功能

我用的 CodeColorer 的版本是 0.9.8,开启方式如下:

codecolorer.php 文件中找到以下代码,将其启用即可。

1
2
3
4
5
6
// TinyMCE
// temporarily disabled
if (get_user_option('rich_editing') == 'true') {
    add_filter('mce_external_plugins', array('CodeColorerLoader', 'AddTinyMCEPlugin'));
    add_filter('mce_buttons', array('CodeColorerLoader', 'RegisterTinyMCEButton'));
}

继续阅读“开启CodeColorer可视化编辑”

添加页内跳转

为博客添加回到顶部、直达底部、阅读评论这三个快速页内跳转

页内跳转,在我这里,其实就是锚跳转(包括回到顶部、直达底部、阅读评论这三个),只是做了些美化和 JS 效果而已,最终效果见页面右侧(单页和非单页有所不同)。

一开始,我是直接把 HTML/PHP 代码放进 footer.php 文件中的,后来采用 hook 的方法。虽说,就得到的 HTML 结构来说,可能不是非常好;但个人感觉比直接修改 footer.php 好。

HTML/PHP 代码

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
<?php
    // add updown access, needs hook wp_footer() in footer.php
    function up_down() {
?>
    <div id="updown">
        <a href="#" title="返回顶部" id="goUp"></a>
        <?php if(is_single()):?>
        <a href="#comments" title="阅读评论" id="goComments"></a>
        <?php endif;?>
        <a href="#footer" title="直达底部" id="goDown"></a>
    </div>
<?php
    }
    add_action('wp_footer', 'up_down');
?>

使用这种方法,需要 footer.php 文件中有调用到 wp_footer() 函数,否则是无法 hook 的。
继续阅读“添加页内跳转”

WordPress带Home链接导航栏

wordpress 生成带 home 链接的导航栏

WordPress 3.0 之后,我们可以使用 wp_nav_menu 来生成导航菜单,这样可以支持自定义菜单。

若没有在后台中添加菜单,那么该函数就会 fallback 回 wp_page_menu。而默认情况下,这样产生的导航栏是没有 home 菜单的。

添加 home 菜单的方法也很简单,在 functions.php 文件中添加以下代码即可:

1
2
3
4
5
6
7
8
/**
 * Get our wp_nav_menu() fallback, wp_page_menu(), to show a home link.
 */

function dj_page_menu_args( $args ) {
    $args['show_home'] = true;
    return $args;
}
add_filter( 'wp_page_menu_args', 'dj_page_menu_args' );

其中,参数 show_home 的可取值有:

0 (false) – default;
1 (true);
<any text> – 用来替换默认的 “home” 文字

我也来DIY主题

最近终于狠下心来将搁置已久的主题继续做了下来。

由于对配色不在行,所以采用了比较简单的黑白色(虽然,简单了许多,不过对该突出的如何配色也好是为难了我)。

采用的是单栏结构,所以侧边的小工具去掉了,因此,原本为了此而存在的插件也可以停用了。

评论处,由于 pingback 不多,看不出多大的影响,所以,暂时没有将两者分开处理,甚至还没对 pingback 做特别的样式处理。

评论框是直接调用系统提供的 comment_form 函数生成,表情的添加采用为原生comment_form添加表情一文所提的方法。

另外,还采用了 willin 提供的 PageNavi、comment_mail_notify、Ajax_comments 和 Avatar 头像缓存等一系列代码。

目前,单篇文章内暂时没有相关文章、随机文章等。

对于 404 页面,提示错误,然后提供 10 篇随机文章。

关于浏览器兼容处理方面,由于比较大量地使用了 CSS3 中的圆角属性,所以,在 IE 中看起来会比较的难看。我尽量地使布局不会发生太大的变形,不过,由于 hack 得不多,所以,存在的像素差肯定是有的,不过测试了一下,IE6/7/8 中应该都没有太大的问题。不过,针对 IE6 做了一些提示,建议升级浏览器或使用别的浏览器。

总的来说,这是一个极其简洁的主题。而且,目前的功能只是一些很基本的功能。至于别的使博客更加美观、人性化的功能,以后再慢慢添加吧。

CSS3中box-shadow的性能问题

在对主题评论列表处理的过程中,突然发现嵌套回复性能低下,页面拖动也一卡一卡的。排除法后锁定了目标——box-shadow。

于是做了一些实验,发现如果大量使用box-shadow,又或者容器比较大的时候,性能都会降低很多。如果容器不是很大,数量不是很多,倒没多大的感觉。

如果将box-shadow应用到评论列表中,这个问题就比较明显了,特别是在评论不分页、支持嵌套的情况下。

无论是Firefox还是Chrome,对box-shadow的支持都存在这个问题,Opera则好上很多,带来的迟滞感不是很强。

模仿评论列表小小地做了一个Demo,可以体验到带box-shadow和不带box-shadow的明显区别。

更极端的一个Demo