【WordPress】SWELL:トップページのメインビジュアルの設定方法

カエルくん

久しぶりにWordPressの設定をやってみよう

れい

だいぶサボってました💦
今日は、トップページのメインビジュアルの設定をやってみよう!

トップページは、その名の通りサイトの一番最初に表示されるものになります。
サイトの顔といってもいいでしょう。

トップページを整えることによって、サイトが見やすくなったり、どんなサイトなのかひと目でわかるようになります。

トップページをどのようにしたいか、いろいろな方のブログを参考にしました。
とにかく最初はまねしてみよう!

ということで今回は、メインビジュアルの設定を行っていきます。

目次

メリンビジュアルの設定方法

SWELLでは、カスタマイズ画面でトップページの上部に『メインビジュアル』として、写真や画像、動画を挿入することができます。

STEP
カスタマイズを開く

『外観』⇨『カスタマイズ』を選択します。

STEP
トップページからメインビジュアルを開く

『トップページ』⇨『メインビジュアル』を選択します。

STEP
メインビジュアルの表示内容を選択する

メインビジュアルの表示内容を選択します。

私は、画像を選択しました。

STEP
表示設定を行う

画像か動画を選択した場合の設定です。

画像や動画の周りに白い枠ができます。

画像や動画を大きく表示させた場合、画像の下に
scrollボタンをつけると移動しやすくなります。

画像・動画の高さ設定です。

 表示させたい大きさに設定します。

画像や動画にフィルターをかけて加工できます。

 ⇨オーバーレイカラーの色と透明度の選択をします。
  

私は、田舎っぽい景色の写真をパノラマで撮ったので、『画像・動画サイズのまま』を選択しました。
『ウィンドウサイズにフィットさせる』だと画像がアップされてしまいました。

フィルター処理で『ブラシ』を選択し、斜線が入ったような状態にしました。

STEP
画像を設定する

挿入したい画像を選択します。

『画像を選択』をクリックして、挿入したい画像を選択します。

画像5枚まで設定することができ、スライドできます。

今回は、ここまでの設定とします。

メインビジュアルの設定後

今回の設定でトップページの上部が変わりました。

カエルくん

写真が入ると、ブログの雰囲気がぐっと変わるね。

れい

本当だよね。
このあとは、トップページをカスタマイズしていこう!

この記事が気に入ったら
いいねしてね!

よかったらシェアしてね!

この記事を書いた人

鹿児島に住んでるシングルマザーです。
40代で会社を辞めてWEBライターに転職を決意しました。
WEBライターになるための活動などを発信していきます。

目次
閉じる