如何添加footer模块到wordpress主题?

2025-11-02 01:59:11

1、第一步,点击WP后台的Appearance Menu > Editor,编辑functions.php,添加以下代码并保存:

register_sidebar(array(

'name' => 'Footer Widget 1',

'id'        => 'footer-1',

'description' => 'First footer widget area',

'before_widget' => '<div id="footer-widget1">',

'after_widget' => '</div>',

'before_title' => '<h2>',

'after_title' => '</h2>',

));

register_sidebar(array(

'name' => 'Footer Widget 2',

'id'        => 'footer-2',

'description' => 'Second footer widget area',

'before_widget' => '<div id="footer-widget2">',

'after_widget' => '</div>',

'before_title' => '<h2>',

'after_title' => '</h2>',

));

register_sidebar(array(

'name' => 'Footer Widget 3',

'id'        => 'footer-3',

'description' => 'Third footer widget area',

'before_widget' => '<div id="footer-widget3">',

'after_widget' => '</div>',

'before_title' => '<h2>',

'after_title' => '</h2>',

));

2、第二步,编辑footer.php,添加以下代码并保存:

<div id="footer-widgets">

<div id="footer-widget1">

<?php if ( !function_exists('dynamic_sidebar') || !dynamic_sidebar('footer-1') ) : ?>

<?php endif; ?>

</div>

<div id="footer-widget2">

<?php if ( !function_exists('dynamic_sidebar') || !dynamic_sidebar('footer-2') ) : ?>

<?php endif; ?>

</div>

<div id="footer-widget3">

<?php if ( !function_exists('dynamic_sidebar') || !dynamic_sidebar('footer-3') ) : ?>

<?php endif; ?>

</div>

</div>

<div style="clear-both"></div>

3、第三步,编辑style.css,为这个模块设置相应样式,添加以下代码并保存(可根据自己网站情况修改css):

#footer-widgets {

display: block;

width:950px;

margin-right:0;

background: #ffffff;

}

#footer-widget1 {

width: 260px;

float: left;

margin: 15px 10px 10px 30px;

padding: 10px;

background-color: #ffffff;

}

#footer-widget2 {

width: 260px;

float: left;

margin: 15px 10px 10px 15px;

padding: 10px;

background-color: #ffffff;

}

#footer-widget3 {

width: 260px;

float: left;

margin: 15px 10px 10px 15px;

padding: 10px;

background-color: #ffffff;

}

声明:本网站引用、摘录或转载内容仅供网站访问者交流或参考,不代表本站立场,如存在版权或非法内容,请联系站长删除,联系邮箱:site.kefu@qq.com。
猜你喜欢