AFFINGER

AFFINGER5 から AFFINGER6 へのアップデート手順を詳しく解説します(プラグインへの影響も記載しています)


アップデートロゴ

WING(AFFINGER5)既存ユーザが、ACTION(AFFINGER6) にアップデートする手順と注意点を紹介させていただきます。

※ WING(AFFINGER5)ユーザは ACTION(AFFINGER6)に無料でアップデートできます(2021年7月の情報です)。

ACTION(AFFINGER6)をダウンロードする

WING(AFFINGER5)利用ユーザは、2021年7月現在、購入ユーザ限定ページより ACTION(AFFINGER6)を無料でダウンロードして利用することができます。

■ Step.1 購入ユーザ限定ページにアクセスする

購入ユーザ限定ページにアクセスします。

ポイント

購入ユーザ限定ページ:https://on-store.net/user_page/

■ Step.2 ACTION(AFFINGER6)をダウンロードする

ダウンロード画面

ログインしたページから、次のファイルをダウンロードします。

  • ACTION(AFFINGER6 版)
  • 子テーマ - ACTION(AFFINGER6 版)

ポイント

WING 互換バージョンを利用してアップロードした場合、カスタマイズ設定の移行など、いくつかの手順が不要になります。

しかし、アップデート方法、構成が ACTION 通常版とは異なる形になりますので、(多少手間はかかりますが)通常版でのアップデートをおすすめします。

本記事では、通常版でのアップデートの手順を紹介します。

関連プラグインをダウンロードする

Gutenberg Plugin 2 ダウンロード画面

関連するプラグインファイルを一緒にダウンロードしておきます。

2022年3月現在、無料でダウンロードできるプラグインは以下の3点です。

  • Gutenberg Plugin 2
  • すごいもくじ LITE

カスタマイズ情報の確認とバックアップ

■ カスタマイズ情報の確認

カスタマイズ箇所の画面

WordPress の管理画面から 「外観」 → 「テーマエディタ―」 を選択します。

各ファイルに対して、いままでに実施したコードの追加を記録(メモ帳などにコピー、バックアップ)しておきます。

主な(よくある)コードの追加をしているファイルは以下です。

  • functions.php
  • header.php
  • 404.php
  • style.css

※ 他のファイルもカスタマイズしている方は、合わせてコピー(バックアップ)してください。

ポイント

FTP を利用できる方は、各ファイルをダウンロードして保存しておいても良いです。

■ WordPress のバックアップを取る

万が一のことを考えて、バックアップを取っておくことをおすすめします。

WordPress のバックアップ取得方法は次の記事を参考にしてください。

【WordPress】ブログデータのバックアップを簡単に取る方法

万が一の対策に。WordPress のバックアップを簡単に取る方法について、プラグインを利用する方法と、利用しない方法を紹介します。

続きを見る

ACTION(AFFINGER6)のインストールと設定

■ Step.1 テーマ(ACTION)をインストールする

テーマの画面
  1. WordPress の管理画面から 「外観」 → 「テーマ」 を選択します
  2. 「新規作成」 ボタンから、ACTION(AFFINGER6)の親テーマ(zip ファイル)をインストールします
  3. 「新規作成」 ボタンから、ACTION(AFFINGER6)の子テーマ(zip ファイル)をインストールします
  4. ACTION(AFFINGER6)の親テーマと子テーマを表示します

この時点では、まだ 「有効化」 は行わないでください。

■ Step.2 外観(カスタマイズ)を手動で設定する

テーマのカスタマイズボタンの画面
  1. テーマ WING(AFFINGER5)Child から 「カスタマイズ」 をクリックして、「外観」 → 「カスタマイズ」 の画面を表示します。
  2. ブラウザをもう一つ起動して、テーマ ACTION(AFFINGER6)Child から 「ライブビュー」 をクリックして、「外観」 → 「カスタマイズ」 の画面を表示します。
  3. 2個のブラウザを左右に並べます
テーマの設定を左右で比較するイメージ

※ かならず 「子テーマ」 で操作してください。

左右で設定を見比べながら、配色などの設定について、旧(AFFINGER5)の設定と同じ設定を、新(AFFINGER6)にも設定します。

「有効化して公開」ボタン

ひととおり設定が完了したら、「有効化して公開」 をクリックしします。

クリックすることで、ACTION(AFFINGER6)Child(子テーマ)が有効となり、実際にサイトが AFFINGER6 で動き出します。

■ Step.3 ACTION(AFFINGER6)の設定を行う

「Save」ボタン

WirdPress の管理画面から 「AFFINGER 管理」 をクリックします。

表示された画面で 「Save」 ボタンを1回押します。

同画面下(スクロールして下側)に「はじめに行うこと」が書いてありますので、内容を確認して必要に応じて設定を行います。

