Apr 25, 2007

Flash Media Player

本文于2011年10月25日再次更新

本文于2009年08月20日再次更新

关键词:Flash Media Mp3 播放器 Player wordpress

目前网路上的Media播放器可谓是多不胜数,所以,这里只说说几个我认为优秀的Flash方式的播放器和Wordpress中的优秀插件,最后再沙说一下我自己使用的组合版本。

  1. CoolPlayer
    CoolPlayer是国人制作的一个Wordpress的插件,但是也可以在其他平台上运行。支持目前网络上的绝大多数格式的media,包括Google Video, Youtube等比较难获取media源的网站,配置简单,容易上手。
    严格意义上来说,CoolPlayer不应该被称做Flash Media Player,我觉得用Online Media Player更合适一些。
    和CoolPlayer类似的一款插件叫做Anarchy media Player,但是没有Coolplayer支持的格式多,不推荐。
  2. Flash Media Player
    名副其实的Flash Media Player (CoolPlayer实质上就是整合了这款Flash播放器)。
    这个播放器可以根据你自己的需要进行定制,功能非常强大;而且作者公开了源码,方便你进一步定制。
  3. XSPF Player plugin
    顾名思义,这个其实是XSPF Web Mp3 Player的Wordpress插件(XSPF Player是一款Mp3播放器,支持xml格式的playerlist)。利用此插件,你可以方便的在后台定制自己的播放列表,不需要去修改网页源代码。不过XSPF Player比较丑陋,而且播放列表不支持中文。
  4. Flash Mp3 Player
    更新:他的blog现在已经改为虾米播放器了。不过下载链接中的Flash播放器还能用。
    王晓峰的博客《不许联想》中有个音乐盒,其实用的就是这款播放器。这款播放器的好处是界面比较漂亮,缺点就是音乐必须在同目录下,且不能更改playlist文件的地址。换句话说,要是有人想下载《不许联想》中音乐盒里的歌曲,其实很简单……,秘密就在我提供的这个下载包里。

我的blog上其实使用了前面三个插件。平常在文中出现的media,我用的是CoolPlayer,而左侧的音乐盒(不好意思,强迫大家一起跟着听了……)我用的是“Flash Media Player+XSPF Player Plugin PlayerList”的组合。因为前者的播放器可以定制,且支持中文;而后者的播放列表可以很容易的进行更新——其实可以将他们整合为一个新的音乐盒插件,不过那样太耗时间,就等着有心人来做吧。我这里只说一下XSPF Player Plugin中生成的playlist中需要修改的地方:

你可以打开playlist.php中,在代码

echo "<br /><br />
<track>\n";

后添加如下的代码:

if (($row['artist'] != '') || ($row['title'] != '')) {<br /><br />
printf(" <title>%s</title>\n<creator>%s</creator>\n", xspf_player::entities($row['title']), xspf_player::entities($row['artist']));}
Tags:     
Post by SUN @ 4:20 pm | 与时俱进 | Comments (31)
Apr 6, 2007

优化WP-Cache:Wordperss优化手册(2)

关键词:WP-CacheWordpress优化加速Gzip

注:
♣ 本文是加速Wordpress-终极优化手册一文的补充,强烈建议您先参考终极优化手册后再看此文。
♣ 本文的方法只适用于单作者(不开放注册)的wordpress系统(但我相信目前绝大多数wordpress系统都是不开放注册的)。

加载WP-Cache插件是wordpress中最为常用的一种优化方式,同时,php程序本身也提供了一种非常强大的优化方式,也就是Gzip压缩传输。非常遗憾的是,WP-Cache插件要求关闭wordpress的内置gzip压缩功能。因此,我们要实现的就是在WP-Cache中使用Gzip的功能。这一思路的实现,我在终极优化手册中已经提到:

打开wp-cache-phase1.php,大概在35行左右找到如下代码:

