パララックスを設定するために以下のようにしてあります。

1.カバーブロックの 追加CSSクラス に cover-parallax を指定する。

2.カバーブロックの [メディア設定] で [固定背景] を有効にする。

2.以下のスタイルを追加する。

.cover-parallax {
background-attachment: fixed;
background-position: 50% 0;
}

3.JavaScript に以下の行を追加する。

var parallax = -0.5;
var $bg_images = $(".cover-parallax");
var offset_tops = [];
$bg_images.each(function(i, el) {
offset_tops.push($(el).offset().top);
});
$(window).scroll(function() {
var dy = $(this).scrollTop();
$bg_images.each(function(i, el) {
var ot = offset_tops[i];
$(el).children(".wp-block-cover__image-background").css("background-position", "50% " + (dy - ot) * parallax + "px");
});
});

WordPress 6.1 になってカバーブロックの HTML が変わったので、以下のように変更してある。

WordPress 6.0.* 以前

$(el).css("background-position", "50% " + (dy - ot) * parallax + "px");

WordPress 6.1 以降

$(el).children(".wp-block-cover__image-background").css("background-position", "50% " + (dy - ot) * parallax + "px");

参考にしたページ https://leap-in.com/ja/add-parallax-effect-to-gutenberg-background-image-in-wordpress-5-0-5minssample-attached-2/

※上記のページはもう存在しないようです。[2022.12.9 時点]

カバー画像にパララックスを設定

この部分は、カバーに PR Content を入れて作ってあります。

カバー画像(全幅)にパララックスを設定

この部分もカバーに PR Content を入れて作ってありますが、カバーを全幅に設定してあります。
PR Content の幅が広くならないように、カスタムCSSに以下のスタイルを追加してあります。
.alignfull {
padding-left: calc(50vw – 50%);
padding-right: calc(50vw – 50%);
}

カバー画像(全幅) パララックスなし

この部分は、カバーに PR Content を入れて作ってありますが、カバーを全幅に設定してあります。
PR Content の幅が広くならないように、カスタムCSSに以下のスタイルを追加してあります。
.alignfull {
padding-left: calc(50vw – 50%);
padding-right: calc(50vw – 50%);
}