【THE THORピックアップ3記事のカスタマイズ】初心者向けに画像付きで解説

今回は、THE THOR（ザ・トール）ピックアップ3記事のカスタマイズ方法についてお伝えします。

ピックアップ3記事以外のTHE THORのカスタマイズ方法は、こちらにまとめてありますので参考になさってください。

関連記事

【THE THORトップページのカスタマイズガイド】画像見ながら探せる

初心者さん・THE THORのTOPページをカスタマイズをしたいけど、ここの名前ってなに？・THE THORのTOPページは、なにからカスタマイズすればいい？ Chi[…]

THE THORピックアップ3記事カスタマイズの手順

当ブログでは、THE THORを購入したけれど「使い方がわからない…」という方のためにカスタマイズサポート・カスタマイズ代行をお受けしています。

これからブログをはじめる方のお悩み相談や、WordPressの相談・設定代行もお気軽にお問い合わせください。

お問い合わせはこちら

THE THORピックアップ3記事のカスタマイズサンプル

表示

非表示

16:9

4:3

1:1

なし
ブラック
ブラックメッシュ

カラー
カラー+画像グレー

カテゴリ名がイメージカラー

カテゴリ名がテーマカラー

【カスタマイズ１】ピックアップ3記事の表示・非表示

THE THORピックアップ3記事は、表示・非表示を選択することができます。

表示

非表示

1. WordPressのダッシュボード
2. 外観
3. カスタマイズ

Topページ設定＞ピックアップ3記事設定＞ピックアップ3記事設定＞ピックアップ3記事を表示するか選択

選択して をクリック

【カスタマイズ２】ピックアップ3記事の見出し

THE THORピックアップ3記事は、見出し・見出し左に表示するアイコン・見出し左に表示する補足説明をカスタマイズすることができます。

THE THORピックアップ3記事は、見出しを入力しないと表示ができない仕組みになっているので、ご注意ください！見出し左に表示するアイコン・見出し右に表示する補足情報は、空欄でもピックアップ3記事は表示されます。

1. WordPressのダッシュボード
2. 外観
3. カスタマイズ

Topページ設定＞ピックアップ3記事設定＞ピックアップ3記事設定＞セクションの見出しを入力

セクションの見出しを入力して をクリック

アイコンを表示：表示させたいアイコン名を入力

補足情報を表示：補足情報を入力

アイコン名がわからないときは、左上の「アイコンオプション」のボタンをクリック

アイコン一覧が表示されるので、アイコンのコードをコピーしてください

【カスタマイズ３】ピックアップ3記事画像の大きさ

THE THORピックアップ3記事に表示する画像の大きさは、16:9・4:3・1:1の3種類から選択できます。

16:9

4:3

1:1

1. WordPressのダッシュボード
2. 外観
3. カスタマイズ

Topページ設定＞ピックアップ3記事設定＞ピックアップ3記事設定＞画像アスペクト比を選択

画像の大きさを選択して、 をクリック

【カスタマイズ４】ピックアップ3記事見出し画像のマスク

THE THORピックアップ3記事の見出しの画像マスクは、下記の5種類から選択することができます。

（画像マスクとは、画像に透明度のある色や画像でカバーをかけること）

ブラック

ブラックメッシュ

カラー

カラー+画像グレー

なし

1. WordPressのダッシュボード
2. 外観
3. カスタマイズ

Topページ設定＞ピックアップ3記事設定＞ピックアップ3記事設定＞カラー系マスク利用時の色を指定

画像のマスクを選択して、 をクリック

カラー系のマスクは、色の指定ができるので「色を選択」をクリックして色の指定をします。

色の指定は「色を選択」をクリックしてカラーパネルが表示されたら、白い丸や白い四角をクリックしながら動かして色を選択、または、カラーコードを直接入力します。

【カスタマイズ５】THE THORピックアップ3記事の記事指定

THE THORピックアップ3記事に表示させたい記事を指定して表示させることができます。表示指定は、投稿名・カテゴリ名ではなく、IDを使って指定するので番号を調べてIDを入力します。

投稿記事のIDは、ダッシュボード＞投稿＞投稿一覧から調べることができます。

固定ページのIDは、ダッシュボード＞固定ページ＞固定ページ一覧から調べることができます。

1. WordPressのダッシュボード
2. 外観
3. カスタマイズ

Topページ設定＞ピックアップ3記事設定＞ピックアップ3記事設定＞1番目の記事IDを入力＞2番目の記事IDを入力＞3番目の記事IDを入力

ピックアップ3記事に表示させたい投稿ページ・固定ページのIDを入力して、 をクリック

空欄の部分は、自動的に他の記事が表示されるようになります。

【カスタマイズ６】カテゴリーのイメージカラー

カテゴリ名がイメージカラー

カテゴリ名がテーマカラー

THE THORのカテゴリーはイメージカラーをカスタマイズすることができます。イメージカラーをカスタマイズすると、アイキャッチの右上にイメージカラーを背景にしてカテゴリーが表示されるようになります。

他には、カテゴリーごとのアーカイブページのタイトル、TOPページのピックアップ３記事、TOPページのカテゴリごとの最新記事にイメージカラーが反映されるようになっています。

1. ダッシュボード
2. 投稿
3. カテゴリー

1. 色の指定は「色を選択」をクリックしてカラーパネルが表示されたら、白い丸や白い四角をクリックしながら動かして色を選択、または、カラーコードを直接入力
2.  をクリック

カテゴリーの作成方法もお伝えしますね。

1. ダッシュボード
2. 投稿
3. カテゴリー

1. カテゴリーの名前を入力
2. カテゴリーのURLをアルファベットで入力
3.  をクリック

1. ダッシュボード
2. 投稿
3. 新規追加

クラッシックエディタ

1. カテゴリー名を入力
2. 新規カテゴリーを追加をクリック
3. をクリックしてカテゴリの追加が完了

ブロッククエディタ

1. カテゴリー名を入力
2. 新規カテゴリーを追加をクリック
3. をクリックしてカテゴリの追加が完了

THE THORピックアップ3記事のカスタマイズは完了です。

おつかれさまでした。

以上が、【THE THORピックアップ3記事のカスタマイズ】初心者向けに画像付きで解説でした。

わからないことや、ご相談は、お気軽にお声がけくださいね。

お問い合わせはこちら

お読みいただき、ありがとうございました。

Chiharu