この記事では、ワードプレスのテーマ「AFFINGER5（アフィンガー５）」に、デザイン済みデータを反映させるための手順を詳しく解説しています。
デザイン済みデータとは、完成された素敵なデザインを初心者でも簡単に反映できる「アフィンガー専用のデータ」のこと。
デザイン済みデータの設定は慣れれば簡単なんですけど、はじめてだとつまづくこともあると思います。
そこで今回は、はじめてでもわかるように、デザイン済みデータを反映させるための手順を詳しく解説していきます。
AFFINGER5 のデザイン済みデータは全部で10種類
通常のアフィンガー５用
アフィンガー５EX用
今回は、超シンプルなサイトがつくりたかったので、「NOTE.2020」のデザインを反映させたいと思います。
デザイン済みデータの準備
デザイン済みデータをダウンロードする
１．まずは、下記URLからデザイン配布ページへ行きます。
⇒https://on-store.net/design-sample-affinger5/
現在このページには、アフィンガー６のデザイン済みデータがメインで表示されます。
アフィンガー５のデザイン済みデータを表示させる方法を解説します。
２．「デザイン済みデータ配布ページ」を開き、ページ下までスクロールすると、子テーマ「JET2」の紹介があります。
その下に、「旧WING（AFFINGER5/EX/STINGER PRO2）用データを表示する」という、ブロックでいうところの「スライドブロック」があるので、「＋」をクリックします。
３．すると、「旧WING（AFFINGER5/EX/STINGER PRO2）用データ」が表示されます。
４．使いたいデザインの「※承諾事項を了承の上、ダウンロードする」をクリックし、任意の場所に保存します。
５．ファイルは圧縮されているので、フォルダ内で解凍します。
※ZIPファイルの解凍方法についてはここでは書きません。わからない方は「ZIPファイル 解凍方法」でググってください。
インポート用プラグインのインストール
デザイン済みデータをインポートするために必要なプラグインは以下の３つです。
- 「カスタマイザー」：Customizer Export/Import（無料）
- 「ウィジェット」：Widget Importer & Exporter（無料）
- 「テーマ管理」：データ引継ぎプラグイン（有料）
「Customizer Export/Import」と 2Widget Importer & Exporter」は、事前にダウンロードする必要はありません（※WordPress内から簡単にインストールできます）。「データ引継ぎプラグイン」は、アフィンガー専用の有料プラグインです（購入、ダウンロードが必要です）。
プラグインのインストール手順
１．左メニューの、①「プラグイン」⇒ ②「新規追加」をクリック
２．右上のある検索窓に、プラグイン名を入力する。
３．①「Customizer Export/Import」と入力すると、プラグインが表示されるので、②「今すぐインストール」をクリック。
４．インストールが完了したら「有効化」をクリックし、プラグインを有効化する。
５．「Widget Importer & Exporter」も同じ手順で、「インストール」～「有効化」まで完了させます。
データ引継ぎプラグイン
データ引継ぎプラグインのみ有料（2,980 円）です。
データ引継ぎプラグインは「STINGER STORE」から購入できます。
インストールの手順
左メニューの「プラグイン」⇒「新規追加」をクリック。
「プラグインのアップロード」をクリック。
①「ファイルを選択」をクリックし、データ引継ぎプラグインのZIPファイル（st-migrator.zip）を選択。
②「今すぐインストール」をクリックする。
「プラグインを有効化」をすればインストール完了です。
デザイン済みデータのインポート手順
カスタマイザー用データをインポートする
外観をカスタマイズする設定のデータをインポートします。
基本エリア設定、メニューのカラー設定、各テキストとhタグ（見出し）、オプションカラー……など
１．左メニューの、「①：外観」⇒ 「②：カスタマイズ」をクリック。
２．左メニューの一番下にある「エクスポート / インポート」を開く。
３．「インポート」の下にある「ファイルを選択」をクリックし、デザイン済みデータを保存した場所を開く。
４．「カスタマイザー用」フォルダ内にある、①「.dat」ファイルを選択し、②「開く」をクリック。
５．「画像ファイルをダウンロードしてインポートしますか？」 にチェックを入れ、「インポート」をクリックすれば完了です。
※インポートに「失敗」したとき
デザイン済みデータを複数ダウンロードしていた場合、違うデザインのデータを間違ってインストールしてしまうことがあります。
そんなときは、以下の手順で引き継いだカスタマイザーのデータをリセットしましょう。
左メニューの「全体カラー設定」を開く。
一番下にある「リセット」をクリックすると、インポートに失敗したデザインデータがクリアされます。
ウィジェット用データをインポートする
ウィジェットの設定データをインポートします。
検索、管理者紹介、サイドバーメニュー、カテゴリー……など
１．左メニューの「ツール」⇒「Widget Importer & Exporter」をクリック。
２．ファイル（「ウィジェット用」のwieファイル）を選択し、「ウィジェットをインポート」をクリックする。
３．インポート結果が表示されればインポート完了です。
テーマ管理の設定をインポート
１．左メニューの「AFFINGER 管理」⇒「データの引継ぎ」をクリック。
※データ引継ぎプラグインをインストール ⇒ 有効化すると、「AFFINGER 管理」に「データの引継ぎ」が追加されています。
２．①「ファイルを選択」をクリックし、保存しているテーマ管理用データファイル（theme.json）を選択。
②「インポート」をクリックすれば完了です。
まとめ
僕はいつも、デザイン済みデータをベースにデザインを変更して、自分好みにしています。
そのほうがキレイにカスタマイズできるし、ムダな時間を短縮できるからです。
一からカスタマイズするのは楽しいんですけど、変に拘りだすとめちゃくちゃ時間がかかります。で、わけがわからなくなってくるんですよね……(^^;
僕の目的は、ワードプレスのテーマを弄りまくってデザインを追求することではないので、はじめからキレイなデザインを簡単に設定できるのは非常にありがたいです♪
AFFINGER5 のデザイン済みデータを利用する際は参考にしてください(*^^*)
当サイト限定デザイン済みデータをチェック