foreach ($meta->headers as $header) {
header($header);

在此代码前添加下面的代码:

if ( extension_loaded('zlib') ) ob_start('ob_gzhandler');

OK,现在问题来了。
让我们深入分析一下加了Gzip功能的WP-Cache的工作原理:
首先,WP-Cache在用户第一次访问页面的时候,将生成的页面传输给用户,同时在服务器上缓存了页面,这第一次传输给用户的页面是没有用gzip方式压缩的。
第二,我们看wp-cache-phase1.php中的最后一个函数function wp_cache_get_cookies_values(),不难发现wp-cache是根据访问者的email来判断是否为同一用户的。问题就在WP-Cache的的这个判断机制上:

WP-Cache为不同的用户生成了不同的缓存页面。而这些用户第一次访问某一页面时候,WP-Cache发送的都是未经过Gzip压缩的页面。因此,除非这些用户再次访问该页面,否则他们都是享受不到Gzip压缩带来的好处的。

既然知道了问题的症结所在,解决的方法也就显而易见了。我们可以换用判断用户网址的办法来判断是否为同一用户,因为大多数用户都不会填写网址。这样用户A访问后,其他的BCDE等用户来访问,系统一般都会将用Gzip压缩过的页面传输给他,大大提高了缓存页面的利用率。但是这会产生一个新的问题:当用户A访问某一页面后,缓存页面中也就保留了他填写的用户名和email地址(comments.php中用php来读取缓存)。这个问题很好解决,我们可以用javascript来读取缓存

现在要做的就是修改代码了:
在wp-cache-phase1.php文件中找到如下代码

if (preg_match("/^wordpress|^comment_author_email_/", $key)) {

在前面加上//将其comment out,随后在该行的下一行添加如下代码:

if (preg_match("/^wordpress|^comment_author_url_/", $key)) {

接着,打开你的theme中的comments.php文件,找到填写comment的表单部分,这里以theme/default下的文件为例:

<input type="text" name="author" id="author" value="<?php echo $comment_author; ?>"

将其中的 value="<?php echo $comment_author; ?>"删除。并以此类推,删除表单中email和url的value项。
随后,我们在紧跟表单后的<?php endif; ?>之前添加如下的代码,用以读取用户的Cookies:

<script type="text/javascript">
//<![CDATA[
// Set cookies
var aCookie = document.cookie.split("; ");
function GetCookie(sName, id)
{
// cookies are separated by semicolons
var something = document.getElementById(id);
// set value to NULL for new visitors
something.value="";
if(!something) return 0;
for (var i=0; i < aCookie.length; i++)
{
// a name alue pair (a crumb) is separated by an equal sign
var aCrumb = aCookie[i].split("=");
if (sName == aCrumb[0])
{
//reading cookie value
something.value=unescape(aCrumb[1]);
return 1;
}
}
// a cookie with the requested name does not exist
return 0;
}
GetCookie("comment_author_8e11b42cc2f3a74aac664cc9afa5baf7", "author");
GetCookie("comment_author_email_8e11b42cc2f3a74aac664cc9afa5baf7", "email");
GetCookie("comment_author_url_8e11b42cc2f3a74aac664cc9afa5baf7", "url");
//]]>
</script>

请注意,其中的"comment_author_"中的长串字符为系统生成,请自行查找后替换。(我是用firefox的web developer插件看cookie的名字的)OK,把所有修改过的文件保存一下,上传,试试下效果吧。

Tags:     
Post by SUN @ 10:53 pm | 与时俱进 | Comments (14)
Mar 21, 2007

架构符合XHTML标准的博客

费了点时间让自己的网页上都贴上了Valid XHTML的标签,于是顺便扯几句。

XHTML,其实就是一个标准,至于来历,看我后面的扯谈。架构一个符合XHTML标准的网站并不难,可世界上的网站,真能符合w3C颁布标准的还真不多。因为养成的习惯要改并不是那么容易的,而且浏览器也都支持那些旧的标准,这也是不少网站对浏览器兼容不好的问题所在。如果要验证自己的网站是否符合这一标准,只要去 validator.w3.org/ 输入自己的网址就可以了。

如果你的网站不符合XHTML,这不代表它有什么太多的劣势(google的网页没一个符合的),而是你的网页有潜在的兼容性问题,结构上的问题可能让你耗费更多的时间来调整网页代码,使其在不同浏览器中看起来一致。我之前就一直不知道<li>必须嵌置在<ol>或者<ul>中,结果不得不花费时间来调整css代码。

而要架设一个符合XHTML的博客。

  • 最简单的开始就是先掌握XHTML相对于之前HTML的区别。http://www.w3schools.com/ 上给出了详细的说明,还可以做一下上面的Quiz。
  • 其次就是找一个比较好的平台。wordpress,blogspot,都是不错的平台,用他们编置出来的网页,错误相当的少(一般不会超过100)。
  • 尽可能的使用css来控制你网页上元素的性质(颜色,长宽,空白,一切的一切)。将这些元素从XHTML中剥离出来,也是他们的一个目标之一。
  • 随后就是利用上面的http://validator.w3.org/去验证你的网站,它对错误都会给出详细的说明,调试起来很方便。
  • 安装Firefox,使用它的插件的Web Developer进行各种调试纠错,会大大缩短你用的时间。

当你完成所有的纠错以后,就只剩下最后一件事情了。 :) ,在你的网页中插入如下的代码:

<a href="http://validator.w3.org/check?uri=referer" target="_blank">Valid XHTML</a>

【注】
说XHTML,就不可避免的从HTML说开去,自然,也就要提到Berners Lee这位互联网的鼻祖。
话说我刚上小学那会儿,还是个向往当天文学家的主,全因为有一年哈勃上了天;但当时的我却不知道(嗯,绝大多数人都不知道)―正是在那一年Berners Lee在欧洲的粒子实验室倒腾出了万维网。时至今日,你还能看到当年网站的屏幕截图
也正是Berners Lee,领导建立了现如今互联网的标准语言,其中就包括了大名鼎鼎的HTML,全称就是HyperText Markup Language。因为技术的障碍,之前的HTML不得不相对的松散,也就产生了诸多兼容性的问题,人们用不同的浏览器得到的效果经常会不同;而且,随着发展,website在跨平台信息交流中的作用也日益显现。所以Berners Lee们自然而然的就想到了将其标准化。而XHTML,也就是HTML4.01版,就是标准化过程中的一个里程碑。

Tags:       
Post by SUN @ 11:46 pm | 与时俱进 | Comment (0)
Mar 19, 2007

Ajax Comments

本文永久地址:
http://blog.znsun.com/plugins-list/ajax-comments-reply/

MSN留言风格的Ajax Commens-Reply插件
(
MSN Type Ajax Comments-Reply Plugin)

原创于懶懶喵日記,后Zhang-Zi根据此版本制作了非常优秀的Ajax Comments-Reply插件,现在这个版本实质是将Zhang-Zi的两个版本(一个是以前的实现msn风格的留言版本,另一个是他现在用的版本)合二为一。因此,这里特别感谢两位作者之前所作的大量努力。此版本主要实现的功能如下:

  • 可以配合Smiley Javascript Buttons,插入表情符号
  • 使用回复无需刷新
  • 可以直接在各种页面上(主页,多文章页面,单篇文章)回复留言(默认为5层嵌套),使得讨论更有针对性

修订版1.5主要改了一下几个方面:

  • 修正了代码中的若干错误
  • 加入了set_innerHTML函数,使得innerHTML中的js代码也可以被运行。现在在主页或者单篇日志上均可直接使用Smiley JS Buttons的表情代码(要求系统已经安装了Smiley JS Buttons插件)。

修订版1.1β主要改了一下几个方面:

  • 修改了原插件必须放置在wordpress根目录下的缺点,同时保留了prototype.lite等函数(因为我用的litebox中也用到了prototype.lite【注】litebox是lightbox的精简版本,用以实现图片显示的特殊效果)。
  • 整合了Zhang-Zi的两个不同版本的插件,合并了部分代码,使之达到现在的显示效果。
  • 修改了留言栏的式样,使得符合我的blog风格。
  • 压缩了javascript代码,其中css文件没有压缩,如果有需要,可以参考我的文章:加速Wordpress
  • 加上了Smiley JS Buttons的表情代码,如果你安装了Smiley JS Buttons,可以在单页留言中使用表情符号。

压缩包内容,包含在一个comment-reply的文件夹:

  1. readme.html //Read Me
  2. ajax-comments.php //实现在多文章页面上留言
  3. comments.php //实现单页面上的留言
  4. comment.css // css文件,控制评论栏效果
  5. comment.js, parse.js.php //已压缩的 javascript文件
  6. moo.ajax.js, prototype.lite.js, moo.fx.js //prototype.lite 模块
  7. comments-ajax.php //ajax留言处理
  8. comment-reply.php //插件控制
  9. working.gif //Loading留言时候的动态图标
  10. unzip文件夹 //未压缩过的javascript版本

插件安装使用:

  1. 从上面链接下载安装文件,解压缩后得到一个comment-reply文件夹
  2. 把文件夹的comments.php放到模版目录下,覆盖同名文件—请备份旧的comments.php
  3. 将comment-reply文件夹整个放入插件目录。结构如下:
    ---------------Plugins/
    ----------------------/comment-reply/
    ----------------------------comment-reply.php 等文件
  4. 到管理界面启用Ajax Comments-Reply修订版插件。
  5. 在index.php中用以下代码显示评论:

    <?php $pid=$post->ID; $cnum = get_comments_number(); showcomment($pid, $cnum);?>

插件卸载:

  1. 将模版目录下备份的comments.php复原。
  2. 管理界面停用插件或者直接删除此插件文件。

欢迎使用。有任何问题,可在此留言,或者email 到 "qmqsun(AT)gmail.com",当然,也可以去问Zhang-Zi,他的G-talk是"zhang(AT)zhiqiang.org"。 :)

Post by SUN @ 7:40 am | 我的页面 | Comments (44)

WP Real Static Homepage

PLEASE Scroll down for Chinese version

This plugin enables the wp system to convert your dynamic homepage to static index.html, more importantly, keep the content up to date. It can speed up the loading for your homepage.

Readme:

  1. Plugin WP-Cron is needed for this plugin, I've packed WP-Cron v 1.4 in the zip file.
    Please upzip all the files to plugins/static-index, so that it look like:
    ------plugins/
    ------------static-index/
    ----------------static.php
    ----------------wp-cron-static-index.php
    ----------------wp-cron.php
  2. Active two plugins :WP-cron and WP-Cron Static Homepage.
  3. Create a file named index.html in your blog root folder, set
    666 permissions for it.

Well, the system will update index.html automatically (per 15 mins), you may hack wp-cron.php at line 49 to change the time for scheduled exection actions.

More Tips:

  1. You may use the following php to refresh homepage when comments come in.

    <?php
    include (get_settings('siteurl') . "/wp-content/plugins/static-index/static.php");
    ?>

  2. The following script is to demo how to set cookies in the html files.

    <script type="text/javascript">
    function GetCookie(sName, id)
    {
    // cookies are separated by semicolons
    var something = document.getElementById(id);
    if(!something) return 0;
    for (var i=0; i < aCookie.length; i++)
    {
    // a name alue pair (a crumb) is separated by an equal sign
    var aCrumb = aCookie[i].split("=");
    if (sName == aCrumb[0])
    {
    if(sName=="comment_author_10add94cfc29a64b08306c8a8f9edb30")
    something.value = decodeURI(aCrumb[1]);
    else
    something.value=unescape(aCrumb[1]);
    return 1;
    }
    }
    // a cookie with the requested name does not exist
    return 0;
    }
    //please fill in with your own cookie id
    GetCookie("comment_author_8e11b42cc2f3a74aac664cc9afa5baf7", "authorname");
    GetCookie("comment_author_email_8e11b42cc2f3a74aac664cc9afa5baf7", "email");
    GetCookie("comment_author_url_8e11b42cc2f3a74aac664cc9afa5baf7", "url");</script>

Post by SUN @ 7:32 am | 我的页面 | Comments (7)

My Plugins List

下面是我安装的插件列表,其中包含了我自己写或者修改的两个插件,如果你有兴趣下载,请点击左侧My Plugins List下文章。

Plugin

Description

Ajax
Comments-Reply
此版本实质是将Zhang-Zi的两个ajax
comments版本(一个是以前的实现msn风格的留言版本,另一个是他现在用的版本)合二为一,从而实现多篇文章(包括主页)存在时的无延迟留言效果。目前是Chaney
SUN的版本
。 By Zhang-Zi.
Akismet Akismet checks your comments against the Akismet web service to see if they
look like spam or not. You need a WordPress.com
API key
to use it. You can review the spam it catches under “Comments.” To
show off your Akismet stats just put <?php akismet_counter(); ?> in your
template. By Matt
Mullenweg
.
Auto-hyperlink
URLs
Auto-hyperlink text URLs in post content and comment text to the URL they
reference. Does NOT try to hyperlink already hyperlinked URLs. Improves WordPress’s
default make_clickable function, along with adding some configuration options.
By Scott Reilly.
Collapsible
More Link
Allows you to click a link and instantly display the rest of your post instead
of loading the ‘view more’ page. By Chroder.
Extended
Live Archives (Modified)
Modified by Zhang-Zi. Implements a
dynamic archive. Visit the
ELA option panel
to initialize the plugin. By Arnaud
Froment
.
Google
(XML) Sitemaps
This generator will create a sitemaps.org compliant sitemap of your WordPress
blog which is supported By Google, MSN Search and YAHOO. Configuration
Page
By Arne
Brachhold
.
IImage
Browser
This plugin adds an “IImage Browser” button to the Quicktags area which opens
an image browser to select from all previously uploaded images and add the appropriate
code to the post. By Martin
Chlupáč
.
JS
Toggle Boxes
Reduces clutter by placing on/off JavaScript toggles on the page elements
of your choice. By Skippy,
skippy zuavra net
.
Media
Insert
Create ActiveX Media code by enclosing the info in %filename%,%width%,%height%,%detail%.
By AvP.
Page
Links To
Allows you to set a “links_to” meta key with a URI value that will be be used
when listing WP pages. Good for setting up navigational links to non-WP sections
of your By Mark Jaquith.
Quotmarks
Replacer
Convert all SBC quotation marks and suspension points into DBC case. 解决 WordPress
的全角引号问题,将全角的单引、和双引号和省略号替换成半角的格式,使后台输入的引号、省略号格式与前台读者浏览的引号格式保持一致。 By Sparanoid.
Sidebar
Slider
Makes page elements slide up and down as you scroll, so you can always have
them within easy reach. By Skippy,
skippy zuavra net
.
Smiley
Javascript Buttons
Lets you display a row of clickable smilies next to your comment textarea.
Thanks to Priyadi Iman Nurcahyo for the inspiration. By Skippy,
skippy zuavra net
.
Ultimate
Gallery2 Slideshow
Gallery2 integration for a fade-in
slideshow typically used in the Sidebar By Steven
Chung
.
Ultimate
Tag Warrior
Ultimate Tag Warrior is a tagging plugin, that’s heavy on tag visualisation.
I Like Pi! By Christine
Davis
.
WordPress
Database Backup
On-demand backup of your WordPress database. Navigate to Manage
→ Backup
to get started. By Scott Merrill and Austin
Matzko
.
wp-cache Very fast cache module. It’s composed of several modules, this plugin can
configure and manage the whole system. Once enabled, go to “Options” and select
“WP-Cache”. By Ricardo
Galli Granada
.
WP-DBManager Manages your Wordpress database. Allows you to optimize database, backup database,
restore database, delete backup database , drop/empty tables and run selected
queries. By GaMerZ.
WP-PageNavi Adds a more advanced paging navigation your WordPress blog. By GaMerZ.
Xspf_player Provides a quick a simple way to put MP3 soundtracks in your wordpress site.
Music can be either local or remote (http). Uses free flash XSPF
music player
. By Jose
Rodriguez (a.k.a. Boriel)
.
Post by SUN @ 7:28 am | 我的页面 | Comment (1)