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
教程】主题分享按钮代码记录