Title: HeadFoot – Header & Footer Builder for Elementor
Author: Michael
Published: <strong>2026 年 10 月 20 日</strong>
Last modified: 2026 年 10 月 20 日

---

搜尋外掛

![](https://s.w.org/plugins/geopattern-icon/headfoot.svg)

# HeadFoot – Header & Footer Builder for Elementor

 由 [Michael](https://profiles.wordpress.org/migaweb/) 開發

[下載](https://downloads.wordpress.org/plugin/headfoot.1.0.0.zip)

 * [詳細資料](https://tw.wordpress.org/plugins/headfoot/#description)
 * [使用者評論](https://tw.wordpress.org/plugins/headfoot/#reviews)
 *  [安裝方式](https://tw.wordpress.org/plugins/headfoot/#installation)
 * [開發資訊](https://tw.wordpress.org/plugins/headfoot/#developers)

 [技術支援](https://wordpress.org/support/plugin/headfoot/)

## 外掛說明

HeadFoot adds a header and footer builder to the free version of Elementor. You 
build a header or a footer as a normal Elementor template. You then tell the plugin
where to show it: on the whole site, on all pages, on one page, on an archive, or
for one user role.

The plugin does not add widgets and it does not need Elementor Pro. You work with
the widgets that free Elementor ships.

#### Features

 * Four template types under Appearance, Header & Footer: Header, Below Header, 
   Above Footer, and Footer.
 * Full Elementor editor support with a preview that shows only the template.
 * Display rules: entire website, singulars, archives, front page, blog page, 404
   page, search page, date archive, author archive, every public post type, every
   public taxonomy, and specific pages, posts, or terms.
 * Exclusion rules that always win over display rules.
 * A user role rule: all, logged in, logged out, or any role.
 * The rules in the meta box and in the Elementor panel. Both write the same values.
 * Automatic output in the active theme. Astra, GeneratePress, OceanWP, and Hello
   Elementor get a dedicated integration. Block themes get their header and footer
   template parts replaced. Every other classic theme gets a generic fallback.
 * Output on Elementor Canvas pages as a per template choice.
 * The shortcode `[headfoot_template id="123"]` and PHP functions to render a template
   anywhere.
 * A configuration page with the theme integration mode.
 * A switch that shows the font families of the WordPress font library in the Elementor
   font picker.

#### Theme integration

The plugin picks the integration method for the active theme in this order:

 1. The theme declares `add_theme_support( 'headfoot' )` or `add_theme_support( 'header-
    footer-elementor' )`. The theme then calls `headfoot_render_header()` and `headfoot_render_footer()`
    itself. These functions print the Below Header and Above Footer templates too.
 2. The theme is Astra, GeneratePress, OceanWP, or Hello Elementor. The plugin swaps
    the theme header and footer on the theme hooks. Astra, GeneratePress, and OceanWP
    print the Below Header and Above Footer templates on their hooks after the theme
    header and before the theme footer.
 3. The theme is a block theme. The plugin replaces the template parts with the slugs`
    header` and `footer`. The Below Header and Above Footer templates print next to
    the template parts.
 4. Every other classic theme. The plugin replaces `header.php` and `footer.php` with
    a generic fallback.

You can force a method on the tab Settings under Appearance, Header & Footer.

#### Limits

The generic fallback skips `header.php` and `footer.php` of the theme. If the theme
opens wrapper elements in `header.php` and closes them in `footer.php`, the theme
CSS that targets those wrappers stops working on the page content. If this happens,
select the mode Theme support and call the plugin functions in the theme.

A Below Header or Above Footer template needs a place after the theme header or 
before the theme footer. Astra, GeneratePress, OceanWP, and block themes have one.
In the generic fallback, in Hello Elementor, and in the mode Theme support, the 
template shows only together with a Header or Footer template of the plugin. A theme
in the mode Theme support can call `headfoot_render_below_header()` and `headfoot_render_above_footer()`
at the places it wants.

In a shortcode and in a block theme, the plugin escapes the template markup with`
wp_kses()`. The plugin removes each `script` element and each event handler attribute,
so the JavaScript of an HTML widget does not run there. The CSS of a `style` element
goes to `wp_add_inline_style()`, and WordPress prints it with the other styles. 
The filter `headfoot_kses_allowed_html` changes the list of permitted elements and
attributes.

The user role rule does not work with full page caching. A cached page for a logged
out visitor serves the logged out header to everyone.

If Elementor Pro renders a theme builder template for the same location, the plugin
yields to Elementor Pro. If Elementor Header & Footer Builder (Ultimate Addons for
Elementor) is active, the plugin renders nothing, so the site never gets two headers.

#### Functions and hooks

Functions: `headfoot_get_template_id( $type )`, `headfoot_header_enabled()`, `headfoot_footer_enabled()`,`
headfoot_below_header_enabled()`, `headfoot_above_footer_enabled()`, `headfoot_render_header()`,`
headfoot_render_footer()`, `headfoot_render_below_header()`, `headfoot_render_above_footer()`,`
headfoot_get_header_html()`, `headfoot_get_footer_html()`, `headfoot_get_below_header_html()`,`
headfoot_get_above_footer_html()`, `headfoot_get_template_html( $id )`.

The type for `headfoot_get_template_id()` is `header`, `below_header`, `above_footer`,
or `footer`. The functions `headfoot_render_header()` and `headfoot_get_header_html()`
include the Below Header template after the header. The functions `headfoot_render_footer()`
and `headfoot_get_footer_html()` include the Above Footer template before the footer.

Filters: `headfoot_template_id`, `headfoot_rules`, `headfoot_rule_match`, `headfoot_header_wrapper`,`
headfoot_below_header_wrapper`, `headfoot_above_footer_wrapper`, `headfoot_footer_wrapper`,`
headfoot_kses_allowed_html`, `headfoot_theme_mode`, `headfoot_block_template_part_slugs`.

Actions: `headfoot_before_header`, `headfoot_after_header`, `headfoot_before_below_header`,`
headfoot_after_below_header`, `headfoot_before_above_footer`, `headfoot_after_above_footer`,`
headfoot_before_footer`, `headfoot_after_footer`.

## 安裝方式

 1. Install and activate Elementor.
 2. Upload the plugin folder to `/wp-content/plugins/` or install the plugin from the
    Plugins screen.
 3. Activate the plugin.
 4. Open Appearance, Header & Footer, and click Add New.
 5. Enter a title, select the type Header, and add the display rule Entire Website.
 6. Save the template, then click Edit with Elementor and build the header.
 7. Publish the template in Elementor. Repeat the steps with the type Footer for a 
    footer.

#### WordPress font library

WordPress 6.5 and newer has a font library. Turn on Enable WordPress Font Library
on the tab Settings, and every font family of the library shows in the Elementor
font picker in the group WordPress Font Library. The plugin prints the font files
of a family only on pages that use the family. The font library screen is part of
the Site Editor, so only a block theme offers a screen to upload fonts. Fonts that
already exist in the library work on every theme.

## 常見問題集

### Does the plugin need Elementor Pro?

No. The plugin works with the free version of Elementor. If Elementor Pro is active
and a Pro theme builder template claims the same location, the plugin yields to 
Elementor Pro.

### Where do I set the display rules?

In the meta box Template Settings on the edit screen of the template, or in the 
Elementor panel under Settings, Display Conditions. Both write the same values.

### Two templates match the same page. Which one shows?

The template with the more specific rule shows. A specific page beats a post type
rule, a post type rule beats All Singulars, and All Singulars beats Entire Website.
If two templates tie, the newer template shows.

### Where do the Below Header and Above Footer templates show?

A Below Header template shows right after the header, and an Above Footer template
shows right before the footer. Both have their own display rules. On Astra, GeneratePress,
OceanWP, and block themes they also show next to the theme header and footer. On
other themes they show only together with a Header or Footer template of the plugin.
The section Limits has the details.

### Why does the template not show on my Elementor Canvas page?

Turn on Enable on Elementor Canvas in the template settings. The Canvas page template
prints no theme header and no theme footer, so the plugin adds the template only
when you ask for it.

### The layout of my theme breaks with the header. What can I do?

Your theme uses the generic fallback. Open Appearance, Header & Footer, then the
tab Settings, and read the detected method. Select the mode Theme support and call`
headfoot_render_header()` and `headfoot_render_footer()` in the theme files, as 
the section Theme integration describes.

### How do I use my own fonts?

Upload the fonts to the WordPress font library in the Site Editor under Styles, 
Typography. Then turn on Enable WordPress Font Library on the tab Settings. The 
families show in the Elementor font picker in the group WordPress Font Library. 
On a classic theme the Site Editor is not available, so upload the fonts while a
block theme is active, or use a plugin that writes to the font library.

### Can I place a template inside a page or a widget area?

Yes. Copy the shortcode from the list table, for example `[headfoot_template id="
123"]`, and paste it into the content. The shortcode ignores the display rules.

## 使用者評論

這個外掛目前沒有任何使用者評論。

## 參與者及開發者

以下人員參與了開源軟體〈HeadFoot – Header & Footer Builder for Elementor〉的開發
相關工作。

參與者

 *   [ Michael ](https://profiles.wordpress.org/migaweb/)

[將〈HeadFoot – Header & Footer Builder for Elementor〉外掛本地化為台灣繁體中文版](https://translate.wordpress.org/projects/wp-plugins/headfoot)

### 對開發相關資訊感興趣？

任何人均可[瀏覽程式碼](https://plugins.trac.wordpress.org/browser/headfoot/)、查看
[SVN 存放庫](https://plugins.svn.wordpress.org/headfoot/)，或透過 [RSS](https://plugins.trac.wordpress.org/log/headfoot/?limit=100&mode=stop_on_copy&format=rss)
訂閱[開發記錄](https://plugins.trac.wordpress.org/log/headfoot/)。

## 變更記錄

#### 1.0.0

 * First release.

## 中繼資料

 *  版本 **1.0.0**
 *  最後更新 **20 小時前**
 *  啟用安裝數 **少於 10 次**
 *  WordPress 版本需求 ** 6.2 或更新版本 **
 *  已測試相容的 WordPress 版本 **7.1.3**
 *  PHP 版本需求 ** 7.4 或更新版本 **
 *  語言
 * [English (US)](https://wordpress.org/plugins/headfoot/)
 * 標籤:
 * [elementor](https://tw.wordpress.org/plugins/tags/elementor/)[footer](https://tw.wordpress.org/plugins/tags/footer/)
   [footer builder](https://tw.wordpress.org/plugins/tags/footer-builder/)[header](https://tw.wordpress.org/plugins/tags/header/)
   [header builder](https://tw.wordpress.org/plugins/tags/header-builder/)
 *  [進階檢視](https://tw.wordpress.org/plugins/headfoot/advanced/)

## 評分

這個項目尚無任何評論記錄。

[撰寫評分](https://wordpress.org/support/plugin/headfoot/reviews/#new-post)

[查看全部使用者評論](https://wordpress.org/support/plugin/headfoot/reviews/)

## 參與者

 *   [ Michael ](https://profiles.wordpress.org/migaweb/)

## 技術支援

使用者可在技術支援論壇提出意見反應或使用問題。

 [檢視技術支援論壇](https://wordpress.org/support/plugin/headfoot/)