WGMking ‘S testing

原文：Mastering WordPress Shortcodes
翻译：stonedoreen@WordPress啦!

虽然WordPress 2.5已引进了功能强大的简码，但目前仍只有很少人了解它。试想一下：只要输入“adsense”系统就会显示AdSense广告；键入“post_count”就能立即了解博客上的日志数目会是怎样的体验。

而WordPress简码完全可以完成以上功能，而且还拥有更多神奇功能，它将使您的博客体验更加轻松容易。本文将向大家介绍如何创建并使用简码，并提供了杀手级的可直接使用的WordPress简码，这无疑会增强您的博客体验经历。

何为简码？

简码使用起来非常容易，只需创建新日志（或编辑已有日志），切换到HTML模式，然后在方括号中输入简码，如：

[showcase]

当然，也可在简码中包括属性。带有属性值的简码显示如下：

[showcase id="5"]

简码中还可包括内容，如：

[url href="http://www.smashingmagazine.com"]Smashing Magazine[/url]

简码由一个函数集来处理，即通常所说的简码API。博客作者保存文章时，系统会解析内容，简码API就会自动让简码执行系统想要其执行的任务或功能。

创建简单简码

创建简码非常简单。如果你知道如果编写基本的PHP函数，你也就了解了如何创建WordPress简码。我们首先来创建一个众人皆知的“Hello, World”吧。

1. 打开主题中的functions.php文件。如不存在此文件，请立即创建。
2. 首先创建会返回“Hello World”字符串的函数，并把其粘贴到functions.php文件中。
   function hello() {
       return ‘Hello, World!’;
   }
3. 使用add_shortcode()函数把字符串转化为简码，把以下代码粘贴到hello()函数中，然后保存并关闭functions.php文件：
   add_shortcode(’hw’, ‘hello’);
4. 简码已创建成功，我们可以在日志和页面中使用它了。使用时，只要把编辑器切换到HTML模式并输入以下内容即可：
   [hw]

大功告成！当然，这只是最最基本的简码，但它也足以说明创建简码是多么简单的一件事！

创建高级简码

正如以上所说，简码中可以包含属性，这非常有用，例如，它可以赋予函数参数。接下来，我们将共同了解如何创建可以显示URL的简码，正如使用诸如VBulletin 和PHPBB论坛的用户使用BBCode一样

1. 打开主题中的functions.php文件。粘贴以下函数到其中：
   function myUrl($atts, $content = null) {
       extract(shortcode_atts(array(
           “href” => ‘http://’
       ), $atts));
       return ‘<a href=”‘.$href.’”>’.$content.’</a>’;
   }
2. 把函数转化成简码：
   add_shortcode(”url”, “myUrl”);
3. 简码创建成功，现在就可在日志和页面上使用了。
   [url href="http://www.wprecipes.com"]WordPress recipes[/url]

日志保存后，简码会显示名为“WordPress recipes”的链接，并指向http://www.wprecipes.com。

代码注释：若要正常运行，简码必须处理两个参数：$atts 和 $content。$atts是简码属性，上例中，属性为href，且包括了URL链接。$content是简码内容，位于域名和子目录之间（即www.example.com和“/subdirectory”之间）。正如以上显示，我们给$atts 和 $content都设置了默认值。

既然已经知道如何创建和使用简码，接下来我们就继续了解杀手级的可立即使用的简码吧。

1.创建“发送到 Twitter”的简码

问题：许多人似乎都比较喜欢我的十个杀手级Hack技巧中所介绍的“发送到Twitter”技巧，包括我本人也非常喜欢，但它有一个缺陷：如果把代码粘贴到single.php文件中，“发送到Twitter”链接将出现中所有的日志中，这可能并不是大家想要的结果。若能控制这个技巧，使链接只出现在我们想要其出现的日志中将十分有用。不用着急，方法十分简单：

解决方案：将要使用的简码十分容易创建，只要把“发送到Twitter”hack中的代码转化成PHP函数即可。复制以下代码到functions.php文件中：

function twitt() {
  return ‘<div id=”twitit”><a href=”http://twitter.com/home?status=Currently reading ‘.get_permalink($post->ID).’” title=”Click to send this page to Twitter!” target=”_blank”>Share on Twitter</a></div>’;
}
add_shortcode(’twitter’, ‘twitt’);

使用此简码，只需把编辑器切换到HTML模式，输入：

[twitter]

然后，“发送到Twitter”链接就会只出现放置简码的位置。

2.创建“RSS订阅”简码

问题：我们已经知道获取RSS订阅的一个较好途径就是在首页放置一个精致漂亮的“RSS feed订阅”图示。但是，我们其实并不想在主题中使用硬码，这样我们对显示内容就失去了控制权。为此，我们在此将创建“RSS订阅”简码，这样你就可在任意位置显示订阅图示了。

解决方案：同样，我们需要创建函数并把其转换成简码，然后把其放到functions.php文件中。记得把示例中的feed URL换成自己的URL！

function subscribeRss() {
    return ‘<div class=”rss-box”><a href=”http://feeds.feedburner.com/wprecipes”>Enjoyed this post? Subscribe to my RSS feeds!</a></div>’;
}
add_shortcode(’subscribe’, ’subscribeRss’);

设计显示框：你或许注意到了div元素中含有rss-box类，它是为了让你能够定制显示框的样式。以下是“RSS订阅”显示框可应用的CSS样式，把其复制到style.css文件中即可：

.rss-box{
  background:#F2F8F2;
  border:2px #D5E9D5 solid;
  font-weight:bold;
  padding:10px;
}

3.定制Google AdSense位置

