页面底部增加滚动公告条

  • A+
所属分类:Wordpress

废话不多说,直接上代码:

把这两张图片传到你的主机里
页面底部增加滚动公告条
----
页面底部增加滚动公告条

把代码放到footer.php 中的 标签之前

set_feed_url( 'https://feed.sishaofeng.com/' ); //RSS 地址
$feed->set_file_class('WP_SimplePie_File');
$feed->set_cache_duration( 600 ); //缓存时间,600秒
$feed->init();
$feed->handle_content_type();
$items = $feed->get_items( 0, $num );
echo '

';
}
wgToolBar_notice( 5 ); //输出数量
?>


按照代码后面的注释,修改成你的地址。以上代码中我只是示例加了 QQ 微博、Twitter、Facebok 三个 SNS,如果需要添加更多,可以根据以下样式对应 ID 继续添加,样式中支持了新浪微博、搜狐微博、网易微博、百度说吧、Twitter、QQ 微博、嘀咕、豆瓣、Facebook 九大主流 SNS、微博。

把下面的代码复制到主题的style.css里

html{_background-image:url(about:blank);_background-attachment:fixed;}
#wgToolBar{width:100%;height:30px;position:fixed;background:#000;z-index:9999;overflow:hidden;opacity:0.7;filter:alpha(opacity=70);-moz-opacity:.7;}
#wgToolBar a{text-decoration:none;}
#wgNotice{float:left;background:url(images/notice_icon.gif) no-repeat 10px 3px;margin:0;padding:0 0 0 40px;}
#wgNotice li{list-style-type:none;color:#fff;font:13px/30px 'Microsoft Yahei',微软雅黑,Arial,SimSun;}
#wgNotice li a{color:#fff;}
#wgNotice li a:hover{color:#06c;}
#wgSNS{float:right;padding:5px 10px 0 0;margin:0;}
#wgSNS li{float:left;margin:0 5px;display:inline;list-style-type:none;}
#wgSNS li a{width:20px;height:20px;display:block;background:url(images/sns_icon.png) no-repeat;text-indent:-9999em;}
#wgSNS li a:hover{transform:scale(1.5);-webkit-transform:scale(1.5);-moz-transform:scale(1.5);-o-transform:scale(1.5);}
#wgSNS #tb_fav{background-position:0 0;}
#wgSNS #tb_mail{background-position:0 -25px;}
#wgSNS #tb_rss{background-position:0 -50px;}
#wgSNS #tb_sohu{background-position:0 -75px;}
#wgSNS #tb_twitter{background-position:0 -100px;}
#wgSNS #tb_sina{background-position:0 -125px;}
#wgSNS #tb_net163{background-position:0 -150px;}
#wgSNS #tb_baidu{background-position:0 -175px;}
#wgSNS #tb_douban{background-position:0 -200px;}
#wgSNS #tb_facebook{background-position:0 -225px;}
#wgSNS #tb_tencent{background-position:0 -250px;}
#wgSNS #tb_digu{background-position:0 -275px;}
body{margin-bottom:30px;}
#wgToolBar{border-radius:5px 5px 0 0;box-shadow:0px -5px 5px #565656;-moz-border-radius:5px 5px 0 0;-webkit-border-radius:5px 5px 0 0;-khtml-border-radius:5px 5px 0 0;-webkit-box-shadow:0px -5px 5px #565656;-moz-box-shadow:0px -5px 5px #565656;bottom:0;_position:absolute;_top:expression(eval(document.documentElement.scrollTop+document.documentElement.clientHeight-this.offsetHeight-(parseInt(this.currentStyle.marginTop,0)||0)-(parseInt(this.currentStyle.marginBottom,0)||0)));}

加载 jQuery库



在加载以后,接着添加这些代码



搞定,刷新你的网站看看效果把。

avatar

发表评论

:?: :razz: :sad: :evil: :!: :smile: :oops: :grin: :eek: :shock: :???: :cool: :lol: :mad: :twisted: :roll: :wink: :idea: :arrow: :neutral: :cry: :mrgreen:

目前评论:2   其中:访客  1   博主  1

    • avatar Dear 0

      东西是好东西,但写的看不懂,比如:把下面的代码复制到主题的style.css里,到底是style.css具体哪里??我想博主你的写法不是专业建站的人基本看不懂,用户体验不咋好

        • avatar 一滴红尘泪 Admin

          @Dear @Dear : 你这话让人情何以堪,放到style.css里,放到style.css里面的任何地方都可以,只要是按照格式放好的,一般都知道CSS的格式把。。。。我真是无语死了。。。