広告

AFFINGER6:トップページのカスタマイズ方法【初心者向け】

AFFINGER6:トップページのカスタマイズ方法【初心者向け】

初心者の方は

トップページの編集方法がわからない・・・

という方も多いのではないでしょうか。

「トップページの編集をAFFINGER管理から行うのは解るけど・・・」

「通常の記事作成みたいにできないの・・・」

そんな悩みを抱えている方向けの記事になります。

難しく考える必要はありません。

マイブロック機能を活用すれば、通常の記事作成と同じ要領で作成した内容をトップページとして表示させることができます。

では、順を追って解説していきます。

  • マイブロック機能でトップページのコンテンツを作成する
  • ショートコードをコピーする
  • AFFINGER管理の「挿入コンテンツ」にショートコードを貼り付ける

① マイブロック機能でトップページのコンテンツを作成する

まずトップページのコンテンツをマイブロック機能で作成します。

「マイブロック」→「新規追加」をクリックします。

AFFINGER6:マイブロック機能

記事作成と同様の要領でトップページのコンテンツを作成します。

タイトルは表示されませんので、「トップページ」とでも入力しておけばOKです。

例えば、下画像では「記事一覧ブロック」や「カテゴリー記事一覧ブロック」を挿入して見出しごとに関連記事を表示させるようなトップページコンテンツを作成してあります。

AFFINGER6:マイブロック機能で作成したトップページ

コンテンツの作成が完了したら「公開」をクリックしてください。

② ショートコードをコピーする

作成したマイブロックのショートコードをコピーします。

AFFINGER6:マイブロック機能のショートコード

③ AFFINGER管理の「挿入コンテンツ」にショートコードを貼り付ける

「AFFINGER管理」→「トップページ」→「挿入コンテンツ」の入力欄にコピーしたショートコードを貼り付けます。

AFFINGER管理にショートコードを貼り付け

貼り付け終わったら「Save」をクリックして保存します。

これで作成したコンテンツをトップページに表示できました。

こんな感じに表示されます。

AFFINGER6:トップページ編集例

〇 コンテンツを変更する方法

トップページのコンテンツを変更したい場合は、マイブロック内のコンテンツを変更すれば自動で変更されます。

見出しのデザインを変更してみました。

AFFINGER6:トップページ編集例

更新すれば、トップページの表示に反映されます。

こんな感じにトップページに内容が反映されます。

AFFINGER6:トップページ編集例

これでトップページに好きなようにコンテンツを表示させることができました。

トップページのカスタマイズは他にもウィジェットを利用する方法やAFFINGER管理で「タブ式カテゴリー」を表示させたり「お知らせ」を表示させたりもできます。

AFFINGER6:トップページにお知らせ(NEWS)を挿入する方法
AFFINGER6:トップページにお知らせ(NEWS)を挿入する方法

下画像のような「お知らせ」(NEWS)をトップページに表示させる方法です。 「お知らせ」(NEWS)を挿入する手順 「お知らせ」(NEWS)の挿入は「AFFINGER6管理」→「トップページ」→「Ne ...

AFFINGER6:トップページにタブ式カテゴリーを表示させる方法
AFFINGER6:トップページにタブ式カテゴリーを表示させる方法

この記事がお勧めな方 AFFINGER6(アフィンガー6)でトップページのカスタマイズをしたい方 AFFINGER6(アフィンガー6)でタブ式カテゴリーの表示方法を知りたい方 下のようなタブ式カテゴリ ...

AFFINGER6(アフィンガー6)は初心者でも簡単にオシャレなブログを作成できるWordPress有料テーマです。

AFFINGER6(アフィンガー6)について詳しく知りたい方はこちらの記事をご覧になってください。

AFFINGER6(アフィンガー6)の価格・特徴・使い方まとめ
AFFINGER6の始め方-初心者向けスタートアップガイド

2024/4/11  

AFFINGER6を使ってみたい!気になる!という方向けに AFFINGER6ってどんなテーマ? AFFINGER6でどんなことができるの? AFFINGER6を使うにはどうすればいいの? といった内 ...

使ってみたい方は購入からインストールの方法まで詳しく解説した別記事をご覧になってください。

AFFINGER6(アフィンガー6)のインストール方法【画像付き!詳細解説】
AFFINGER6(アフィンガー6)のインストール方法【画像付き!詳細解説】

「AFFINGER6(アフィンガー6)」を利用できるようにするまでの流れ 「AFFINGER6(アフィンガー6)」の利用までの流れは次のようになっています。 AFFINGER6(アフィンガー6)の購入 ...

ブログの記事を書くのにAIライティングツールを利用すると効率を上げることが可能です。

無料お試し利用がずっとできるAIライティングツールをいくつか紹介していますので、試しに利用してみてください。

無料お試しがずっと可能なAI記事作成ツール
無料お試しがずっと可能なAIライティングツール

2024/3/26    ,

「記事作成にAIを活用してみたいなぁ」 「でも料金はかけたくないなぁ」 そんな方に無料お試しがずっと可能なAIライティングツールをいくつか紹介します。 もちろん無料お試しなので、機能をフルに使用するこ ...