フォーラムへの返信
-
【お使いの Snow Monkey のバージョン】
【お使いの Snow Monkey Blocks のバージョン】
【お使いの Snow Monkey Editor のバージョン】
【お使いのブラウザ】トピック立てるときはこちらの情報を入れてください。
ご質問のなかに・・・お問い合わせページ完了後のサンクスページ
とのことですが、Snow Monkey Forms を以下の方法で送信完了画面（別ページ）にジャンプさせているという認識で合ってますか？
Snow Monkeyに限らず、head内に入れるなら、以下のような感じになると思います。
add_action( 'wp_head', function () { if ( is_front_page() ) { // トップページの場合 ?> // 「タグpagevisit」の中身 <?php } elseif ( is_page( 'thanks' ) ) { // 送信完了ページのスラッグが thanks の場合 ?> // 「タグsignup」の中身 <?php } } );いいねをした人:
少しメンテナンス性は落ちますが、頻繁に画像などを変更することがなければ、Snow Monkey Editor の 表示設定（ウィンドウサイズ）には、ブロック単位でデバイスごとに表示・非表示を切り替える機能があります。
それを利用することを前提に、レイアウトや画像の異なるセクションブロック（PC用、タブレット用、スマホ用）を3つ設置して、各デバイスのみで表示するようにすれば、意図した感じに近づけることができそうです。
アイデアの1つとしてご参考にしていただければと思います。いいねをした人:
便乗になりますが、横から失礼します。
自分も、こんなブロックがあったらいいなぁと思いました。
ブロックのイメージとしては、段落ブロックだけでなく、複数の要素を包括したグループブロックに適用できるのが使い勝手が良い気がします。
↓編集画面イメージ
ブロックとして独立するなら、セクションブロックやコンテナブロックのようにあとから要素を追加しやすいようなブロックだといいかもしれませんね。
名称は単純ですが、「折りたたみブロック」（Foldable Block）なんていうのはどうでしょうか？いいねをした人:
自分がもし実装するとしたら、再利用ブロックを使ってフッターの作成、あとで編集しやすいように考えます。
前提として…
外観→カスタマイズ（カスタマイザー）→デザイン→フッターを以下のように設定します。- PC 時のフッターウィジェットエリアのカラム数：1
- タブレット時のフッターウィジェットエリアのカラム数：1
- □フッターを全幅にする にチェックを入れる
※フッターをコンテンツ幅にするなら不要
以下のいずれかのプラグインを有効化して『再利用ブロック』を左メニューに表示＆ショートコードを利用できるようにします。
再利用ブロック内でフッターのレイアウトを作成→保存します。
そしてショートコードをコピー。
ウィジェットメニューの「フッター」にショートコードブロックを置き、ショートコードをペーストします。
フッター内の上下のpaddingが不要ならCSSを追記.l-footer .l-footer-widget-area { padding: 0 !important; }
こんな流れで独自のフッターを設置できると思います。
参考サイトのフッターだと 再利用ブロック内でカラムブロック（全幅）を利用すれば近いイメージになると思います。カラムの調整はしていませんが、10分程度で以下のフッターができました。
よかったら1つの方法として参考にしてください。いいねをした人:
メンテナンス性が悪いうえに、強引な方法なので不具合出るかもしれませんが、以下で実装可能かと思います。
@media screen and ( max-width: 768px ) { /* 【カバー】ブロックの「高度な設定」で指定したクラス名 */ .fixed_bg { overflow: hidden; } /* Snow Monkey Blocksで指定した画像は使用しない */ .fixed_bg .has-parallax { display: none; } /* 都合が悪いのでブロック設定で設定したオーバーレイの数値を戻す */ .fixed_bg .wp-block-cover__background { opacity: 1 !important; } /* 新たにスマホ用にオーバーレイを指定 */ .fixed_bg .wp-block-cover__background::before { background-color: #CD162C; /*任意*/ content:""; display:block; position:fixed; top:0; left:0; z-index:0; opacity: .7; /*オーバーレイの不透明度*/ width:100%; height:100%; } /* 新たに背景画像を指定 */ .fixed_bg .wp-block-cover__background::after { content:""; display:block; position:fixed; top:0; left:0; z-index:-1; width:100%; height:100vh; background-repeat: no-repeat; /* 位置は任意で調整 */ background-position: 20% center; /* 画像はPC用と同じものを使用 */ background-image:url('https://demo.gonsy.net/wp-content/uploads/2022/12/david-maunsell-nVRxhLH74iw-unsplash.jpg'); /* 適宜調整 */ background-size: 1200px; } }
実装したページ1つのCSSですべてのカバーブロックに適用させることはできませんが、参考になれば幸いです。
いいねをした人:
