什麼是WordPress網站?
什麼是WordPress網站?

Header Footer Code Manager WordPress外掛介紹

Header Footer Code Manager是一個擁有簡單界面的WordPress外掛,可以將代碼段添加到頁眉或頁腳或頁面內容的上方或下方。

目錄

Header Footer Code Manager 簡稱 HFCM,安裝外掛之後在 WordPress後台側欄也會出現 HFCM 的外掛選項,可以在那邊修改您添加在頁眉(header)或頁腳(footer)的程式代碼。

如何安裝外掛呢?先至網站後台,側欄–>外掛–>安裝外掛,在搜尋處搜尋HFCM,就可以找到外掛囉!安裝之後並啟用,即可開始進行設定。

截圖 2022 10 11 下午2.41.20
安裝HFCM外掛

使用 Header Footer Code Manager 的好處

永遠不必擔心添加代碼無意中破壞您的網站,也可以避免無意中將代碼片段放在錯誤的位置。HFCM 幫您整合了添加代碼的方式,讓您可以以一個外掛擋十個外掛!減少不必要的外掛。在切換或更改主題時永遠不會丟失代碼,更讓您知道網站上正在加載哪些代碼片段,它們顯示的位置以及添加的人是誰

外掛設定列表非常簡單明瞭,這邊會顯示目前您加在網站上的代碼,以及您當初設定的代碼名稱,也有開關可以控制是否運作。

截圖 2022 10 11 下午2.38.26
儀表板 – 所有程式碼片段

如何使用 HFCM?

目前外掛已有本地化,可以看到中文版,在設定上更方便。

可以點選新增代碼片段(Add New Snippet)修改代碼片段(Edit Snippet)

這邊可以填寫

  • 代碼名稱
  • 代碼類型:HTML、CSS、Javascript
  • 頁面顯示:整個網站、特定的文章或頁面、特定的分類或標籤、最新的文章或短代碼等等
  • 排除的頁面
  • 排除的文章
  • 插入代碼的地方:Header或是Footer
  • 在什麼裝置下顯示:全部的裝置、只有在桌上型電腦顯示、只有在行動裝置顯示
  • 代碼狀態:啟用或停用

在下方的區塊程式碼片段就可以新增代碼。

截圖 2022 10 11 下午2.43.56
HFCM設定

什麼代碼會加在Header?

我們常說的網站埋碼就是加在Header唷!例如常見的Google Analytics的追蹤代碼、臉書的像素代碼、html驗證、驗證meta等等。

<head> 標籤作用上是當作一個容器,裡面包含著不同用途的 HTML tags,而這些 tag 的內容通常不會被顯示在頁面上,僅用來說明關於該網頁的元資訊 (metadata),像是指定網頁的標題,或像是指定該網頁所使用的編碼等。

被包含在 <head> 裡面的標籤有這些:

  • <title> 網頁名稱
  • <meta> 網頁 metadata
  • <style> CSS 樣式
  • <link> CSS 樣式表
  • <script> JavaScript 程式碼
  • <noscript> 網頁不支援 JavaScript 時的處理
  • <base> base URL

什麼代碼會加在Footer?

foot 通常加 js 程式碼,有時埋碼也會加在這裡。

<footer> 標籤 (tag) 用來定義一個頁尾或結尾區塊,常見的 footer 是網頁最下面的頁尾區塊會包含作者、版權、聯絡方式等資訊。

一個網頁中除了可以有主要的網頁頁尾 (page footer) 區塊外,<article>, <section>, <aside>, <nav> 這些 HTML 語意區塊中都可以有自己的 <footer>。

外掛支援服務

  • Google Analytics
  • Google Adsense
  • Google Tag Manager
  • Clicky Web Analytics or 其他分析追蹤代碼
  • Chat modules 像是 Olark, Drip
  • Pinterest 網站驗證
  • Facebook 像素, Facebook 代碼, Facebook og:image 標籤
  • Google Conversion 像素
  • Twitter
  • 任何服務的任何代碼 (HTML / Javascript / CSS)

延伸閱讀:

各種ChatGPT及AI工具應用、指令手冊、解決方案,每週更新。
學習最新AI工具,就上Learn AI
AI如何讓工作更輕鬆、更有效率?立刻學習!
LA廣告-1
LA廣告-2
LA廣告-3
Related Post

最新文章

WordPress自架網站:架站前需知道的 11 個常見問題

這篇詳盡的指南將探討WordPress自架網站過程中可能遇到的常見問題,包括技術錯誤、安全風險、性能問題等。文章將提供針對每種問題的實用解決方案和預防策略,幫助讀者了解如何提升網站安全性、提高性能,並確保網站長期穩定運行。無論您是初學者還是有經驗的網站管理員,本文都將成為您不可或缺的資源。

hero section

如何創建出色的網站主頁橫幅(Hero Section)設計?

在本文中,我們深入探討如何創建出色的網站主頁橫幅 (Hero Section) 設計。從選擇相關的圖像到設計簡短、有力的標語,我們提供實用的技巧和建議,幫助您吸引用戶的注意力並引導他們實現目標。了解如何平衡視覺吸引力和用戶需求,確保您的網站主頁橫幅既美觀又高效。

WordPress 後台

WordPress 後台速度慢該如何解決?10+個簡單方法

本文探討了多種解決 WordPress 後台運行緩慢的策略,包括選擇性能更強的主機、精簡必要的外掛、以及定期清理和最佳化數據庫。我們還介紹了如何通過實施快取技術來提升網站速度。這些簡單實用的方法將幫助您改善 WordPress 後台的響應速度,提升整體網站的管理效率和用戶體驗。

網站架設費用

網站架設費用:從基本到進階配置的全面費用分析

本文將提供一個全面的網站建設費用分析,涵蓋從基礎設置到高級功能的所有成本要素。這包括域名、代管、設計、安全協議以及響應式網頁設計(RWD)等現代網站的必備技術。無論您是新手還是尋求升級現有網站的業主,這篇文章都將為您提供寶貴的指導和費用預算建議。

Selected Post

精選文章

網頁設計該知道的6件事

6 個關於網頁設計的重要事項

在這個不斷變化的網絡時代,網頁設計也經歷了巨大的變革。在開始或進行網站設計之前,有哪些重要事項值得了解呢?讓我們分享給您!

SSL憑證

SSL憑證/https是什麼?對網站SEO排名有很大的影響?

SSL(Secure Sockets Layer),也就是安全資料傳輸層憑證,是網頁伺服器與瀏覽器之間的加密通信安全技術,確保您的網站資料不容易被攔截。但它對於網站的SEO又有什麼影響呢?我們將解釋這個重要的議題,讓您更了解SSL憑證的作用。

網站速度慢的5個原因

網站速度慢的5個原因

對於現在講求快速、即時的時代,若使用者開啟一個網站,網站速度非常慢,要等老半天,是不是會讓你想關掉網站,降低造訪意願呢?