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;
}
转载请注明：汇站网 » 【WordPress 教程】主题分享按钮代码记录
微信扫一扫 
支付宝扫一扫 
