#share#How to display the widget sidebar in the mobile version of XIU theme

The webmaster also thought about this some time ago, and wanted the mobile terminal to also display some sidebar widgets (most importantly, the sponsors’ sidebar advertising spaces also wanted to be displayed on the mobile terminal). I searched it on Baidu. These are some old tutorials. To modify the single.php file, a lot of things need to be added. This method is still quite troublesome, because when I added the top article to the list, I sent a work order to the developer and got no response. It cannot be changed. In the end, the webmaster could only participate in some tutorials and modify it by himself, so this time he did not go to the developers to ask. The webmaster wanted to tinker with it himself. After much trouble, he successfully completed it. Let me share the tossing process with you as a reference!

First of all, when searching before, it was confirmed that the CSS file needed to be modified, so I found the theme folder and found style.css. After opening it, I definitely had to search for .sidebar. This was relatively certain, and finally I found the following code : @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;} } You can see line 1535: .sidebar{display: none;}

Media query is used here. When the page width is less than 1024px, the sidebar is hidden, so you only need to change this and comment out display: none;, which means that the sidebar will be displayed regardless of the width. However, I tested it on my mobile phone and the effect is not the same. Great, because the image width of my sidebar is not suitable for mobile phones, and only about 80% of the images are displayed, so it still needs to be modified. In fact, it is relatively simple. Just change it to adaptive according to the following. .sidebar{/*display: none;*/width: 100%;margin: 0;} This time I tested it with two screens of different sizes. The display effect was pretty good and it was finished.

Discovered in the description of version 7.2: Whether the new sidebar is displayed in the theme settings of the mobile phone

But I have really looked for it many times and couldn’t find it. I will send a work order to the merchant today and I will probably not reply until Monday.

Recommended site searches: registration network, application for free space and domain name, virtual host space, 1g US virtual host, US host network, overseas virtual host space, US free space, renting a server, domain name registration query, how to rent a server, < /p>