AFFINGER6

【無料】AFFINGER6デザイン済みデータが自作できるよ!

AFFINGER6デザイン済みデータを自作してみました。

初心者の方でも簡単にできるので、興味があれば挑戦してください。

hiro
hiro
自作したデザイン済データは「MIKU」です。

 

サイト作成時のバージョン↓↓

  • WordPress6.0.1
  • AFFINGER6: 20220810

サンプルをみる

注意点としては、不具合が起きても保証できないということ。

ワードプレスのバージョンによってはエラーになるかもしれません。

hiro
hiro
デザイン変更前にサンプルサイト作ることをおすすめします。

お名前ドットコムでドメイン取得

 

デザイン変更前にやること

デザインサンプル「MIKU」をダウンロード

はじめに、デザインサンプル「MIKU」をダウンロードします。

 

利用規約にチェック(3ヶ所)を入れてダウンロードしてください。

デザイン済みデータ配布ページ

 

プラグインを追加する

プラグイン「Customizer Export/Import」を追加します。

 

「zipファイル」からデータを取り出す

zipファイルを解凍し、「affinger-export.dat」を取り出して保存します。

zipファイルの解凍の仕方

 

affinger-export.dat をインポート

「カスタマイズ>エクスポート/インポート」をクリック。

 

ファイルを選択をクリックし「affinger-export.dat」をインポートします。

hiro
hiro
データがインポートされたら、サイトのデザインが変わりますよ!

 

これで下準備は完了です。

 

デザイン・ウィジェットを修正する

ウィジェットの削除

設定:「外観>ウィジェット

デフォルトで設定されているサイドバーウィジェットを削除します。

 

サイドバーウィジェットの追加

設定:「外観>ウィジェット

サイドバートップに「検索」「11_STINGERプロフィールカード」を追加します。

 

ヘッダーの設定

設定:「AFFINGER管理>ヘッダー

ヘッダーを分割しないにチェックを入れて保存します。

その後、ヘッダーエリアをセンタリングにチェックを入れ再度保存します。

 

サムネイルスライドショーの設定

設定:「AFFINGER管理>ヘッダー下/おすすめ

サムネイルスライドショーで、以下のところを変更します。

  • フロントページにチェック
  • 取得記事数「10」に変更(任意)
  • タイトルカラーを「白」に変更

作業が終わったら、保存してください。

hiro
hiro
サムネ設定はデフォルトです。

 

アイキャッチ画像の有効化

設定:「AFFINGER管理>投稿・固定記事設定

アイキャッチ画像の表示をすべての記事で有効化する、にチェックを入れて保存します。

 

タブ式カテゴリー一覧の設定

設定:「AFFINGER管理>トップページ

タブ式カテゴリー一覧で、以下のところを変更します。

  • カテゴリーA・B・Cに「ID」を入力※
  • タブの背景色を変更(#333333)
  • ボーダーにする(チェックを入れる)

カテゴリーを表示する場合は、事前にカテゴリー作成が必要です。

hiro
hiro
カテゴリーIDは「投稿一覧のカテゴリー」で確認できます

 

メニューの設定

設定:「カスタマイザー>各メニュー設定

以下、メニュー設定でチェックを入れる場所です。

  • 第一階層メニューを太字にする
  • メニューをセンター寄せにする
hiro
hiro
メニューを表示させる場合は、事前にメニュー作成が必要です。

WING公式マニュアル(メニュー設定)

 

フォントの変更

設定:「AFFINGER管理>全体設定

以下、フォント設定で変更する箇所です。

  • 全体:Noto Sans(400)
  • 記事タイトル・見出し:Noto Sans(700)
  • 追加の反映範囲:記事一覧タイトル

上3ヶ所にチェックを入れ保存します。

hiro
hiro
フォントサイズは、お好みで変更してください。

 

おすすめ記事一覧の表示

設定:「AFFINGER管理>ヘッダー下/おすすめ

以下、おすすめ記事一覧で変更する部分です。

  • おすすめ記事一覧に表示する文字:PickUp
  • 任意の人気記事を指定する(記事ID
  • サイドのスクロールに表示するにチェック
hiro
hiro
以上で、サイトデザインの修正完了です。

 

まとめ

ブログ初心者がサイトのデザイン変更するのは大変です。

ただ、AFFINGER6といういテーマを使えば初心者でも簡単に綺麗なサイトに仕上がります。デザイン修正も簡単にできるので、いろいろ挑戦してください。

-AFFINGER6
-