公告栏模板php代码,[免插件]为wordpress主题怎样添加滚动公告栏功能

摘要:如果你需要长时间运营一个wp网站,那你真的很需要一款主题带有公告功能,你需要把一些最新的消息传达给你的访客,这个时候我能...

如果你需要长时间运营一个wp网站,那你真的很需要一款主题带有公告功能,你需要把一些最新的消息传达给你的访客,这个时候我能解决公告栏功能的最简单最有效的方式就是使用wp插件,来实现我们的需求,但是插件有太多的操作局限,比如不能调整展示的位置,只能放在小工具里,或是某个角落位置上,而且设置起来成本高,自定义属性太弱,往往达不成我们想要的效果,我们只是是想要一个简单的滚动公告功能,为什么让我承受这么多???那这个时候我们就要尝试自己来写一个插件,但是对于小白来讲,公告功能很难实现,下面大挖就给大家分享出了一组简单实现wordpress主题公告功能的代码,而且操作起来也很十分容易,只需要有简单的html基础就可以上手操作,可以说是wordpress站长的福利之选。

#announcement_box {background-color: rgba(240, 239, 215, 0.5);background-color: #E3DEC0 9;padding-left: 15px;width: 100%;height: 30px;border: 1px dashed #C1C0AB;border-radius: 2px;}

/*图片地址需要替换*/

#announcement {background:url(/*图片地址*/) left center no-repeat scroll; height:25px; line-height:25px; overflow: hidden;float:left;}

#announcement a {color:#000;}

#announcement a:hover {color:#94382B;}

.announcement_remove {padding:1px 10px; float:right; font-size:14px;}

.announcement_remove a {height:18px; width:18px; display:block; line-height:16px; margin:4px 0 3px 0; margin:10px 0 3px 0 9; text-align:center;}

.announcement_remove a:hover {background-color:#cdc8a0; box-shadow:1px 1px 1px #66614c inset; -webkit-box-shadow:1px 1px 1px #666 inset; -moz-box-shadow:1px 1px 1px #666 inset; border-radius:3px;}

#announcement_close {color:#666;}

#announcement span {color:#666;}

#announcement ul {list-style-type:none}

  • 2015-4-25友情提示:可以使用键盘左右方向键来浏览上一篇和下一篇文章
  • 2015-4-24老师上生物课,说到精子的结构和成分,老师说精子的主要成分是蛋白质,一女 生提问老师为什么不是甜的呢?全班爆笑,女生脸红跑出教室。
×

function AutoScroll(obj){

$(obj).find("ul:first").animate({

marginTop:"-25px"

},500,function(){

$(this).css({marginTop:"0px"}).find("li:first").appendTo(this);

});

}

$(document).ready(function(){

setInterval('AutoScroll("#announcement")',4000)

});

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

19

20

21

22

23

24

25

26

27

28

29

30

31

32

33

34

35

#announcement_box{background-color:rgba(240,239,215,0.5);background-color:#E3DEC09;padding-left:15px;width:100%;height:30px;border:1pxdashed#C1C0AB;border-radius:2px;}

/*图片地址需要替换*/

#announcement{background:url(/*图片地址*/)leftcenterno-repeatscroll;height:25px;line-height:25px;overflow:hidden;float:left;}

#announcement a{color:#000;}

#announcement a:hover{color:#94382B;}

.announcement_remove{padding:1px10px;float:right;font-size:14px;}

.announcement_remove a{height:18px;width:18px;display:block;line-height:16px;margin:4px03px0;margin:10px03px09;text-align:center;}

.announcement_remove a:hover{background-color:#cdc8a0;box-shadow:1px1px1px#66614cinset;-webkit-box-shadow:1px1px1px#666inset;-moz-box-shadow:1px1px1px#666inset;border-radius:3px;}

#announcement_close{color:#666;}

#announcement span{color:#666;}

#announcement ul{list-style-type:none}

2015-4-25友情提示:可以使用键盘左右方向键来浏览上一篇和下一篇文章2015-4-24老师上生物课,说到精子的结构和成分,老师说精子的主要成分是蛋白质,一女生提问老师为什么不是甜的呢?全班爆笑,女生脸红跑出教室。
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值