Typecho博客添加弹出公告

最近在逛博客的时候，发现右上角弹出公告挺好看的。
刚开始去问别人，都在说这个是插件，我就小心翼翼的问了一下插件的名字是什么......
A：这个插件叫什么名字哇，我去下载一下
B:~~你不会百度？~~这个插件是？

我傻了(这不是发一下名字的事么...)::quyin:fue::

当然，我还是太菜了

非常感谢博主的帮助->季春二九感谢他告诉我这个不是插件
通过自己的摸索与他人的帮助，我也成功的将通知显示了出来.
话不多说，上教程!

1、需要去将下边代码加入到你的footer.php文件中，也可以只放到自己需要的位置！

{hide}
{collapse}
{collapse-item label="代码" close}

<script>
   // 自定义公告显示
   document.addEventListener('DOMContentLoaded', initNotice2);
   function initNotice2() {
       const common = {
           loadResource: function (id, resource, type) {
               return new Promise(function (resolve, reject) {
                   let loaded = document.head.querySelector('#' + id);
                   if (loaded) {
                       resolve('success: ' + resource);
                       return;
                   }
                   const element = document.createElement(type);
                   element.onload = element.onreadystatechange = () => {
                       if (!loaded && (!element.readyState || /loaded|complete/.test(element.readyState))) {
                           element.onload = element.onreadystatechange = null;
                           loaded = true;
                           resolve('success: ' + resource);
                       }
                   }
                   element.onerror = function () {
                       reject(Error(resource + ' load error!'));
                   };
                   if (type === 'link') {
                       element.rel = 'stylesheet';
                       element.href = resource;
                   } else {
                       element.src = resource;
                   }
                   element.id = id;
                   document.getElementsByTagName('head')[0].appendChild(element);
               });
           },
           loadResources: function () {
               const initVue = this.initVue;
               const loadResource = this.loadResource;
               const host = '//s0.pstatp.com/cdn/expire-1-M/';
               const resources = [
                   'vue/2.6.10/vue.min.js',
                   'element-ui/2.8.2/index.js',
                   'element-ui/2.8.2/theme-chalk/index.css'
               ];
               const loadPromises = [];
               resources.forEach(resource => {
                   loadPromises.push(loadResource(btoa(resource).replace(/[=+\/]/g, ''), host + resource,
                       ({
                           'css': 'link',
                           'js': 'script'
                       })[resource.split('.').pop()]
                   ));
               });
               Promise.all(loadPromises).then(
                   function () {
                       let flag = false;
                       const waitVue = setInterval(() => {
                           if (!flag && typeof Vue === 'function') {
                               flag = true;
                               initVue();
                               clearInterval(waitVue);
                           }
                       }, 100);
                   }
               );
           },
           initVue: function () {
               var blog = new Vue({
                   el: document.createElement('div'),
                   created() {
                       this.sayHello();
                       window.alert = this.alert;
                   },
                   computed: {
                       hello: function () {
                           var hours = (new Date()).getHours()
                           var t
                           if (hours < 5) {
                               t = '凌晨了，注意休息哦！'
                           } else if (hours >= 5 && hours < 8) {
                               t = '早上好，新的一天又是元气满满呢！'
                           } else if (hours >= 8 && hours < 12) {
                               t = '上午好！'
                           } else if (hours === 12) {
                               t = '中午好！'
                           } else if (hours > 12 && hours <= 18) {
                               t = '下午好！'
                           } else if (hours > 18 && hours <= 22) {
                               t = '晚上好！'
                           } else if (hours > 22 && hours < 24) {
                               t = '夜深了，注意休息哦！'
                           }
                           return t
                       }
                   },
                   methods: {
                       alert: function (message, title, type, duration, showClose, offset, onClose) {
                           if (duration !== 0) {
                               duration = 4500;
                           }
                           this.$notify({
                               message: message,
                               type: type || 'error',
                               title: title || '警告',
                               duration: duration,
                               showClose: showClose || false,
                               offset: offset || 0,
                               onClose: onClose
                           })
                       },
                       sayHello: function () {
                           setTimeout(() => {
                               this.alert('欢迎来到 吃货智 的Blog！', this.hello, 'success');
                           }, 1000);
                       }
                   },
               })
           }
       };
       common.loadResources();
   }
</script>

{/collapse-item}
{/collapse}
{/hide}