小部件可以让我们的主题拥有更多的小功能,比如搜索,文章归档等,使用起来非常实用,所以在网站建设中使用小部

件功能是必须的。

小部件可以从网站的主题设置里面添加,无需编写代码。

小部件主要出现在侧边栏和脚部,你也可以在其他地方使用。

添加小部件功能

首先我们需要添加小部件功能

1在function.php里编写侧边栏

打开function.php文件

添加代码

function osmag_widgets_init() {
 register_sidebar (array(
 'name' => __('Sidebar','osmag'),
 'id' => "sidebar-widget-area",
 'before_widget' => '<li id="%1$s" class="widget %2$s">',
 'after_widget' => '</li>',
 'before_title' => '<h2 class="widgettitle">',
 'after_title' => '</h2>' )
 );
 register_sidebar (array(
 'name' => __('Left Footer','osmag'),
 'id' => "footer-left-widget-area",
 'before_widget' => '<li id="%1$s" class="widget %2$s">',
 'after_widget' => '</li>',
 'before_title' => '<h2 class="widgettitle">',
 'after_title' => '</h2>' )
 );
 register_sidebar (array(
 'name' => __('Right Footer','osmag'),
 'id' => "footer-right-widget-area",
 'before_widget' => '<li id="%1$s" class="widget %2$s">',
 'after_widget' => '</li>',
 'before_title' => '<h2 class="widgettitle">',
 'after_title' => '</h2>' )
 );
}
add_action('init', 'osmag_widgets_init');

代码显示

后台显示效果

添加了Sidebar Left footer right footer三个小工具

在侧边栏添加小部件区域

我们已经添加了小部件功能,现在就运用它。

打开主题的siderbar.php文件

删除以前所有代码后添加如下代码:

<aside class="sidebar right third">
<?php if ( is_active_sidebar( 'sidebar-widget-area' ) ) : ?>
 <div class="bdr grd-vt-main rnd shdw-centered">
 <?php dynamic_sidebar( 'sidebar-widget-area' ); ?>
 </div>
<?php endif; ?>
</aside>

未添加时效果

添加后效果

在脚部添加小部件区域

打开主题的footer.php文件

在文件中添加如下代码:

<aside class="footer first">
	<?php if ( is_active_sidebar( 'footer-left-widget-area' ) ) : ?>
			<?php dynamic_sidebar( 'footer-left-widget-area' ); ?>
	<?php endif; ?>
	</aside>

	<aside class="footer second">
	<?php if ( is_active_sidebar( 'footer-right-widget-area' ) ) : ?>
			<?php dynamic_sidebar( 'footer-right-widget-area' ); ?>
	<?php endif; ?>
	</aside>

未添加时效果

添加后效果

添加侧边栏小部件

在后台仪表盘—->appearance—->widgets—->sidebar

显示效果

专业网站开发网页设计公司

深度阅读:

wordpress主题制作开发实战教程3.1(2)- 主题制作基本流程及一些小功能 在学习了上一节的WordPress主题基础之后,在本章节我们将学习主题制作的基本流程以及一些小功能。基本流程:1.创建主题文件夹2.创建主题模板文件3.模板文件引入css小功能:显示作者,时间,评论数量等 主题制作基本流程 创建一个主题,首先我们需要的是一...
WordPress主题制作教程2.4-WordPress主题功能 许多wordpress新手在进行wordpress主题制作时总会遇到这样的问题,什么是WordPress主题功能,怎样去修改它。functions.php文件是您向WordPress主题添加功能的地方。它用于连接WordPress的核心功能,使您的主题更具模块化,扩展性和功能性。如果你想学习...
WordPress主题制作开发实战教程7 – 制作主题的一些技巧和提示 在制作主题的过程里,前辈们总结了许多的技巧和方法。通过学习这些技巧,可以让我们避免犯更多的错误,并且使得开发主题更加迅速,使得主题更加的美观。为主题添加更多的文件 尽可能的使更多的模块分离开来,使加载更快速。index.php 首页文件page.php  主页面文件...
wordpress主题制作开发实战教程3.12 – 创建一个page.php模板页面 创建一个page.php模板页面我们通过复制index.php文件来创建page.php文件,并作出一些调整1.创建一个php文件,命名为page.php2.复制index.php文件的所有php代码至page.php文件中3.在page.php中,找到并删除关于Th...
wordpress主题制作开发实战教程3.11 – 插件回调与模板创建 1.插件回调 Wordpress插件利用自定制主题API执行插件中的许多命令,为了确保我们的代码适应各种插件,我们需要在header.php 和 footer.php文件中插入以下代码。在header.php文件中, 标签上方插入以下代码:
WordPress主题制作教程2.1-WordPress分类目录 WordPress中有很多不同类型的内容,除了默认的Post Types之外,您还可以创建自定义分类目录,所有分类目录存储在同一个地方,在wp_posts数据库表。    默认分类目录  有五种默认的Post Types可供用户使用或或者WordPress安...
WordPress主题制作开发实战教程4.2 – 导航栏功能 网站中使用导航栏是为了让访客能够清晰明了地找到网站相应的板块内容。在网站建设中导航栏是非常常见并且有效的。 1.先引入导航栏功能 在主题文件夹中创建一个functions.php的文件然后在开头添加如下代码:
WordPress主题制作教程2.6-WordPress的条件标签(二) 页面模板  is_page_template()检测是否使用了页面模板 is_page_template(‘post.php’)检测是否使用页面模板‘post’,页面模板与其他标签有所不同,用户需要使用文件名(如post.php或my...

发表评论

电子邮件地址不会被公开。 必填项已用*标注

This site uses Akismet to reduce spam. Learn how your comment data is processed.