纯代码实现知更鸟begin主题弹窗公告

虫子君
虫子君
虫子君
652
文章
278
评论
2020年3月5日20:59:05 评论 803 2139字阅读7分7秒

begin主题自己使用的时间长了以后,大部分知更鸟原有的主题功能已经完全可以满足自己的实际需求,对于新的功能并没有过高的需求,所以更新主题都没什么动力。今天在逛博客的时候发现有个站长做了一个begin主题的弹窗公告,所以虫子君既然已经看到那缪顺手牵羊拿回来吧。

使用过begin主题的用户都知道,begin主题是没有弹窗公告的,无奈不同的用户总会有不同的需求,如果您整好有需要的话可以尝试操作。

纯代码实现知更鸟begin主题弹窗公告

实现的效果如上,虫子君是觉得有点丑的,不知道您怎么看,折腾似乎已经成为我人生的余晖,那请继续。。。

/*弹窗代码*/
<link rel="stylesheet" href="<?php bloginfo('template_url');?>/css/notice.css" />
<div id="curriculum" class="gradient">
<h2>
<strong>重要通知</strong>
<a class="close" href="javascript:;" title="关闭 - close"></a>
</h2>
<ul>
<li>
<p>
<strong>关于访问</strong>
<span>哈哈作者是仙踪小站</span>
<em>2017-10-10</em>
</p>
</li>
<li>
<p>
<strong>关于评论</strong>
<span>暂时开放游客评论功能,请遵纪守法!</span>
<em>2017-10-09</em>
</p>
</li>
<li>
<p>
<strong>关于下载</strong>
<span>百度网盘提取码,需要留言后刷新页面获取!</span>
<em>2017-10-10</em>
</p>
</li>
<li>
<p>
<strong>关于本站</strong>
<span>共享精品,分享技术</span>
<em>2017-09-24</em>
</p>
</li>
</ul>
<div class="contact">
<h3>联系站长:虫子君</h3>
<h4>微信公众号 : 虫子君</h4>
<h4>Email:<span>bb@chonzi.com</span></h4>
<a href="javascript:;">返回</a>
</div>
</div>
<script style="display: none !important;">!function(e,t,r,n,c,a,l){function i(t,r){return r=e.createElement('div'),r.innerHTML='<a href="'+t.replace(/"/g,'&quot;')+'"></a>',r.childNodes[0].getAttribute('href')}function o(e,t,r,n){for(r='',n='0x'+e.substr(t,2)|0,t+=2;t<e.length;t+=2)r+=String.fromCharCode('0x'+e.substr(t,2)^n);return i(r)}try{for(c=e.getElementsByTagName('a'),l='/cdn-cgi/l/email-protection#',n=0;n<c.length;n++)try{(t=(a=c[n]).href.indexOf(l))>-1&&(a.href='mailto:'+o(a.href,t+l.length))}catch(e){}for(c=e.querySelectorAll('.__cf_email__'),n=0;n<c.length;n++)try{(a=c[n]).parentNode.replaceChild(e.createTextNode(o(a.getAttribute('data-cfemail'),0)),a)}catch(e){}}catch(e){}}(document);</script></body>
<script type="text/javascript" src="<?php bloginfo('template_url');?>/js/javascript.js"></script>
<script type="text/javascript" src="<?php bloginfo('template_url');?>/js/swiper.min.js"></script>

1、部署代码

将以上代码粘贴到begin主题的

后台→外观→编辑→查找footer.PHP,复制《首页重要公告弹窗美化代码》文件中的代码,粘贴到最后的</script>和</html>之间。

先把美化代码中关于上面3个文件的地址都换成你自己的文件地址,

然后把美化代码中的公告内容文字修改成你想显示的内容即可。

2、上传样式文件

在begin主题找到“/css/notice.css”这个路径,将我已经打包好的文件,解压以后上传到里面,然后功能就可以启用了。

我相信使用的过程中一定会遇到其他的问题,不妨跟我聊聊,说不定我可以帮上你。

继续阅读
  • 欢迎来“给我投稿”网友会因为你的帮助而感激。
  • 文章链接:https://chonzi.com/9271.html
美化知更鸟begin主题的插入文章模块更绚丽 WordPress教程

美化知更鸟begin主题的插入文章模块更绚丽

各种各样的美化,各种各样的要求,一千个人就有一千种神奇的想法,所以对于主题的美化虫子君也从来没有满足过。今天在叶忠文的博客当中浏览的时候发现一个不错的效果。就是当使用begin主题在文章内页当中插入文...
纯CSS实现WordPress底部增加水波动画效果 WordPress功能扩展

纯CSS实现WordPress底部增加水波动画效果

网站美化这个事情似乎是一个没有尽头的事情,就像虫子君现在的网站一样,虽然现在我已经觉得非常的漂亮了,但还是觉得有时候哪里缺少一点什么,似乎网站美化这个这个事情,就仿佛这一辈子都没完没了一样的。 嗯哼,...
begin主题代码高亮样式美化 WordPress教程

begin主题代码高亮样式美化

对于begin主题,虽然有着非常强大的功能,但是对于一些细节的把控,没有ui设计的鸟叔还是稍微有点力不从心。几乎每一次虫子君从鸟叔那里拿到新版的主题以后,都会自己调整一下。 这次调整了一下being主...
WordPress主题增加关注微信才能查看内容的功能 WordPress教程

WordPress主题增加关注微信才能查看内容的功能

做微信公众号的朋友有时候也会有自己的网站,用来存放历史文章,第一是可以方便我们的管理,另一个就是可以随时让小伙伴们在网站上面搜索。那就是是需要一个可以将流量转换成粉丝的一个功能,毕竟现在流量为王的年代...
在自己的WordPress博客中增加一个视频解析的页面 WordPress教程

在自己的WordPress博客中增加一个视频解析的页面

先声明一下,这是一个存在被封风险的操作,虫子君已经测试过,自己的另一个网站就这样被腾讯给封闭的,导致现在百度还不收录。 代码部分,来自文字咖,并非虫子君自己写的。 其中需要同学们介绍的几点知识,其中最...

您必须才能发表评论!