見出し画像

【THE THOR(ザ・トール)】メインビジュアルのヘッダーを透過させるカスタマイズ

2024年7月5日更新

WordPress有料テーマ「THE THOR(ザ・トール)」のカスタマイズについてです。

インパクトのあるファーストビューを作るために、「トップページのヘッダーを透過させメインビジュアルに重ねて表示させたい」といった要望をクライアントから受けることがあります。

以下がイメージするトップページです↓

画像3


残念ながらTHE THORの機能では、トップページのヘッダー部分を透過させることはできません。


テーマファイルを編集しない方法で、THE THORのヘッダーを透過させた作業内容をシェアします。


【カスタマイズを実装したデモサイト】

以下のデモサイトが、今回のカスタマイズを実装したものです。

デモサイト①
デモサイト②


THE THORのメインビジュアルは以下3種類あります。今回のカスタマイズは全て対応しています。

・静止画
・スライドショー
・YouTube動画


【バージョン情報】

  • WordPress:6.5.1

  • The Thor:2.5.1



【備考】
THE THORのバージョンは本記事執筆時に利用できる最新バージョンの2.3.5です。THE THORの士業系デモサイトの作り方は次の記事で解説しています。


THE THORを使った企業サイトの作り方は次の記事で紹介しています。


記事更新履歴


  • 2024年7月 The thor最新バージョン(2.5.1)での対応を確認

  • 2023年2月 記事内容を一部更新




ここから先は

1,366字 / 2画像

¥ 7,980

期間限定 PayPay支払いすると抽選でお得に!

この記事が気に入ったらサポートをしてみませんか?