wordpress主题修改技巧给
使用wordpress建站程序搭建博客的朋友或多或少都会喜欢自己动手修修改改,让自己的网站更美观、更实用。楚狂人也不例外,今天偶然在蜗牛789博客上看到一个通过修改代码给博客首页添加四格广告位的方法,感觉很不错,于是在自己的网站上测试了一下,效果不错,所以把修改方法也转载过来了,有喜欢的朋友可以自己试下。
一、修改效果:
二、修改方法:
1、修改网站CSS代码:
/* 首页4格css 2018-8-28 */ .eboxx { overflow: hidden; font-size: 12px; text-align: center; background-color: #fff; margin-bottom: 10px; } .eboxx h4 { font-size: 14px; color: #444; margin: 10px 0; } .eboxx-i { position: relative; float: left; width: 25%; padding: 18px; background-color: #fff; color: #777; } .eboxx-01, .eboxx-02, .eboxx-03, .eboxx-04 { border-right: 2px solid #eee; } .eboxx-i:hover {background-color: #FAFDFF; border-color: #dd911f; position: relative; z-index: 2;} .eboxx-i p {height: 36px;overflow: hidden;color: #bbb;} @media (max-width: 1024px) { .eboxx .btn-default {display: none;} .eboxx h4 {height: 20px;overflow: hidden;} } @media (max-width: 860px) { .eboxx .eboxx-100 {display: none;} .eboxx-i {width: 25%;} .eboxx-04 {border-right: none;} } @media (max-width: 640px) { .eboxx-i {width: 50%;} .eboxx-01 {border-bottom: 2px solid #eee;} .eboxx-02 {border-right: none;border-bottom: 2px solid #eee;} } @media (max-width: 480px) { .eboxx-i {padding: 10px 15px 15px;} .eboxx h4 {margin-bottom: 0;} .eboxx-i p {margin: 5px 0} }
2、首页添加html代码:
<div class="asb asb-indexd asb-indexd-01"><div class="container"> <ul class="eboxx"> <li class="eboxx-i eboxx-01"><img src='http://www.chukuangren.com/wp-content/uploads/2018/08/hot.gif' /> <h4><font color="c35bff"><strong> 阿里云主机礼包</strong></font></h4> <h4><font color="c35bff"><strong> 高达1000元优惠券 </strong></font></h4> <p>建站首选阿里云主机,领取超值优惠券礼包</p> <a class="btn btn-sm btn-primary" target="_blank" rel="nofollow" href="https://promotion.aliyun.com/ntms/yunparter/invite.html?userCode=0a5rig7f">点击查看</a> </li> <li class="eboxx-i eboxx-02"><img src='http://www.chukuangren.com/wp-content/uploads/2018/08/hot.gif' /> <h4><font color="ff5e52"><strong> 区块链空投糖果 </strong></font></h4> <h4><font color="ff5e52"><strong>网上赚钱新选择</strong></font></h4> <p>免费领空投糖果,最新网上赚钱方法</p> <a class="btn btn-sm btn-danger" target="_blank" href="http://www.chukuangren.com/airdrop-candy">点击查看</a> </li> <li class="eboxx-i eboxx-03"><img src='http://www.chukuangren.com/wp-content/uploads/2018/08/hot.gif' /> <h4><font color="c35bff"><strong> 超值购物优惠券 </strong></font></h4> <h4><font color="c35bff"><strong> 天猫50%优惠值得买吗? </strong></font></h4> <p>淘宝、天猫省钱你还讲价吗?不如一件领取优惠券~</p> <a class="btn btn-sm btn-primary" target="_blank" rel="nofollow" href="http//www.lequan.wang">点击查看</a> </li> <li class="eboxx-i eboxx-04"><img src='http://www.chukuangren.com/wp-content/uploads/2018/08/hot.gif' /> <h4><font color="ff5e52"><strong> 支付宝红包真的吗 </strong></font></h4> <h4><font color="ff5e52"><strong>天天免费领红包</strong></font></h4> <p>支付宝首页搜索“5981405”,马上领红包!</p> <a class="btn btn-sm btn-danger" target="_blank" rel="nofollow" href="http://www.chukuangren.com/zhifubaohongbao-shiyong.html">点击查看</a> </li> </ul> </div></div>
美中不足的是,每次修改时都需要在index.php文章中修改内容,如果有对wordpress建站技巧比较熟悉的朋友,不妨把这个功能添加到后台里面,应该很受欢迎,如果这个高手是你,记得通知我哦~
下载说明:
1、本站资源都是白菜价出售,同样的东西,我们不卖几百,也不卖几十,甚至才卖几块钱,一个永久会员能下载全站100%源码了,所以单独购买也好,会员也好均不提供相关技术服务。
2、如果源码下载地址失效请/联系站长QQ进行补发。
3、本站所有资源仅用于学习及研究使用,请必须在24小时内删除所下载资源,切勿用于商业用途,否则由此引发的法律纠纷及连带责任本站和发布者概不承担。资源除标明原创外均来自网络整理,版权归原作者或本站特约原创作者所有,如侵犯到您权益请联系本站删除!
4、本站站内提供的所有可下载资源(软件等等)本站保证未做任何负面改动(不包含修复bug和完善功能等正面优化或二次开发);但本网站不能保证资源的准确性、安全性和完整性,用户下载后自行斟酌,我们以交流学习为目的,并不是所有的源码都100%无错或无bug;同时本站用户必须明白,【源码源码ui网】对提供下载的软件等不拥有任何权利(本站原创和特约原创作者除外),其版权归该资源的合法拥有者所有。
5、请您认真阅读上述内容,购买即以为着您同意上述内容。
EB站 » wordpress主题修改技巧给
1、本站资源都是白菜价出售,同样的东西,我们不卖几百,也不卖几十,甚至才卖几块钱,一个永久会员能下载全站100%源码了,所以单独购买也好,会员也好均不提供相关技术服务。
2、如果源码下载地址失效请/联系站长QQ进行补发。
3、本站所有资源仅用于学习及研究使用,请必须在24小时内删除所下载资源,切勿用于商业用途,否则由此引发的法律纠纷及连带责任本站和发布者概不承担。资源除标明原创外均来自网络整理,版权归原作者或本站特约原创作者所有,如侵犯到您权益请联系本站删除!
4、本站站内提供的所有可下载资源(软件等等)本站保证未做任何负面改动(不包含修复bug和完善功能等正面优化或二次开发);但本网站不能保证资源的准确性、安全性和完整性,用户下载后自行斟酌,我们以交流学习为目的,并不是所有的源码都100%无错或无bug;同时本站用户必须明白,【源码源码ui网】对提供下载的软件等不拥有任何权利(本站原创和特约原创作者除外),其版权归该资源的合法拥有者所有。
5、请您认真阅读上述内容,购买即以为着您同意上述内容。
EB站 » wordpress主题修改技巧给