美文网首页
prestige主题移动端头部添加搜索框

prestige主题移动端头部添加搜索框

作者: iqing2012 | 来源:发表于2019-11-26 13:52 被阅读0次

    1。在header.liquid搜索/cart
    然后添加下面的代码

     <img class="chicv-mobile-search" src="https://cdn.shopify.com/s/files/1/1998/7053/files/07ba29b4372524f89bd3b060ad8b129f.png?589" style="width:20px;height:20px;vertical-align:middle;    position: absolute;
        vertical-align: middle;
        right: 46px;">
    
    image.png

    同样在header.liquid搜索 /search,然后再末尾加上id="chicv-search",如下图所示

    image.png

    然后在schema前加上

    <script src="https://cdn.bootcss.com/jquery/1.12.2/jquery.js"></script>
    <script>
    
      $(document).ready(function(){
         
         $(document).on('click', '.chicv-mobile-search', function(){  $("#chcv-search-id .Text--subdued")[0].click();    }) 
    
        
      
      })
    
    </script>
    
    image.png

    2.在theme.scss.liquid末尾空白处添加

    @media screen and (min-width: 750px) {
           .chicv-mobile-search{display:none!important}
        }
    

    相关文章

      网友评论

          本文标题:prestige主题移动端头部添加搜索框

          本文链接:https://www.haomeiwen.com/subject/dslewctx.html