【WordPress 教程】主题分享按钮代码记录

郑重承诺丨优站网提供安全交易、信息保真!
增值服务:
自动发货
网盘下载
安装指导
环境配置
二次开发
网站建设
¥ 0 (VIP免费升级VIP开通VIP尊享优惠特权
立即下载 升级会员 购买教程 售后支持
详情介绍

wordpress主题有很多,但真正符合自己审美标准的屈指可数。因此,大多数童鞋在安装主题后都会进行美化,以展示自己的个性,突出自己。开头的主题美化得太多了。建议你根据自己的喜好来折腾。毕竟适合自己的才是最好的!

【WordPress 教程】主题分享按钮代码记录

提示:修改中文主题模板,建议使用专门的编辑工具,如记事本++(免费)。切勿用操作系统附带的笔记本编辑模板文件,否则模板会放错地方。中文模板代码为UTF-8,无BOM(无签名)。
[用法]
Robins主题不需要修改任何文件,只需将下面的css代码添加到主题选项-自定义样式-自定义样式中,或者自己添加到主题css文件中即可。

/** 喜欢分享 **/  
#social {  
    position: relative;  
    margin: 50px auto;  
}  
.social-main {  
    position: relative;  
    margin: 0 auto;  
    width: 243px;  
}  
.social-main span {  
    float: left;  
}  
.social-main a {  
    color: #999;  
    line-height: 36px;  
    border-radius: 2px;  
}  
.share-s a, .shang-s a {  
    text-align: center;  
}  
.like a {  
    float: left;  
    padding-left: 15px;  
}  
.social-main a:hover {  
    background: #f1f1f1;  
    color: #444;  
    transition: all 0.2s ease-in 0s;  
}  
.like a {  
    background: #fff;  
    width: 120px;  
    display: block;  
    border: 1px solid #ddd;  
}  
.share-s a {  
    background: #fff;  
    width: 120px;  
    display: block;  
    padding-left: 15px;  
    border: 1px solid #ddd;  
}  
.social-main i {  
    color: #999;  
    margin: 0 5px 0 0;  
}  
/** 赏 **/  
.shang-empty {  
    position: absolute;  
    left: 90px;  
    top: 0px;  
    width: 62px;  
    height: 38px;  
    overflow: hidden;  
}  
.shang-empty span {  
    background: #fff;  
    width: 60px;  
    height: 60px;  
    display: block;  
    margin: -10px 0 0 0;  
    border-radius: 60px;  
    border: 1px solid #ddd;  
}  
.shang-p a {  
    position: absolute;  
    background: #fff;  
    left: 96px;  
    top: -5px;  
    width: 48px;  
    height: 48px;  
    font-size: 16px;  
    line-height: 45px;  
    display: block;  
    border: 1px solid #ddd;  
    border-radius: 40px;  
    left: 101px\9;  
    top: 0\9;  
    width: 38px\9;  
    height: 38px\9;  
    line-height: 35px\9;  
}  
.shang-s {  
    height: 37px;  
}  
#shang {  
    width: 280px;  
    display: block;  
}  
.shang-img {  
    float: left;  
}  
.shang-img img {  
    width: 140px;  
    height: auto;  
}  
.shang-main h4 {  
    font-size: 15px;  
    font-size: 1.5rem;  
    text-align: center;  
    margin-bottom: 10px;  
}  
.shang-main i {  
    color: #ff0000;  
}  
/** 分享 **/  
#share {  
    position: absolute;  
    top: -60px;  
    rightright: -29px;  
    width: 302px;  
    height: 68px;  
    display: none;  
    z-index: 999;  
}  
#share a {  
    float: left;  
    background: #999;  
    font-size: 20px !important;  
    color: #fff;  
    width: 40px;  
    height: 40px;  
    line-height: 40px;  
    margin-left: 4px;  
    padding-left: 0;  
    text-align: center;  
    border-radius: 3px;  
    background: rgba(128, 128, 128, 0.9);  
}  
#share .be-addbox:hover {  
    background: #7ab951 !important;  
}  
#share .be-qzone:hover {  
    background: #ff7400 !important;  
}  
#share .be-stsina:hover {  
    background: #ff0000 !important;  
}  
#share .be-tqq:hover {  
    background: #46c0e6 !important;  
}  
#share .be-renren:hover {  
    background: #3b68ac !important;  
}  
#share .be-weixin:hover {  
    background: #006f1d !important;  
}  
.bd_weixin_popup {  
    height: 250px !important;  
}  
.bd_weixin_popup_foot {  
    display: none;  
}  

将其替换成以下代码即可。


