【動画付き】AFFINGER5デザイン済みデータの設定方法

2021年5月2日

AFFINGER5デザイン済みデータの設定方法を紹介します。

作業動画も撮影したので、よければ参考にしてください。

1分ほどの動画です。

やり方さえ覚えれば、作業は5分で終わります。

 

では、順番に解説していきます。

 

プラグインをインストール

デザイン済みデータの反映に使用するプラグインです。

インストールしたら、有効化してください。

 

データ引継ぎプラグインについて

データ引継ぎプラグインは、テーマ管理用プラグインです。

このプラグインを使うと、AFFINGER管理で設定した内容を反映させます。

  • フォントの種類
  • アイキャッチ設定
  • トップページ設定など

ただ、AFFINGER5の機能さえ覚えてしまえば特に必要ありません。

どうしても自分で設定できない方は、ひとつあると便利です。(AFFINGER6にも対応してます)

 

AFFINGER5 デザイン済みデータをダウンロード

まずは、デザイン済みデータ配布ページ(β)へアクセス。

ページ下にスクロールすると「旧WING(AFFINGER5/EX/STINGER PRO2」が表示されるので、+ボタンをクリックします。

 

AFFINGER5/EX用のデザイン済みデータが表示されます。

お好きなものを選んでダウンロードしてください。

 

補足:デザイン済みデータに使用する画像について

AFFINGER5デザイン済みデータに使用されている画像をダウンロードできます。

ダウンロード場所は「デザイン済みデータ配布ページ」です。

 

ダウンロードした画像(抜粋)↓↓

zipファイルに入っているので、中身を取り出して使ってください。

ヘッダーエリア、H2タグ背景などに利用できます。

 

ダウンロードしたファイルを解凍する

ダウンロードした「zipファイル」から、中身を取り出します。

解凍方法はこちら

 

zipファイルの中身

  • テーマ管理用
  • カスタマイザー用
  • ウィジェット用

さらに、上記ファイルの中身を取り出して保存します。

 

各ファイルから取り出したデータ

  • theme.json(テーマ管理用)
  • affinger5-export.dat(カスタマイザー用)
  • wing-wp-com-sample21-widgets.wie(ウィジェット用)

上記は「NOTE.2020」のデザイン済みデータです。

※デザインによりデータ名は異なる

 

次は、各データをワードプレスに反映させます。

 

デザイン済みデータを設定する

※データ引継ぎプラグインは別売りです

テーマ管理用(.json)

設定:「AFFINGER5管理>データの引き継ぎ

データの引き継ぎをクリックし、「○○○○.json」ファイルをインポートします。

 

ファイルを選択をクリックし「○○○○.json」を選択。

その後、インポートをクリックすれば完了です。

 

データの引き継ぎ(LITE)は、過去に配布されていたプラグインです。現在はダウンロードできません。

テーマ管理用プラグインが欲しい方は、データ引継ぎプラグイン(有料)を購入してください。

 

カスタマイザーの設定(.dat)

プラグイン「Customizer Export/Import」を有効化。

設定:「カスタマイズ>エクスポート/インポート

ここで「○○○○.dat」データをインポートします。

 

インポートで、ファイルを選択をクリックし「○○○○.dat」を選択。

画像ファイルを~にチェックを入れ、インポートをクリック。

 

これで、デザイン済みデータのカスタマイザーの設定完了

問題なければ、サイトのデザインが変わります。

 

ウィジェットの設定(.wie)

プラグイン「Widget Importer & Exporter」を有効化。

設定:「ツール>Widget Importer & Exporter

ここで「○○○○.wie」データを反映させます。

 

初めに、ダウンロードした「○○○○.wie」をメモ帳で開きます。

メモ帳を開いたら、中身をコピーしてください。

 

このデータを反映させます。

 

Widget Importer & Exporterで「copy and paste」をクリック。

コピーしたウィジェット用データを貼り付けます。その後、ウィジェットをインポートをクリックして完了です。

 

重複しているウィジェットは、削除してください。

 

ウィジェットの表示がおかしい場合

ウィジェットがブロックで表示される場合は、「Classic Widgets」を使うと元に戻ります。

「プラグイン>新規追加」で、検索してください。

 

デザイン済みデータが反映されない場合の対処法

設定:「カスタマイズ>全体カラー設定

デザインが上手く反映されない場合は、カスタマイザーのリセットを試してください。

他、キーボードの「F5」キーを押すとブラウザが最新になります。

 

AFFINGER5/EX版について

AFFINGER5/EX版は、2021年6月末で販売停止となりました。

現在は、購入ユーザー限定ページでダウンロード可能です。(2022年1月4日情報)

 

AFFINGER5/EXの動作環境は下記の通りです。

  • 必須 WordPress バージョン 5.0
  • 検証済みWordPressバージョン 5.6.0
  • PHPバージョン 7.3推奨(7.2以上必須)
  • 検証済みPHPバージョン 7.3
  • 対象ブラウザ Chrome87 / safari14 / Firefox84

PHPバージョンは、各サーバーで確認できます。

WordPressバージョンを変更したい場合は、下記ページが参考になります。

WordPressサイトをダウングレードする方法(プラグインやテーマの問題の解決用)

 

まとめ

過去に作ったペラサイトは、未だに「AFFINGER5」を使ってます。(特に不具合なし)

確かに「AFFINGER6」もカッコイイんですが、個人的には「AFFINGER5」が好きなんですよね。

 

これからも進化すると思いますが、やはり使い込んだテーマは良いもんです。

どちらにせよ、AFFINGERを使い倒してみてください。サイト作りが楽しくなります。

-AFFINGER6
-