wordpress短代码：开启wordpress短代码功能之旅

学习NO.1

道勤小编网站今天起开启wordpress短代码板块，今后将不断的收集、整理、扩大我们的wordpress短代码功能。此篇为wordpress短代码板块的开篇，暂且讲明wordpress短代码的含义及创建规则。wordpress 简码创建规则：

1.首先要在function.php文件中创建我们所需的wordpress 简码功能，定义某一特定函数，比如：

1. function hello() /*通过function定义hello()函数*/
   
2. {
   
3. return '基友们，你们好！'; /*返回字符串*/
   
4. }

复制代码

2.将定义的函数绑定为wordpress简码：

1. add_shortcode('hi','hello'); /*通过add_shortcode()函数，将hello功能绑定为短代码，并命名为'hi'*/
   

复制代码

3.后台-写文章，插入[hi]，发布文章，便可预览效果。

wordpress 简码实例：

下面我们来实际操作，创建一则wordpress简码实例。

1.定义hello()函数功能：

1. function hello($atts, $content=null, $code="")
   
2. {
   
3. $return = '
   
4. <div class="wenchen_hello">'; /*创建返回div标签的名字为return参数*/
   
5. $return = $content; /*创建返回参数￥content的return参数*/
   
6. $return = '</div>
   
7. '; /*创建返回div标签的名字为return参数*/
   
8. return $return; /*返回参数$return的内容*/
   
9. }

复制代码

2.创建效果CSS：

1. .wenchen_short{
   
2. margin:20px 0px;padding: 15px 15px 15px 70px; font-size:12px;
   
3. -moz-box-shadow:0px 1px 2px rgba(0, 0, 0, 0.1); /*火狐浏览器下的边框阴影*/
   
4. -webkit-box-shadow:0px 1px 2px rgba(0, 0, 0, 0.1); /*webkit浏览器下的边框阴影*/
   
5. box-shadow:0px 1px 2px rgba(0, 0, 0, 0.1); /*其他浏览器下的边框阴影*/
   
6. border-radius:5px; /*浏览的圆弧角度设置*/
   
7. -webkit-border-radius:5px;
   
8. -moz-border-radius:5px;
   
9. -khtml-border-radius:5px;
   
10. }
    
11. .wenchen_short a:hover{}
    
12. .wenchen_short b,.hello_short strong{padding:0px; margin:0px; background: none; font-weight: bold;border-radius:0px;-moz-border-radius:0px;}
    
13. .wenchen_short{background: url(images/shortcode/warning.png) no-repeat 20px 20px #fff0b5;border: 1px solid #eac946;color: #b09e56;}
    
14. .wenchen_short a{ color:#A84A1E;}

复制代码

3.发布文章，插入[hi]查看效果。以下为显示效果：

道勤主机提供365天*24小时全年全天无休、实时在线、零等待的售后技术支持。竭力为您免费处理您在使用道勤主机过程中所遇到的一切问题! 如果您是道勤主机用户，那么您可以通过QQ【792472177】、售后QQ【59133755】、旺旺【诠释意念】、微信：q792472177免费电话、后台提交工单这些方式联系道勤主机客服！ 如果您不是我们的客户也没问题，点击页面最右边的企业QQ在线咨询图标联系我们并购买后，我们为您免费进行无缝搬家服务，让您享受网站零访问延迟的迁移到道勤主机的服务！