使 WordPress 主题支持 Widget 工具
Web Widget 中文译名被称作是微件,是一小块可以在任意一个基于 HTML 的 Web 页面上执行的代码,它的表现形式可能是视频、地图、新闻、小游戏等等。它的根本思想来源于代码复用,通常情况下,Widget 的代码形式包含了 DHTML、JavaScript以及 Adobe Flash。
WordPress 中的 Widget 可谓是很有趣的小工具,主题开发者可以预先开发很多种小工具,而真正的时候可以由站长自己选择,这样极大的提高了主题的使用灵活性。
单侧边栏
functions.php
if( function_exists('register_sidebar') ) { register_sidebar(array( 'before_widget' => '<li>', // widget 的开始标签 'after_widget' => '</li>', // widget 的结束标签 'before_title' => '<h3>', // 标题的开始标签 'after_title' => '</h3>' // 标题的结束标签 )); }
sidebar.php
<div id="sidebar"> <ul> <?php // 如果没有使用 Widget 才显示以下内容, 否则会显示 Widget 定义的内容 if ( !function_exists('dynamic_sidebar') || !dynamic_sidebar() ) : ?> <!-- widget 1 --> <li> <h3>标题 1</h3> <ul> <li>条目 1.1</li> <li>条目 1.2</li> <li>条目 1.3</li> </ul> </li> <!-- widget 2 --> <li> <h3>标题 2</h3> <ul> <li>条目 2.1</li> <li>条目 2.2</li> <li>条目 2.3</li> </ul> </li> <?php endif; ?> </ul> </div>
双侧边栏
functions.php
if( function_exists('register_sidebar') ) { register_sidebar(array( 'name' => 'Sidebar_1', // 侧边栏 1 的名称 'before_widget' => '<li>', // widget 的开始标签 'after_widget' => '</li>', // widget 的结束标签 'before_title' => '<h3>', // 标题的开始标签 'after_title' => '</h3>' // 标题的结束标签 )); register_sidebar(array( 'name' => 'Sidebar_2', // 侧边栏 2 的名称 'before_widget' => '<li>', // widget 的开始标签 'after_widget' => '</li>', // widget 的结束标签 'before_title' => '<h3>', // 标题的开始标签 'after_title' => '</h3>' // 标题的结束标签 )); }
sidebar.php
<div id="sidebar_1"> <ul> <?php // 如果没有在侧边栏 1 中使用 Widget 才显示以下内容, 否则会显示 Widget 定义的内容 if ( !function_exists('dynamic_sidebar') || !dynamic_sidebar('sidebar_1') ) : ?> <!-- widget 1 --> <li> <h3>标题 1</h3> <ul> <li>条目 1.1</li> <li>条目 1.2</li> <li>条目 1.3</li> </ul> </li> <?php endif; ?> </ul> </div> <div id="sidebar_2"> <ul> <?php // 如果没有在侧边栏 2 中使用 Widget 才显示以下内容, 否则会显示 Widget 定义的内容 if ( !function_exists('dynamic_sidebar') || !dynamic_sidebar('sidebar_2') ) : ?> <!-- widget 2 --> <li> <h3>标题 2</h3> <ul> <li>条目 2.1</li> <li>条目 2.2</li> <li>条目 2.3</li> </ul> </li> <?php endif; ?> </ul> </div>
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论