【WordPress】SWELLのトップページの見た目、最低限の設定5STEP【とりあえずブログを公開したい人へ!】

WordPress

この記事ではWordPressのテーマ「SWELL」でブログを立ち上げたばかりの方に向けて、サイトをとりあえず公開できる見た目にする方法をご紹介します。

ブログを立ち上げたばかりだと、サイトの操作に慣れておらず装飾に時間がかかってしまいますよね。

「早く記事を書いて公開したい!見た目にこだわるのはあと!」という方に向けて、最低限行うべきトップページの見た目に関する設定を5STEPでご紹介します。

トップページの設定

初期画面と変更箇所の確認

初期画面は以下のようになっています。
メイン画像は元々設定されている画像がランダムで移り変わります。

今回は①~⑤の5か所の設定を行います。

①キャッチフレーズの設定
②固定ページ表示の削除
③メインビジュアルの設定
④記事スライダーの削除
⑤「最近のコメント」の削除

①キャッチフレーズの設定

サイト左上に表示されるキャッチフレーズを入力します。

ダッシュボード上部のカスタマイズをクリックし、カスタマイズ画面に入ります。
※今回はほとんどこのカスタマイズ画面から設定していきます。

左端のメニューから「WordPress設定」→「サイト基本情報」の順にクリックし、「キャッチフレーズ」を入力します。
※「サイトのタイトル」はサイト立ち上げ時の設定になっているので、変更したい場合は同時に変更してください。

あぼかど
あぼかど

今回はキャッチフレーズにブログのサブタイトルを入れました!
サイトのコンセプトなどほかのメッセージでもOK!

上にある青の「公開」ボタンをクリックして保存してください。

細い色付き帯の部分にキャッチフレーズが表示されました!

②固定ページ表示の削除

サイトの右上にある「Sample Page」のリンクを非表示にします。
初期設定では固定ページのサンプル「Sample Page」のリンクがトップページ左上に表示されているため一旦削除します。

カスタマイズ画面にいる場合は左上の×をクリックしダッシュボードに戻ります。

左の黒いメニューから「固定ページ」をクリックします。

「Sample Page」の「クイック編集」をクリックしてください。

ステータスを下書きに変更し、左下の「更新」ボタンをクリックして保存します。

サイト右上の「Sample Page」リンクが削除できました!

③-1 メインビジュアルの設定

メイン画像とその上に表示されるテキストを変更します。

メイン画像の設定

画像を準備する

まずはメイン画像に使用する画像を準備しておきましょう。
今回は「とりあえず」がテーマなので、サイトのイメージに合った写真をフリー素材のサイトから探すのがおすすめです。
(規約を確認してからダウンロードしましょう!)

私はODANというサイトから画像を選びました。

あぼかど
あぼかど

登録不要で高品質な写真素材が無料でダウンロードできます!

あまり小さい画像をえらぶと引き延ばされてぼけてしまうので注意してください!
SWELL公式サイトではPC仕様で「横1600px × 縦900px」の画像が設定されていますのでサイズの参考にしてください。(PC画面いっぱいに画像が広がるサイズです)

画像を設定する

ダッシュボード上部のカスタマイズをクリックし、カスタマイズ画面に入ります。

「トップページ」→「メインビジュアル」の順にクリックします。
「■各スライドの設定」から「スライド[1]」の「画像を選択」をクリックします。

「ファイルをアップロード」タブを選び、「ファイルを選択」をクリックして画像を選びます。

アップロードした画像を選び、左下の「画像を選択」をクリックします。

「公開」ボタンをクリックし保存します。

メイン画像が設定できました!

③-2 テキストの設定

先ほど設定したスライド画像設定のすぐ下からテキストも設定できます。
(「トップページ」→「メインビジュアル」)

「■各スライドの設定」より「メインテキスト[1]」、「サブテキスト[1]」を入力します。

あぼかど
あぼかど

メインテキスト:サイトタイトル、サブテキスト:サイトのサブタイトルを入れました!
メインテキストだけでもOK!

メイン画像の色とテキストの色がかぶってしまい少し見にくかったため、テキストのカラーも変更しています。(必要な人だけでOK)

下にスクロールし「テキストカラー[1]」から好きな色を選びます。

メインビジュアルの設定ができました!

④記事スライダーの削除

初期設定だと記事のスライダー表示が設定されています。
記事が少ないうちは同じ記事が繰り返し流れてしまうので、記事スライダーを削除します。

「トップページ」→「記事スライダー」を順にクリックします。
「記事スライダーを設置するかどうか」の項目で「設置しない」にチェックを入れて「公開」をクリックします。

記事スライダーが削除されました!

⑤「最近のコメント」の削除

初期設定では最近のコメントがサイドに表示される設定になっています。
最初のうちはコメントがつかない期間があるため非表示にしておきます。

「ウィジェット」→「共通サイドバー」を順にクリックします。

ブロックが3つあるうち、上から3つ目が「最近のコメント」のブロックになっています。
3つ目のブロックをクリックし、「削除」をクリックします。

「公開」ボタンを押し保存します。

「最近のコメント」が削除できました!

完成!

お疲れさまでした!
完成後の見た目は以下のようになります。

最後に

今回はSWELLのトップページ「とりあえず」の設定5STEPを紹介しました。

なるべく早く公開できるように、また後から設定にこだわれるように今回は最低限の設定のみに絞っています。

SWELLでは色々なカスタマイズができるので、サイト運営に慣れてきたら細かい設定にも挑戦してみてくださいね!

コメント

タイトルとURLをコピーしました