/** 喜欢分享 **/  
#social {  
    position: relative;  
    margin: 50px auto;  
}  
.social-main {  
    position: relative;  
    margin: 0 auto;  
    width: 243px;  
}  
.social-main span {  
    float: left;  
}  
.social-main a {  
    color: #fff;  
    line-height: 36px;  
    border-radius: 40px;  
}  
.share-s a, .shang-s a {  
    text-align: center;  
}  
.like a {  
    float: left;  
    padding-left: 15px;  
}  
.social-main a:hover {  
    background: #696969;  
    color: #fff;  
    transition: all 0.2s ease-in 0s;  
}  
.like a {  
    background: #FF0000;  
    width: 120px;  
    display: block;  
    border: 1px solid #ddd;  
}  
.share-s a {  
    background: #0000FF;  
    width: 120px;  
    display: block;  
    padding-left: 15px;  
    border: 1px solid #ddd;  
}  
.social-main i {  
    color: #fff;  
    margin: 0 5px 0 0;  
}  
/** 赏 **/  
.shang-empty {  
    position: absolute;  
    left: 90px;  
    top: 0px;  
    width: 62px;  
    height: 38px;  
    overflow: hidden;  
}  
.shang-empty span {  
    background: #fff;  
    width: 60px;  
    height: 60px;  
    display: block;  
    margin: -10px 0 0 0;  
    border-radius: 60px;  
    border: 1px solid #ddd;  
}  
.shang-p a {  
    position: absolute;  
    background: #ffab2e;  
    left: 96px;  
    top: -5px;  
    width: 48px;  
    height: 48px;  
    font-size: 16px;  
    line-height: 45px;  
    display: block;  
    border: 1px solid #ddd;  
    border-radius: 40px;  
    left: 101px\9;  
    top: 0\9;  
    width: 38px\9;  
    height: 38px\9;  
    line-height: 35px\9;  
}  
.shang-s {  
    height: 37px;  
}  
#shang {  
    width: 280px;  
    display: block;  
}  
.shang-img {  
    float: left;  
}  
.shang-img img {  
    width: 140px;  
    height: auto;  
}  
.shang-main h4 {  
    font-size: 15px;  
    font-size: 1.5rem;  
    text-align: center;  
    margin-bottom: 10px;  
}  
.shang-main i {  
    color: #ff0000;  
}  
/** 分享 **/  
#share {  
    position: absolute;  
    top: -60px;  
    rightright: -29px;  
    width: 302px;  
    height: 68px;  
    display: none;  
    z-index: 999;  
}  
#share a {  
    float: left;  
    background: #999;  
    font-size: 20px  
    color: #fff;  
    width: 40px;  
    height: 40px;  
    line-height: 40px;  
    margin-left: 4px;  
    padding-left: 0;  
    text-align: center;  
    border-radius: 20px;  
    background: rgba(128, 128, 128, 0.9);  
}  
#share .be-addbox {  
    color: #7ab951;  
    border: 1px solid #7ab951;  
    background: #fff;  
}  
#share .be-addbox:hover {  
    background: #7ab951 !important;  
    color: #fff !important;  
}  
#share .be-qzone {  
    color: #ff7400;  
    border: 1px solid #ff7400;  
    background: #fff;  
}  
#share .be-qzone:hover {  
    background: #ff7400 !important;  
    color: #fff !important;  
}  
#share .be-stsina {  
    color: red;  
    border: 1px solid red;  
    background: #fff;  
}  
#share .be-stsina:hover {  
    background: #ff0000 !important;  
    color: #fff !important;  
}  
#share .be-tqq {  
    color: #46c0e6;  
    border: 1px solid #46c0e6;  
    background: #fff;  
}  
#share .be-tqq:hover {  
    background: #46c0e6 !important;  
    color: #fff !important;  
}  
#share .be-renren {  
    color: #3b68ac;  
    border: 1px solid #3b68ac;  
    background: #fff;  
}  
#share .be-renren:hover {  
    background: #3b68ac !important;  
    color: #fff !important;  
}  
#share .be-weixin {  
    color: #006f1d;  
    border: 1px solid #006f1d;  
    background: #fff;  
}  
#share .be-weixin:hover {  
    background: #00ff43 !important;  
    color: #fff !important;  
}  
.bd_weixin_popup {  
    height: 250px !important;  
}  
.bd_weixin_popup_foot {  
    display: none;  
}  

 

资源下载此资源仅限注册用户下载,请先
客服QQ:1427707223
收藏 (0) 打赏

感谢您的支持,我会继续努力的!

打开微信/支付宝扫一扫,即可进行扫码打赏哦,分享从这里开始,精彩与您同在
点赞 (0)

免责声明   ⚠️ 1. 本站所有资源来源于网络收集,若资源侵犯了您的合法权益, 请来信通知我们(Email: 1427707223@qq.com),我们会及时删除,给您带来的不便,我们深表歉意! 2. 分享目的仅供大家学习和交流,若使用商业用途,请购买正版授权! 否则产生的一切后果将由下载用户自行承担! 3. 会员不得使用于非法商业用途,不得违反国家法律。否则后果自负! 4. 本站提供的源码、模板、插件等等其他资源,都不包含技术服务请大家谅解! 5. 本站资源售价只是赞助,收取费用仅维持本站的日常运营所需! 6. 因源码具有可复制性,一经购买 ,不得以任何形式退款。 7.更多详情请点击查看

优站网 wordpress美化 【WordPress 教程】主题分享按钮代码记录 https://www.zhanceo.com/21484.html

诚乃立身之本、信为道德之基

【WordPress 教程】主题分享按钮代码记录
下一篇:

已经没有下一篇了!

常见问题
  • 如果付款后没有弹出下载页面,多刷新几下,有问题联系客服!
查看详情
  • 本站所有资源版权均属于原作者所有,这里所提供资源均只能用于参考学习用,请勿直接商用。若由于商用引起版权纠纷,一切责任均由使用者承担。
查看详情

相关文章

联系官方客服

为您解决烦忧 - 24小时在线 专业服务

【WordPress 教程】主题分享按钮代码记录-海报