Title: Jamie’s Header Effects
Author: jamiemarsland
Published: <strong>2026年10月9日</strong>
Last modified: 2026年10月9日

---

プラグインを検索

![](https://ps.w.org/jamies-header-effects/assets/banner-772x250.jpg?rev=3736704)

![](https://ps.w.org/jamies-header-effects/assets/icon-256x256.png?rev=3736704)

# Jamie’s Header Effects

 作者: [jamiemarsland](https://profiles.wordpress.org/jamiemarsland/)

[ダウンロード](https://downloads.wordpress.org/plugin/jamies-header-effects.1.0.0.zip)

 * [詳細](https://ja.wordpress.org/plugins/jamies-header-effects/#description)
 * [レビュー](https://ja.wordpress.org/plugins/jamies-header-effects/#reviews)
 *  [インストール](https://ja.wordpress.org/plugins/jamies-header-effects/#installation)
 * [開発](https://ja.wordpress.org/plugins/jamies-header-effects/#developers)

 [サポート](https://wordpress.org/support/plugin/jamies-header-effects/)

## 説明

Jamie’s Header Effects makes your block theme’s header feel alive. Turn it on, pick
an effect, and your header follows the visitor down the page — gracefully.

**Chameleon** — the headline feature. As you scroll, the header samples the colour
of the section underneath it and recolours itself to match, automatically switching
its text between light and dark for contrast. Scroll from a navy hero into a cream
section into a forest-green footer and the header changes with you. No configuration
per section; it just works.

**Frosted blur** — a translucent, blurred header that lets the page show through,
like frosted glass. Set the colour, opacity and blur amount.

**Solid colour** — a classic sticky header with your chosen colour and opacity, 
and a soft shadow when stuck.

**Hide on scroll down, reveal on scroll up** — the header slips away while you read
and comes back the moment you scroll up. Tune the sensitivity and delay.

**Transparent overlay header** — float the header over your first section for the
full-bleed hero look, with no layout jump.

Everything else you’d expect is here too: an automatic admin-bar offset, z-index
control, a “push content down” option, a mobile breakpoint to disable the effect
on small screens, and the ability to switch it off for particular post types or 
templates. Transitions respect `prefers-reduced-motion`.

It’s theme-agnostic (it finds your header automatically, with an override selector
for unusual themes), accessible, and ships no jQuery.

**Settings:** Appearance  Header Effects.

## スクリーンショット

[⌊Chameleon mode: the header takes on the colour of each section as you scroll.⌉⌊
Chameleon mode: the header takes on the colour of each section as you scroll.⌉[

Chameleon mode: the header takes on the colour of each section as you scroll.

[⌊Frosted-glass blur header over a photo.⌉⌊Frosted-glass blur header over a photo
.⌉[

Frosted-glass blur header over a photo.

[⌊The settings screen under Appearance → Header Effects.⌉⌊The settings screen under
Appearance → Header Effects.⌉[

The settings screen under Appearance  Header Effects.

## インストール

 1. Upload the `jamies-header-effects` folder to `/wp-content/plugins/`, or install
    it from the Plugins screen.
 2. Activate the plugin.
 3. Go to **Appearance  Header Effects**, tick **Enable sticky header**, choose a background
    style (try **Chameleon**), and save.

## FAQ

### Which themes does it work with?

Any block theme. By default it looks for the header template part (`header.wp-block-
template-part`, then the first `header` inside the site wrapper). If your theme 
is unusual, enter your own CSS selector in the **Header selector** field.

### How does Chameleon decide the colour?

As you scroll, it looks at the section directly beneath the header, finds that section’s
background colour (including Cover blocks and their overlays), and applies it to
the header at your chosen opacity. It then picks black or white text based on the
colour’s brightness so the header stays readable. Sections with no solid background(
an image-only section, say) make the header transparent.

### Does it work with the WordPress admin bar?

Yes. **Offset for admin bar** (on by default) positions the sticky header just below
the admin bar when you’re logged in.

### Can I turn it off on mobile, or on certain pages?

Yes. Set a mobile breakpoint to disable it on small screens, and untick it for specific
post types or templates (home, front page, blog, single, page, archive, 404, search)
under **Disable on**.

### What’s the difference between “Push content down” and “Overlay page content”?

“Push content down” adds space below the header so content starts beneath it. “Overlay
page content” does the opposite: it floats the header over the first section, the
classic transparent-hero look. If both are ticked, overlay wins.

### Does it respect reduced-motion preferences?

Yes. If a visitor has asked their system to reduce motion, transitions are disabled
and the hide-on-scroll animation is turned off.

## 評価

このプラグインにはレビューがありません。

## 貢献者と開発者

Jamie’s Header Effects はオープンソースソフトウェアです。以下の人々がこのプラグイン
に貢献しています。

貢献者

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

[“Jamie’s Header Effects” をあなたの言語に翻訳しましょう。](https://translate.wordpress.org/projects/wp-plugins/jamies-header-effects)

### 開発に興味がありますか ?

[コードを閲覧](https://plugins.trac.wordpress.org/browser/jamies-header-effects/)
するか、[SVN リポジトリ](https://plugins.svn.wordpress.org/jamies-header-effects/)
をチェックするか、[開発ログ](https://plugins.trac.wordpress.org/log/jamies-header-effects/)
を [RSS](https://plugins.trac.wordpress.org/log/jamies-header-effects/?limit=100&mode=stop_on_copy&format=rss)
で購読してみてください。

## 変更履歴

#### 1.0.0

 * Initial release: Chameleon, frosted blur and solid sticky backgrounds; hide on
   scroll down / reveal on scroll up; transparent overlay and push-content-down 
   layouts; admin-bar offset; mobile breakpoint; disable by post type or template;
   reduced-motion support.

## メタ

 *  バージョン **1.0.0**
 *  最終更新日 **2日前**
 *  有効インストール数 **10未満**
 *  WordPress バージョン ** 6.2またはそれ以降 **
 *  検証済み最新バージョン: **7.1.3**
 *  PHP バージョン ** 7.4またはそれ以降 **
 *  言語
 * [English (US)](https://wordpress.org/plugins/jamies-header-effects/)
 * タグ
 * [block-theme](https://ja.wordpress.org/plugins/tags/block-theme/)[header](https://ja.wordpress.org/plugins/tags/header/)
   [scroll effects](https://ja.wordpress.org/plugins/tags/scroll-effects/)[sticky header](https://ja.wordpress.org/plugins/tags/sticky-header/)
   [transparent header](https://ja.wordpress.org/plugins/tags/transparent-header/)
 *  [詳細を表示](https://ja.wordpress.org/plugins/jamies-header-effects/advanced/)

## 評価

レビューはまだ送信されていません。

[Your review](https://wordpress.org/support/plugin/jamies-header-effects/reviews/#new-post)

[すべてのレビューを見る](https://wordpress.org/support/plugin/jamies-header-effects/reviews/)

## 貢献者

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

## サポート

意見や質問がありますか ?

 [サポートフォーラムを表示](https://wordpress.org/support/plugin/jamies-header-effects/)