子比主题侧边栏推广小工具

这是一款简洁实用的小工具区块，适合用在wordpress小工具中,可以方便的放一张商品介绍图片和简洁的特色介绍，还有一个大气实用的跳转按钮，很适合在一些需要展示指定内容的场合使用。

html代码放入后台小工具侧边栏

<div class="widget" style="top: 0px; visibility: visible; animation-name: fadeInUp;padding: 0px;">
  <div class="widget_product">
               
   <img src="https://static.902d.com/wp-content/uploads/2020/11/bedfaf010493-2.png" /> 
   <div class="product_content"> 
    <div class="product_info">
                   
     <h2><a href="https://www.902d.com/tag/161" title="【查看含有[Zibll]标签的文章】" target="_blank">Zibll</a>-<a href="/" title="【查看含有[子比]标签的文章】" target="_blank">子比</a><a href="/" title="【查看含有[主题]标签的文章】" target="_blank">主题</a>-本站同款</h2> 
     <ul>
    <li><i class="fa fa-check"></i>搭建<a href="/" title="【查看含有[网站]标签的文章】" target="_blank">网站</a>从一个优秀的主题开始！</li>
    <li><i class="fa fa-check"></i> 一次购买包永久<a href="/" title="【查看含有[免费]标签的文章】" target="_blank">免费</a>更新</li> 
    <li><i class="fa fa-check"></i> 承诺实现不断更新不断完善</li> 
    <li><i class="fa fa-check"></i> 强大的<a href="/" title="【查看含有[模板]标签的文章】" target="_blank">模板</a>群为你解决主题问题</li>
     </ul> 
    </div> 
    <div class="price_sale">
     <strong><small>￥</small>299</strong>
     <h2>官方统一<a href="https://www.47.108.64.197" title="【查看含有[售价]标签的文章】" target="_blank">售价</a></h2>
    </div>                
    <a class="btn" href="http://47.108.64.197" target="_blank">立即购买 - zibll</a> 
   </div> 
  </div>
   </div>

css代码（放入后台自定义css内）

/*侧边栏*/
.widget {
    clear: both;
    position: relative;
    margin-bottom: 20px;
    overflow: hidden;
}
.widget_product {
    background: #fff;
}
.product_content {
    padding: 15px;
}
.product_info h2 {
    font-size: 20px;
    margin: 0;
    font-weight: bold;
    padding: 5px 0 10px 0;
}
.widget ul {
    zoom: 1;
    list-style: none;
    padding: 0;
    margin: 0;
}
.product_info>ul>li {
    font-size: 13px;
    margin-bottom: 28px;
    list-style: none;
}
.price_sale {
    border-top: 1px solid #eee;
    padding: 10px 0px;
}
.price_sale strong {
    float: right;
    font-size: 20px;
    line-height: 1;
    font-weight: 100;
}
small, .small {
    font-size: 85%;
}
.price_sale h2 {
    margin: 0;
    font-size: 14px;
    color: #999;
    line-height: 20px;
}
.product_content>.btn {
  top: 5px;
    text-align: center;
    text-decoration: none;
    cursor: pointer;
    width: 100%;
  background: linear-gradient(-125deg,#54e38e 0%, #41c7Af 100%);
  box-shadow: 0 3px 10px -1px #41c7Af!important;
    color: #ffffff;
}
/*侧边栏主题推荐*/