#分享#XIU主题手机版如何显示小工具侧边栏

前段时间站长也想过这个事情,想让移动端也显示边栏的一些小工具(最主要是金主们的边栏广告位也想在移动端显示),在百度上搜了一下,都是一些老旧的教程,改修改single.php文件,需要增加的东西比较多,这个方法还是比较麻烦的,因为原来在列表里增加置顶文章的时候发工单给过开发人员,得到的回复是不能改,最后站长只能参选了一些教程,自己修改,所以这次也没有到开发人员那里去问,站长想在自己捣腾一下,经过一翻折腾,还是成功的完成了,把折腾过程分享给大家,做个参考吧!

首先在之前搜索的时候可以确定,需要修改CSS文件,所以就找到了主题文件夹找到了style.css,打开之后,肯定是要搜索.sidebar,这个比较确定,最终发现了以下的代码:
@media (max-width:1024px){
.sticky img, .focus .thumbnail .thumb, .relates a img,
.ui-navtop .focus .thumbnail .thumb{height: 140px}
.ui-navtop .sticky img, .ui-navtop .relates a img{height: 160px}
.sidebar{display: none;}
.content, .ui-navtop .content{margin-right: 0}

.tagslist{padding: 10px 0;}
.tagslist li{width: 50%;}

.ui-navtop .feeds{display: none;}
.ui-navtop .slinks{display: none;}
.ui-navtop .user-welcome{display: none;}
.ui-navtop .user-signin{display: none;}
}

可以看到1535行的:.sidebar{display: none;}

这里用了媒体查询,页面宽度小于1024px时,隐藏边栏,所以只需要改一下这个,把display: none;注释掉,就是不管宽度,都显示边栏,但是用手机测试了一下,效果不是太好,因为我边栏的图片宽度和手机不太适合,只显示了80%左右的图片,所以还需要修改,其实比较简单,按以下修改成自适应就可以了。
.sidebar{/*display: none;*/width: 100%;margin: 0;}
这次用两个屏幕大小不一样的测试了一下,显示效果还不错,完工。

在7.2版本的说明里发现了:新增侧边栏是否显示在手机端的主题设置

但是我真的找过好多次,没有找到,今天发个工单给商家,估计周一才会回复。

转载请注明:开心VPS测评 » #分享#XIU主题手机版如何显示小工具侧边栏

赞 (5)