公告系統 V1

我們時常會在部落格公告一些事項
而公告若只寫在一處/一頁可能很少人能看見
若分開很多地方寫可能某些忘了改導致某些地方的公告不是最新
因此我們Yis Blog寫了這個公告系統 幫助大家架設

安裝

1)設定資訊

<script>
var yisBulletin={
"LoadingHtml":"載入中......",
"BulletinId":"bulletin",
"BulletinUrl":"/p/bulletin.html",
"ContainerClass":"bulletin_board",
"SwitchRedirect":true,
"RedirectUrl":"/p/bulletin_4.html"
}
</script>

上述參數設定

LoadingHtml: 仍在載入公告時顯示的html
BulletinId: 公告「頁面」的ID,請見這兒
BulletinUrl: 公告「頁面」的網址
ContainerClass: 公告欄Class
SwitchRedirect: 可為true/false
若為true則在用戶進入BulletinUrl時會被重新導向到RedirectUrl
反之則不會被重新導向

2)找地方安裝程式碼
(建議可以安裝在範本中 每個網頁皆適用)

<script>
function BulletinBoard(t){this.class=t.ContainerClass,this.html=t.LoadingHtml,this.id=t.BulletinId,this.url=t.BulletinUrl,this.Rurl=t.RedirectUrl,this.openR=t.SwitchRedirect,this.loading(),this.disable(),this.render()}BulletinBoard.prototype.loading=function(){var t=this.html,i=this.class;$("."+i).each(function(){$(this).html(t)})},BulletinBoard.prototype.render=function(){var t=this.class,i=this.id,l=this.url;$("."+t).each(function(){$(this).load(l+" #"+i)})},BulletinBoard.prototype.disable=function(){this.openR&&-1<location.href.indexOf(this.url)&&(location.href=this.Rurl)},$(function(){new BulletinBoard(yisBulletin)});
</script>

使用方法

1)設定公告內容
進入Blogger的「頁面」
建立一篇文章
輸入下面程式碼並進行更改
<div id='ID'>公告內容</div>
藍字處更改為自己的公告內容 可為任意HTML或純文字
紅字處則設定為上面設定的ID

2)放入公告
在你要加入公告的地方放入
<div class='CLASS'></div>
在紅字處改為上面設定的class名稱
即可在頁面上發現公告已經載入

本文採用 BY-NC-NC CC 條款授權,如無特別註明均為原創,轉載請註明出處「Hsuan 來自 Cotpear」 及本文網址。
本文網址: https://www.cotpear.com/2019/02/v1-html/
暫無評論

發怖評論 編輯評論


上一篇
下一篇