问题：许多博主都在使用Google AdSense，在主题文件如sidebar.php 添加AdSense编码非常容易，但有经验的网络营销师都明白访客点击最多的还是嵌入在文章内部的广告。

解决方案：若在日志或页面中嵌入AdSense广告，需创建以下简码：

1. 打开functions.php文件并复制以下代码。记得把JavaScript代码换成自己的AdSense代码。
   function showads() {
       return ‘<div id=”adsense”><script type=”text/javascript”><!–
       google_ad_client = “pub-XXXXXXXXXXXXXX”;
       google_ad_slot = “4668915978″;
       google_ad_width = 468;
       google_ad_height = 60;
       //–>
   </script>
   <script type=”text/javascript”
   src=”http://88.198.60.17/images/mastering-wordpress-shortcodes/http://pagead2.googlesyndication.com/pagead/show_ads.js”>
   </script></div>’;
   }
   add_shortcode(’adsense’, ’showads’);
2. 保存functions.php文件后，可使用以下简码在日志和页面定制AdSense显示位置：
   [adsense]

注意AdSense代码被adsense div元素包装，这样我们就可以在style.css文件中设计其样式。

代码注释：以上代码用来显示AdSense广告。当把简码插入日志中时，它就会返回AdSense广告。这一切都非常简单，同时也节省了大量时间。

4.嵌入RSS阅读器

问题：许多读者似乎也非常喜欢我之前在Smashing杂志发布的8 RSS Hacks for WordPress”。现在，就让我们一起运用对RSS和简码的了解来在日志和页面中嵌入RSS阅读器。

解决方案：与以上类似，把以下代码复制到主题中的function.php文件中：

//This file is needed to be able to use the wp_rss() function.
include_once(ABSPATH.WPINC.’/rss.php’);
function readRss($atts) {
    extract(shortcode_atts(array(
    “feed” => ‘http://’,
      “num” => ‘1′,
    ), $atts));

    return wp_rss($feed, $num);
}
add_shortcode(’rss’, ‘readRss’);

为了使用简码，输入：

[rss feed="http://feeds.feedburner.com/wprecipes" num="5"]

feed属性（attribute）即是要嵌入的feed URL，num即是要显示的条目数量。

5.使用简码从WordPress数据库中提取文章

问题：幻想过直接从WordPress编辑器中调用一系列相关文章吗？当然，“相关文章”插件可以为我们检索文章，但是使用简码我们就可从特定类别中轻松获取任何数量的文章。

解决方案：把以下代码复制到functions.php文件中：

function sc_liste($atts, $content = null) {
        extract(shortcode_atts(array(
                “num” => ‘5′,
                “cat” => ”
        ), $atts));
        global $post;
        $myposts = get_posts(’numberposts=’.$num.’&order=DESC&orderby=post_date&category=’.$cat);
        $retour=’<ul>’;
        foreach($myposts as $post) :
                setup_postdata($post);
             $retour.=’<li><a href=”‘.get_permalink().’”>’.the_title(”",”",false).’</a></li>’;
        endforeach;
        $retour.=’</ul> ‘;
        return $retour;
}
add_shortcode(”list”, “sc_liste”);

然后，在切换到HTML模式后，复制以下内容到WordPress编辑器中：

[liste num="3" cat="1"]

接着系统将从ID为1的类别中提取3篇文章。关于如何获取特定类别的ID，可参考这里。

代码注释：系统提取参数并创建全局变量$posts后，sc_liste()函数使用了get_posts()，numberposts, order, orderby和category参数以从类别Y中获取X篇最新日志。完成后，系统就会以无序的HTML列表形式显示日志。

6.获取日志中的最新图像

问题：WordPress可以很容易的操纵图像。但是如何使其更加简单呢？使用稍微复杂一点的简码就可自动获取日志中的最新图像了。

解决方案：打开functions.php文件，并把以下代码复制其中：

function sc_postimage($atts, $content = null) {
    extract(shortcode_atts(array(
        “size” => ‘thumbnail’,
        “float” => ‘none’
    ), $atts));
    $images =& get_children( ‘post_type=attachment&post_mime_type=image&post_parent=’ . get_the_id() );
    foreach( $images as $imageID => $imagePost )
    $fullimage = wp_get_attachment_image($imageID, $size, false);
    $imagedata = wp_get_attachment_image_src($imageID, $size, false);
    $width = ($imagedata[1]+2);
    $height = ($imagedata[2]+2);
    return ‘<div class=”postimage” style=”width: ‘.$width.’px; height: ‘.$height.’px; float: ‘.$float.’;”>’.$fullimage.’</div>’;
}
add_shortcode(”postimage”, “sc_postimage”);

接着，在切换到HTML模式后，复制以下内容到WordPress编辑器中：

[postimage size="" float="left"]

代码注释：sc_postimage()函数首先提取了简码属性，然后它使用get_children(), wp_get_attachment_image() 和wp_get_attachment_image_src()这些WordPress函数检索图像。完成后，系统就会返回图像并插入到文章内容中。

7.在侧边栏微件中添加简码

问题：即使大家非常喜欢此文，如果本文到此停止，大家也难免有点泄气，因为它还未解决WordPress默认情况下不允许在侧边栏微件中使用简码这一难题。可喜的是，接下来就将介绍一些小技巧以提升WordPress性能并在侧边栏微件中使用简码。

解决方案：打开functions.php文件，并把以下代码复制其中：

add_filter(’widget_text’, ‘do_shortcode’);

大功告成！

代码注释：这次操作非常简单：在widget_text()函数中添加一个过滤器以执行do_shortcode()功能，它会使用API执行简码。这样，在侧边栏微件中就可使用简码了。