西京同城导航Zblog修改内容备忘录

首页每行显示数量，后台主题设置为24，屏幕大于1600px时每行显示8个，1280-1600px时显示6个，980-1280px时每行显示4个，760-980px（平板）时每行显示3个带侧边栏，小于760（手机）时每行显示2个，隐藏侧边栏。

以下为参考内容，媒体查询常见的媒体尺寸设置

通过媒体查询，针对不同的设备的尺寸设置断点Q来改变布局

屏幕 设备  断点

超小屏幕 手机 <768pX

小屏幕 平板 >=768pX~<992pX

中等屏幕 桌面 >=992pX~<1200pX

大屏幕 桌面 >=1200pX

更大屏幕 桌面 >=1200pX~<1600pX

超大屏幕   桌面>=1600pX

@media (min-width: 1200){ //>=1200的设备 }

@media (min-width: 992px){ //>=992的设备 }

@media (min-width: 768px){ //>=768的设备 }

@media screen and (min-width:1200px){

    .container{ width: 1100px; }

}

@media (min-width: 480px) and (max-width: 767px){

    .container{ width: 450px; }

}

1820  1600 1280  980  760

（1）解决默认主题空搜索bug

在此文件最下面增加代码zb_users/theme/hnysweb/style/js/hnysnet.js

修改这个文件，在最后一行添加以下代码保存即可。

$(function(){
    $(".search form").submit(function(){
        if($(this).find("input[type=text]").val().length == 0){
            $(this).find("input[type=text]").focus();
            return false;
        }
    });
});

（2）解决主题PC宽度太窄，一行统一改显示6个

index.css文件中修改如下

@media screen and (max-width:1600px){

.main #mainContent {width:1180px; }

.weburl li{width:23%;}

.weburl li{width:18%;}

}

（3）无搜索结果时友好提示，修改search.php

{* Template Name:搜索页 *}

{template:header}

<div id="mainContent">

{template:post-adtop}  

<div class="spm">

    <h3><a href="{$host}" title="{$name}">首页</a><i class="iconfont">&#xe6f1;</i>{$title}显示的结果</h3>

    <ul class="catelist">

    {foreach $articles as $article}

    {hnysweb_list_a($article)}

    {/foreach}

{else}

<div class="searchnull">{$lang['tpure']['searchnulltip']} 没有找到您搜索的内容，请换关键词搜索，也可以咨询客服378684070 <a href="https://www.baidu.com/s?wd={$_GET['q']}" target="_blank" rel="nofollow">{$_GET['q']}</a> </div>

 {/if}

    </ul>

    {if $pagebar}

    <div class="pagebar">{template:pagebar}</div>

    {/if}

</div>

{template:post-adbottom}

</div>

{template:footer}