(今回はアップデートですので、必ずしもすべて実施が必要ではありません、内容によって判断してください)

  1. パーマリンクの設定
  2. デザインパターンの選択
  3. メニューの作成
  4. ヘッダー画像の変更
  5. WordPress 自動更新設定の確認

■ Step.4 ファイルでカスタマイズしている内容の反映

ファイルをカスタマイズしている画面

WordPress の管理画面から 「外観」 → 「テーマエディタ―」 を選択します。

事前に確認しておいたカスタマイズ内容を元に、functions.php や header.php などに(いままで)追加していたコードなどを改めて記述します。

ポイント

Functions.php などは、よくコードを追加するファイルですので、過去に追加している可能性が高いです。

「覚えていない」という方も多いと思いますが、事前に確認した内容を元に、頑張って複製してください。

よくあるファイル系の追加コード(追加カスタマイズ)の例を以下に書きますので、思い出すきっかけにしてください。

カスタマイズ対象ファイル
Google アドセンス不正クリック対策
(AICP プラグイン)
「functions.php」 にコードを記入
404 ページの表示を変更
「404.php」 を編集
スマホのピンチアウト設定
「header.php」 を編集
author ページからトップページへリダイレクト
(セキュリティ対策)
「functions.php」 にコードを記入
Pinterest OGP 設定
「functions.php」 にコードを記入

■ Step.5 ファビコンを設定する

AFFINGER5 では、「AFFINGER5 管理」 → 「会話・ファビコン等」 でファビコンを設定していましたが、AFFINGER6 では設定場所が変更になっています。

ファビコンを利用している場合、再設定が必要です。

ファビコンの設定画面

WordPress の管理画面から 「外観」 → 「カスタマイズ」 → 「サイト基本情報」 を選択します。

ページ下部の 「サイトアイコンを選択」 から、ファビコンの素となる画像を指定します。

ポイント

AFFINGER5 では、ico 形式のファイルを指定していましたが、AFFINGER6 では、512×512ピクセル以上の画像にしてください。

付属プラグインをインストールする

プラグインを新規追加する画面

WordPress の管理画面から 「プラグイン」 を選択します。

「新規追加」 ボタンから付属のプラグインを(必要に応じて)インストールします。

プラグインインストールと設定
Gutenberg Plugin 2既に 古いバージョンのプラグインがインストールされている場合は、「置き換えるかどうか?」の画面が出ますので、置き換えることで、今まで通り利用できます。
すごいもくじ LITE「すごいもくじLITE」を利用する場合はインストールします。
インストール後に WordPress の管理画面から 「目次」 メニューを選択することで、すごいもくじの設定を行うことができます。
STINGER タグ管理プラグイン4既に 古いバージョンのプラグインがインストールされている場合は、「置き換えるかどうか?」の画面が出ますので、置き換えることで、今まで通り利用できます。(タグの設定も引き継ぎます)

一般的なプラグインへの影響について

すでにインストール済みのプラグインへの影響です。

(利用しているケースが多い、主なプラグインについて記述します)

プラグイン影響有無事象対応方法
Ad Invalid Click ProtectorありGoogle Adsense の項目が表示されません。「functions.php」 への追加コードがすべてなくなりますので、手動で改めて追記します。
Category Order and Taxonomy Terms Order無し影響ありません。そのまま使えます。
Contact Form 7無し影響ありません。そのまま使えます。
EWWW Image Optimizer無し影響ありません。そのまま使えます。
Google XML Sitemaps無し影響ありません。そのまま使えます。
Gutenberg 用ブロックプラグインあり(不明)AFFINGER6 に付属している 「Gutenberg 用ブロックプラグイン2」をインストールし、アップデートします。
Site Kit by Google無し影響ありません。そのまま使えます。※ Google のコードを header.php などに直接記載している方は、改めて記載します。
SiteGuard WP Plugin無し影響ありません。そのまま使えます。
STINGERタグ管理プラグイン3あり(不明)別途購入の 「STINGERタグ管理プラグイン4」 をインストールし、アップデートします。
ウィジェットのロジックなし影響ありません。そのまま使えます。
クレジット削除あり(不明)AFFINGER6 では 「クレジット削除」 プラグインは不要のため、「無効化] もしくは 「アンインストール」 します。

アップデート完了です

アップデート完了です。

すでにサイトは ACTION(AFFINGER6)で公開されていますので、表示や動作を確認してください。

Enjoy!AFFINGER6 を利用して、ますます心ワクワクするサイトを作ってくださいね。

WordPress のテーマ「AFFINGER」の情報、テクニック一覧はこちらをクリック!










ブログランキング・にほんブログ村へ  




Presented By Irojiro Haraguro .Com