兜兜转转,回归初恋,欢迎使用yusiyuhuo主题, 主题介绍>>>

WordPress网站利用body_class()实现多种布局

WordPress建站 陌小雨 7840℃ 0评论

我们知道 xiu主题有3种布局

、分别为左右两栏、左中右三栏和上下布局,这是如何实现的呢?

xiu主题的body里面有这样一串代码:

>

具体的函数就是

function hui_bodyclass(){
    $class = '';
    if( (is_page() || is_single()) && _hui('post_p_s') ){
        $class .= ' post_p_indent';
    }

    if( !_hui('search_nav') ){
        $class .= ' search_not';
    }

    if( _hui('list_thumb_left') ){
        $class .= ' excerpt_thumb_left';
    }

    global $paged;
    if( !$paged && _hui('focusslide_s') && _hui('focusslide_s_m') ){
        $class .= ' focusslide_s_m';
    }

    if( _hui('layout_mo') ){
        $class .= ' uimo';
    }

    return trim(trim($class).' '._hui('layout'));
}

也就是通过后台的设置来判断前台输出的css类,通过定义不同的css样式来实现wordpress网站的前台的多种布局。

body中添加了body_class()函数后,每个页面都会输出wordpress自带的css类,我们可以进一步根据这个类来进行一些功能的设计。

转载请注明:小雨科技 _武汉网站建设_武汉小程序搭建 » WordPress网站利用body_class()实现多种布局

喜欢 (0)
发表我的评论
取消评论
表情

Hi,您需要填写昵称和邮箱!

  • 昵称 (必填)
  • 邮箱 (必填)
  • 网址