AFFINGER6:デザインカードプラグインでサイトデザインを変更する方法

AFFINGER6:デザインカードプラグインでサイトデザインを変更する方法

2023年12月にデザインカードプラグインを利用して簡単にサイトデザインを変更することができるようになりました。

デザインカードの種類は公式サイトから確認できます。

→ AFFINGER6公式サイト(デザインカードサンプルページ)

パパくま
パパくま

AFFINGER6でデザイン変更するには既に「デザイン済みデータ(テンプレート)」を利用する方法がありました。

「デザイン済みデータ」を利用するには少し手間がかかります。

それに比べてデザインカードプラグインを利用すると簡単にデザイン変更を行うことができます。

「デザイン済みデータ」の設定方法に関しては別記事で詳しく解説していますので、そちらを参考にしてみてください。

この記事では実際にデザインカードプラグインを利用してみて、設定する方法を初心者向けに詳しく解説しています。

デザインカードプラグインを利用に関しては公式サイトの注意事項を確認の上ご利用ください。

デザインカードプラグインを利用に伴う如何なる不具合に対して当サイトは一切責任を負うことはできませんので、予めご了承ください。

まず、デザインカードプラグインを利用するには以下のバージョン以上の環境が必要になります。

必要に応じてアップデートをしてください。

  • WordPress6.4.1 / PHP 7.4
  • AFFINGER ver20231203
  • Gutenbergプラグイン ver2.7.2

 サイトのバックアップを取る

ここで言うバックアップとは次の3つの設定のバックアップを取るということです。

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

AFFINGER6ではこの3つの設定項目によってサイトデザインを構成しています。

デザインカードプラグインを利用するとその設定が上書きされるので、バックアップを取っておかないと元に戻せないわけです。

デザインカードプラグインをサイト作成の初期段階で利用するのなら問題ないですが、ある程度カスタマイズしていた方はバックアップは取っておいた方がいいです。

バックアップを取る方法を詳しく説明しますが、初期段階でバックアップを取る必要のない方は飛ばして読んで頂いて問題ありません。

カスタマイザーのバックアップ

下画像の「カスタマイズ」のデータをバックアップする為に「Customizer Export/Import」というプラグインをインストールします。

「外観」→「カスタマイズ」
① 「Customizer Export/Import」をインストールする

「プラグイン」→「新規追加」から検索欄に「Customizer Export/Import」と入力して検索します。

「Customizer Export/Import」が表示されたら「今すぐインストール」をクリックし、続いて「有効化」をしておきます。

「Customizer Export/Import」のインストール方法
② カスタマイザーのバックアップをする

「Customizer Export/Import」を有効化するとカスタマイズ画面に「エクスポート/インポート」の項目が追加されます。

カスタマイズ画面の「エクスポート/インポート」項目

「エクスポート/インポート」項目の「書き出し」をクリックするとカスタマイザーの設定を保存(バックアップ)することができます。

カスタマイザーの書き出し

ウィジェットのバックアップ

下画像の「ウィジェット」のデータをバックアップする為に「Widget Importer & Exporter」というプラグインをインストールします。

「外観」→「ウィジェット」
① 「Widget Importer & Exporter」をインストールする

「プラグイン」→「新規追加」から検索欄に「Widget Importer & Exporter」と入力して検索します。

「Widget Importer & Exporter」が表示されたら「今すぐインストール」をクリックし、続いて「有効化」をしておきます。

「Widget Importer & Exporter」のインストール方法
② ウィジェットの設定をバックアップする

「Widget Importer & Exporter」を有効後、ウィジェット画面に「インポート/エクスポート」が表示されます。

ウィジェットの「インポート/エクスポート」

「ウィジェットのエクスポート」をクリックするとウィジェットの設定を保存(バックアップ)することができます。

ウィジェットの「インポート/エクスポート」

AFFINGER管理のバックアップ

下画像の「AFFINGER管理」のデータをバックアップする為に「データ引継ぎプラグイン」をインストールします。

AFFINGER管理
① 「データ引継ぎプラグイン」のインストール方法

