AFFINGER6

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


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 ダウンロード画面

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

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


  • Gutenberg Plugin 2
  • すごいもくじ LITE
  • STINGERタグ管理プラグイン4

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


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


カスタマイズ箇所の画面

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 に付属している i[Gutenberg 用ブロックプラグイン2]をインストールし、アップデートします。
Site Kit by Google無し影響ありません。そのまま使えます。※ Google のコードを header.php などに直接記載している方は、改めて記載します。
SiteGuard WP Plugin無し影響ありません。そのまま使えます。
[STINGERタグ管理プラグイン3]あり(不明)AFFINGER6 に付属している [STINGERタグ管理プラグイン4] をインストールし、アップデートします。
ウィジェットのロジックなし影響ありません。そのまま使えます。
クレジット削除あり(不明)AFFINGER6 では [クレジット削除] プラグインは不要のため、[無効化] もしくは [アンインストール] します。

アップデート完了です


アップデート完了です。

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



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









Presented By Irojiro Haraguro .Com

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