WordPress 短代码之——Toggle 伸缩

林木木 — Fri, 21 Jan 2011 14:36:15 +0000

外话：其实这几天都没咋看书，折腾这折腾那的，都没啥成果。主要原因还是技术不到家，折腾各种API现在都需要Ou什么ath验证的，不会PHP折腾得很蛋疼……

几天前有童鞋让我集成一个功能到主题里：文章内的短代码伸缩功能。

HTML模式下输入如下代码格式：

 
[toggle]Google PR更新咯！[/toggle]

效果如下：

[toggle]Google PR更新咯！[/toggle]

输入如下代码格式：

 
[toggle title="蓝叉冰订婚了"]他89的，咱88的，情何以堪？不堪！[/toggle]

效果如下：

[toggle title="蓝叉冰订婚了"]他89的，咱88的，情何以堪？不堪！[/toggle]

这货没啥难度，一直拖到现在发文来凑数。function的php代码：

 
function single_toggle($atts, $content=null){
 
	extract(shortcode_atts(array("title"=>' ↑ '),$atts));	
 
	return ''.$title.' ↓ 
'.$content.'
';
 
}
 
add_shortcode('toggle','single_toggle');

两个参数，标题title和内容content，默认标题为“ ↑ ”，默认把内容隐藏了。具体含义见官方函数文档（这儿）

主要留了两个class方便jQuery获取和控制：

 
//By ImMmMm.com
 
$('.tg_t').click(function(){$(this).next('.tg_c').slideToggle(400)});

点击class=tg_t时，让其下一个元素class=’tg_c’伸缩，slideToggle神马意思？看jQuery文档的滑动效果属性部分～

就这样，么了，句号。

哦，PR昨晚凌晨更新了，恭喜小闇家直接从1到3，哟西！～

给WordPress主题添加短代码功能

林木木 — Sun, 31 Jan 2010 11:15:05 +0000

貌似这功能早在WP2.5已经支持，详细的描述请看：http://codex.wordpress.org/Shortcode_API

此文不解释原理（因为俺也说不清），就直接说具体的应用：

一、MP3播放器

1.添加：把以下代码复制至functions.php（注意在php循环内），然后下载mp3player.swf并放至主题根目录，MP3默认不自动播放

 
function mp3player($atts, $content=null){
 
	extract(shortcode_atts(array("auto"=>'0'),$atts));	
 
	return '.get_bloginfo("template_url").'/mp3player.swf?url='.$content.'&autoplay='.$auto.'" type="application/x-shockwave-flash" wmode="transparent" allowscriptaccess="always" width="400" height="30">';
 
}
 
add_shortcode('mp3','mp3player');

2.使用：撰写文章时在“HTML模式”下插入以下格式代码即可

 
[mp3]MP3文件URL[/mp3]

自动播放代码格式:

 
[mp3 auto="1"]MP3文件URL[/mp3]

3.演示：

 
[mp3]http://storage.live.com/items/6E6B92BD0BA88634!163?filename=L.O.V.E.mp3[/mp3]

[mp3]http://storage.live.com/items/6E6B92BD0BA88634!163?filename=L.O.V.E.mp3[/mp3]

二、Google文档预览

1.添加代码：默认宽600高300居中显示

 
function docsGoogle($atts, $content=null){
 
	return '.$content.'&embedded=true" width="600" height="300">
';
 
}
 
add_shortcode('docs','docsGoogle');

2.使用格式：目前Google文档查看器只“支持 PDF 文档、PowerPoint 演示文稿和 TIFF 文件”

 
[docs]Docs(.pdf、.ppt、.tiff)文件URL[/docs]

3.效果演示：

 
[docs]http://storage.live.com/items/6E6B92BD0BA88634!158?filename=how-to-build-your-own-web-site.pdf[/docs]

[docs]http://storage.live.com/items/6E6B92BD0BA88634!158?filename=how-to-build-your-own-web-site.pdf[/docs]

三、Flash快捷插入

1.添加代码：默认宽480高360居中显示

 
function swf_player($atts, $content=null){
 
	return '.$content.'">
';
 
}
 
add_shortcode('swf','swf_player');

2.使用格式及效果：

 
[swf]http://immmmm.com/download/chatnoir.swf[/swf]

[swf]http://immmmm.com/download/chatnoir.swf[/swf]

四、待添加……

木木木木木 » 短代码

WordPress 短代码之——Toggle 伸缩

给WordPress主题添加短代码功能