简码是WordPress的一项非常强大的功能。 本质上,简码是其他内容的占位符 。 众所周知的短代码是内置的画廊短代码。 只需输入 到WordPress编辑器中,它将由从上传到帖子的媒体中获取的图像库代替。
尽管媒体上传器为您提供了一个不错的界面来创建图库,但是在后台却创建了一个短代码,如下所示: 。 根据您的主题,这在您的安装上可能看起来有所不同,但是可能的输出如下所示:
您需要编写HTML来实现此目标,这非常繁琐。 使用简码使其速度大大提高。 如果您需要在帖子编辑器中执行任何重复性的任务,或者需要花一些时间标记的特定HTML格式,那么您可能会发现自己的简码可以提供帮助。
在本文中,我将通过一些简单的示例向您展示短代码的工作原理以及如何创建自己的代码 。
简码基础
正如我所提到的,简码实质上是由您定义的其他一些内容代替的。 让我们通过一个例子看一下基础知识。 假设您在整个帖子中都想引用网站的所有者。
“根据我们公司的所有者丹尼尔·帕塔基(Daniel Pataki)的说法,该网站的主要目标是赚钱。丹尼尔·帕塔基(Daniel Pataki)认为共享也很重要。”
代替编写“ Daniel Pataki”,我们可以使用简码。
“根据我们公司的所有者– [所有者] –该网站的主要目标是赚很多钱。[所有者]认为共享也很重要。”
这将使我们能够在一个位置更改所有者的名称,因此,如果所有者更改,则我们的简码的所有实例都将使用新名称。
编码实际上非常简单。 我们需要使用add_shortcode()
函数告诉WordPress有关我们的短代码,然后创建我们的函数来处理输出:
add_shortcode( 'owner', ‘owner_output' );
function owner_output() {
return ‘Daniel Pataki';
}
请注意,应将此代码添加到主题的functions.php文件或插件的files中 。 如果您使用的是第三方主题,建议您使用子主题 。
add_shortcode函数需要2个参数:第一个参数是WordPress试图匹配的短代码-这是您在方括号之间编写的内容-第二个参数是处理输出的函数的名称,这完全取决于我们。
在输出处理函数内部,我们需要返回要替换短码的输出。
简码属性
重要的是要意识到我们的短代码也可以使用属性。 例如,如果您要确保网站的所有者以粗体显示,则可以通过创建一个名为“ bold”的属性来实现此目的,当该属性设置为true时,将添加适当HTML标签。
add_shortcode( 'owner', ‘owner_output' );
function owner_output( $atts ) {
$atts = shortcode_atts( array(
‘bold' => false
), $atts );
if( $atts[‘bold'] == true ) {
return ‘<strong>Daniel Pataki</strong>';
}
else {
return ‘Daniel Pataki';
}
}
这看起来更令人生畏,但实际上这很简单。 首先,从可视化短代码的使用方式开始。 输入简码时,您可以执行以下操作:
[owner bold='true']
现在我们知道我们将拥有一个名为“ bold”的属性。
在输出处理函数中,我们使用shortcode_atts()
函数解析所有属性,并为其中一些提供默认值。 我们确保如果您不指定“ bold”的值,则将其设置为false。
接下来,我们只看一下bold属性的值。 如果为真,我们将使用强标签返回所有者的名称,否则我们将按原样返回它。
简码内容
当一些内容需要接收特殊HTML格式时,通常使用简码内容。 假设您的网站使用了像这样的精美标题:
<h1><span class="fa fa-check"></span>My Title</h1>
这是一个特殊的标题,是一级标题,还包含一个图标。 我们可以使用以下格式将其创建为简码:
[title icon='check']My Title[/title]
请注意,我们使用的是带有一些参数的开放式shortcode标签和封闭式shortcode标签。 (我的标题)中的内容作为第二个参数传递到我们的输出生成函数。
add_shortcode( ‘title', ‘title_output' );
function title_output( $atts, $content ) {
$atts = shortcode_atts( array(
‘icon' => ‘pencil'
), $atts );
return ‘<h1><span class="fa fa-' . $atts[‘icon'] . '">' . $content . ‘</h1>';
}
如您所见,除非在简码中定义,否则默认图标为“铅笔”。 内容作为第二个参数传递,并用作第一级标题内的内容。
实际用途
短代码有很多用途,从将滑块和画廊放入帖子,倒数计时器和其他动态内容。 这些通常需要一些Javascript和CSS才能正常运行。 在这些情况下,这取决于您的想象力和编码印章。
您可以做很多事情来简化您的生活(即使是非编码员),例如简化编辑和编写过程。 假设您编写游戏评论,并且在每个评论中都需要输入如下表格:
<table>
<tr>
<th>Title</th>
<th>Developer</th>
<th>Genre</th>
<th>Price</th>
<th>Our Verdict</th>
</tr>
<tr>
<td>Never Alone</td>
<td>Upper One Games</td>
<td>Indie Casual Adventure</td>
<td>$14.99</td>
<td>5/5</td>
</tr>
</table>
即使您逐条复制粘贴此内容,与您要添加的内容数量相比,这也是相当可观的。 您可以使用简单的简码完成工作:
[final_table title="Never Alone" dev="Upper One Games" genre="Upper One Games" price="14.99" rating="5"]
您的简码输出函数将负责添加整个表以及该信息周围的其他内容,例如:
add_shortcode( ‘final_table', ‘final_table_output');
function final_table_output( $atts ) {
return ‘
<table>
<tr>
<th>Title</th>
<th>Developer</th>
<th>Genre</th>
<th>Price</th>
<th>Our Verdict</th>
</tr>
<tr>
<td>' . $atts[‘title'] . '</td>
<td>' . $atts[‘dev'] . '</td>
<td>' . $atts[‘genre'] . '</td>
<td>$' . $atts[‘price'] . '</td>
<td>5/' . $atts[‘rating'] . '</td>
</tr>
</table>
';
}
圣诞复活节彩蛋
所以,您已经走到了这一步,圣诞节临近了,所以我想我要放一点复活节彩蛋。 Christmas Countdown Widget是一个插件,可让您有机会以侧边栏小部件或简码向您的网站添加以圣诞老人为主题的圣诞节倒数。
在帖子内容中的任何位置安装,激活和使用[countdown]
,可将Clause先生添加到帖子中。
结论
我认为简码很棒,因为它们使非编码者可以简化其工作流程,并且随着您扩展编码知识的增加,其复杂性也会增加。 我建议您尝试在这里和那里创建一个简码,因为您有更复杂的需求。
有关所有默认简码的列表,请查看WordPress Codex中的“ 简码”部分。 有关更多信息,请查看Codex ,您可能还需要为Shortcode Generator加上书签,在创建生成器函数时,它可以节省一些击键。
翻译自: https://www.hongkiat.com/blog/create-wordpress-shortcodes/