「データ引継ぎプラグイン」は困ったことに無料のプラグインではなく「有料」のプラグインになります。

AFFINGERの公式サイトにて購入することができます。

データ引継ぎプラグイン価格:2,980円(税込み)

AFFINGER6EX(アップグレード版)を購入すると特典として「データ引継ぎプラグイン」が付いてきますので、AFFINGER6EX(アップグレード版)なら使用できるテンプレートも増えますし、この機会にAFFINGER6EX(アップグレード版)を購入するのもお勧めです。

AFFINGER6EX(アップグレード版)価格:12,000円(税込み)

「データ引継ぎプラグイン」「AFFINGER6EX(アップグレード版)」も公式サイトから購入可能です。

AFFINGER 公式サイト

購入についての詳細は公式ページから確認をお願いします。

「データ引継ぎプラグイン」購入後にWordPressにインストールする手順は、「プラグイン」→「新規追加」→「プラグインのアップロード」で購入した「データ引継ぎプラグイン」の圧縮フォルダを選択すればOKです。

購入した「データ引継ぎプラグイン」の圧縮フォルダは解凍しないようにしてください。

「プラグイン」→「新規追加」→「プラグインのアップロード」

「データ引継ぎプラグイン」のインストールが完了したら「有効化」しておきます。

「データ引継ぎプラグイン」を利用しなくてもAFFINGER管理の設定項目を手動で設定することは可能ですが、初心者の方には少しハードルが高いかもしれません。

初心者の方は「データ引継ぎプラグイン」を購入するか、バックアップを必要としないサイト作成の初期段階でデザインカードプラグインの利用をお勧めします。

② AFFINGER管理の設定をバックアップする

「データ引継ぎプラグイン」を有効化するとAFFINGER管理メニューに「データの引き継ぎ」項目が追加されます。

「データの引き継ぎ」画面の「エクスポート」をクリックするとAFFINGER管理の設定を保存(バックアップ)することができます。

AFFINGER管理のエクスポート
  • デザインカードプラグインをダウロードする
  • デザインカードプラグインを有効化する
  • ボタンひとつでデザイン変更

① デザインカードプラグインをダウロードする

公式ページからデザインカードプラグインのダウンロードページを開きます。

※ ダウロードページはAFFINGER6購入した方のみが閲覧可能です。

ダウロードページからセットしたいデザインカードをダウンロードします。

AFFINGER6:デザインカードプラグインのダウンロードページ画面

② デザインカードプラグインを有効化する

デザインカードプラグインをダウンロードすると圧縮フォルダが保存されます。

こんな感じの圧縮フォルダです。

ダウンロードしたデザインカードプラグインのフォルダ

圧縮フォルダは解凍しないようにしてください。

プラグインのアップロード画面からデザインカードプラグインの圧縮フォルダをインストールします。

デザインカードプラグインのインストール

インストールが完了したら「プラグインを有効化」をクリックして有効化します。

デザインカードプラグインの有効化

③ ボタンひとつでデザイン変更

デザインカードを有効化するとメニューに「AFFINGERデザインカード」の項目が追加されます。

「AFFINGERデザインカード」の「デザインをセットする」をクリックすればデザイン変更は完了です。

デザインカードの設定画面

以上がデザインカードでサイトデザインを変更する方法になります。

デザインをセット後に設定を元に戻すことができませんので、必要に応じてバックアップを取るようにしてください。

その他、デザインカードプラグインに関しては公式サイトの注意事項をよく確認して利用するようにしてください。

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

ハムタ
ハムタ
パパくま
パパくま

現在は多くのAIライティングツールがあります。

そのほとんどが無料お試しでの利用が可能です。

お試し期間が限定のツールもありますが、中には機能制限はありますがずっと無料で利用できるツールもあります。

無料お試しがずっと可能なAIライティングツールをまとめてみたので、是非試してみてください。

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

2024/7/26    ,

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

AFFINGER6の購入とインストール方法

AFFINGER6の設定関係

AFFINGER6の使い方

AFFINGER6のデザインカスタマイズ