網頁教學:Blogger/Blogspot 版面設計與技術收錄(四)


這是 Blogger 教學綜合收錄第四篇。我們網站舊版實際上是建構在 Google 的 Blogger 系統。雖然 Blogger 具備有方便與安全的優點,但是自由度也會稍微受到約束。不過 Google 讓我們在版面規劃的部份,具有相當高度的自由,因此我們可以依照自己的想法,讓部落格更俱個人風格。

下面我將針對網路上,談到 Blogger 版面設計與應用的許多零碎資料,重新進行整理、驗證與分類,希望對大家有用。

修改前請注意⚠️,一旦修改 HTML 內容,原本「版面配置」中「網誌文章」下的「編輯內容」,將會停止使用者再更新。如果有需要使用特別設定,像是地址顯示等,請在修改範本前先行設定完成(但是新模板不一定支援)。建議大家在做任何修改前,務必先行備份範本,或是弄個測試網站先做測試呦。

加速網頁的讀取(載入)速度

方法:將 JavaScript 相關程式移到網頁最後再執行:

步驟一,將下列程式碼置放在欲顯示廣告、特效等需執行 Java/Script 程式的位置處(如原本的廣告位置,即可用此行程式碼進行替換):

<span id="VShowBox">顯示資訊文字</span>

步驟二,將下列程式碼置放在 HTML 網頁編輯中最底部的位置處(在 </BODY></HTML> 之前):

<span id="Delay_VShowBox" style="display: none">
<!-- 將原本的 JavaScript 程式碼移至此處。By https://www.vedfolnir.com -->
</span>
<script type="text/javascript">
var Show00=document.getElementById("VShowBox");
var Show10=document.getElementById("Delay_VShowBox");
Show00.innerHTML=Show10.innerHTML;
Show10.innerHTML="";
</script>

關於錯誤警告

系統提示:剖析 XML 時發生錯誤 (第 xxxx 行,第 xx 欄):The reference to entity “xxx” must end with the ‘;’ delimiter.

解決方式:如果您在編輯完 HTML,Blogger 系統卻告知您這條錯誤訊息,並且禁止您進行儲存動作時,表示程式在 xxxx 行出現錯誤,這種情況大多出現在該行程式中的「網址」相關。您可以將出問題的網址列放置在網頁編輯器中,藉以查詢出真實的網頁原始碼,再進行替換即可。

繼續閱讀
  1. Blogger / Blogspot 版面設計與技術收錄(一)
  2. Blogger / Blogspot 版面設計與技術收錄(二)
  3. Blogger / Blogspot 版面設計與技術收錄(三)
分享這篇文章:

使用 Email 訂閱 最新消息不漏接

我們尊重您的隱私,隨時可取消訂閱。

留言

發佈留言

發佈留言必須填寫的電子郵件地址不會公開。 必填欄位標示為 *