アフィンガー6(AFFINGER6)

アフィンガー6(AFFINGER6)の新規インストール方法:初心者のための用語解説付き!

アフィンガー6(AFFINGER6)のインストール方法:初心者でもできるように詳しく解説!

ここではWordPressにAFFINGER6(アフィンガー6)をインストールする方法を一から丁寧に紹介します。初心者の人向けに用語の解説も付けたので参考にしてください。


前回はAFFINGER6を購入してダウンロードするところまで行いました。ここではそのダウンロードしたAFFINGER6をWordPressにインストールしていきます。

よくある失敗に同時にインストールする必要のあるプラグインを入れ忘れるというケースがあります。AFFINGERをインストールするときは忘れずにプラグインまでインストールしてくださいね。そこのところもちゃんと解説しています。

何をするかいまいちわからない人へ

ゲーム機を思い浮かべてください。ゲーム機本体だけではゲームは遊べませんよね。遊ぶためには何かのソフトを入れる必要があります。

これと同じようにWordPress本体だけではWordPressは動きません。「テーマ」と呼ばれるソフトを入れる必要があるんです。AFFINGERはここでいうソフトに当たります。これからこのAFFINGERをWordPressにインストールしてWordPressを使えるようにします。

ワードプレスのテーマをインストールするときに必要な言葉の解説:zip、解凍、親テーマ子テーマとは?

まずは初心者の人のためにあとでつまずくであろう専門用語を説明しておきます。自信がない人はぜひ目を通しておいてください。あとで作業がスムーズに進みますよ。

zipとは?

zipはパソコンで使うファイルの種類の名前です。あまり使う機会がないファイルだと思います。

zipはファイルが梱包された状態です。ファイルがダンボールに入っている光景をイメージしてください。

zipとはファイルが梱包された状態のこと
zipはデジタルなダンボール

解凍とは?

解凍とはzipの中に入っているファイルを取り出す作業のことです。

解凍とはzipから中のファイルを取り出すこと
解凍のイメージ

親テーマ、子テーマとは?

テーマは親テーマと子テーマ 二つで一つと覚えてください。インストールするときはこの2つをアップロードしなければなりません。つまりアップロードの作業を2回やる必要があります。

親テーマの中にはテーマの機能が一通り入っています。また、子テーマはあとからカスタマイズしたい情報を書き足していくためほぼ空のファイルです。この2つが組み合わさって初めて1つのテーマとして完成します。

最初はいまいちピンとこないかもしれませんがWordPressを使っていくうちにわかってくるはずです。とりあえず覚えておいてほしいのは「テーマは親テーマと子テーマ 2つで一つ!」、「カスタマイズするときは子テーマに書き足す」です。

親テーマは機能一式が入ったもの。子テーマとはカスタマイズ用のもの。
テーマは2つで1つ!

アフィンガー6(AFFINGER6)のインストール手順

用語が理解できたところで実際にインストール作業に取り掛かりましょう。

次の4つの工程で進めます。

※インストールは"AFFINGERブロックプラグイン"を入れるまで行ってください。プラグインを入れないとAFFINGER専用の記事パーツが使えません。

インストール手順

  1. zipを解凍
  2. 親テーマをインストール
  3. 子テーマをインストール&有効化
  4. "AFFINGERブロックプラグイン"をインストール&有効化

ここではAFFINGER6通常盤のインストール手順について解説します。EX版はファイル名が違うと思いますが手順は同じです。

ダウンロードしたzipを解凍

Infotopからダウンロードしたzipファイルがあります。まずはそれを解凍して中に入っているファイルを取り出しましょう。

ダンボールから商品を取り出すイメージです。

zipファイル(action_af6_dl.zip)を見つける

アフィンガー6(AFFINGER6)のインストール手順1:zipファイル(action_af6_dl.zip)を見つける

まずはパソコンでInfotopからダウンロードしたzipファイルを見つけてください。ファイル名はaction_af6_dl.zipです。

Macの場合は"ダウンロード"に保存されているはずです(Finder>ダウンロード)。Windowsの場合も同様に"ダウンロード"に保存されているはずです(左下のWindowsマーク>エクスプローラー>ダウンロード)。

  • Mac:Finderダウンロード
  • Windows:左下のWindowsマークエクスプローラーダウンロード

zipファイル(action_af6_dl.zip)を解凍する

アフィンガー6(AFFINGER6)のインストール手順1:zipファイル(action_af6_dl.zip)を解凍する

action_af6_dl.zipというファイルは見つかりましたか?見つけたら今度はそのzipファイルを解凍します。

Macの場合はzipファイルにカーソルを合わせてダブルクリックするか右クリック>開くを行なってください。Windowsの場合はzipファイルにカーソルを合わせて右クリック>すべて展開を行います。

  • Mac:ダブルクリック or 右クリック開く
  • Windows:右クリックすべて展開

するとzipが解凍され中から同じ名前のフォルダが出てきます。

これで無事にzipから商品を取り出すことができました。

WordPressに親テーマをインストール

まず親テーマをWordPressにインストールしましょう。

ファイル"WordPressテーマ"の中身を確認

アフィンガー6(AFFINGER6)のインストール手順2:ファイル"WordPressテーマ"の中身を確認

zipファイルを解凍すると中からいろんなファイルが出てきます。この中のWordPressテーマというフォルダの中身を確認しましょう。このフォルダの中に2つのzipが入っています。affinger6.zipaffinger6-child.zipです。affinger6.zipが親テーマ、affinger6-child.zipが子テーマになります(上の「親テーマ子テーマとは?」を参照)。

  • affinger6.zip
  • affinger6-child.zip

初心者は注意!

この2つのzipはこれ以上解凍しないでください。解凍してしまうとインストールできなくなります。ここは初心者がハマりやすいポイントなので要注意です!もし解凍してしまったらそのファイルを削除してもう一度最初からやり直してください。

親テーマをインストール

ご自身のWordPressにログインしてください。テーマを管理する画面へ移動します。次の場所へ移動してください。

ダッシュボード】外観】【テーマ】

アフィンガー6(AFFINGER6)のインストール手順2:親テーマをインストール(テーマ画面)

テーマ】と書いてある画面に来たと思います。画面の上の方に新規追加のボタンがあります。そこをクリックしてください。

アフィンガー6(AFFINGER6)のインストール手順2:テーマのアップロード

すると【テーマを追加】という画面に来ます。先ほどと同じ場所にテーマのアップロードというボタンがあるので今度はそこをクリックしてください。

するとファイルを選択する画面が出てきます。ファイルを選択というボタンを押してください。PCのファイルが一覧で出てきます。先ほどzipを保存した場所(普通は"ダウンロード")に行き親テーマ(affinger6.zip)を選択しましょう(※子テーマ(affinger6-child.zip)を選ばないこと)。

選択が完了したら今すぐインストールというボタンを押してください。

アフィンガー6(AFFINGER6)のインストール手順2:親テーマのインストールが完了

するとこのような画面に切り替わります。「テーマのインストールが完了しました」というメッセージが出てきたら親テーマのインストールは完了です。

テーマページへ移動を押してください。

子テーマをインストール&有効化

次は子テーマをWordPressにインストールします。最後に有効化してテーマの設置は完了です。

再びテーマを管理する画面へ移動します。

ダッシュボード】外観】【テーマ】

アフィンガー6(AFFINGER6)のインストール手順3:子テーマをアップロードする

先ほどと同じ要領でファイル選択へ行き今度は子テーマ(affinger6-child.zip)を選択してください。選択したら今すぐインストールを押します。

アフィンガー6(AFFINGER6)のインストール手順3:子テーマを有効化する

再び「テーマのインストールが完了しました」というメッセージが出ます。今度は先ほどと違い有効化ボタンを押します。

アフィンガー6(AFFINGER6)のインストール手順3:子テーマのインストール、有効化が完了

これでテーマの設置は完了しました。

"AFFINGERブロックプラグイン"をインストールする

テーマはインストールできましたがまだやることがあります!それがAFFINGERブロックプラグインのインストールです。最後にこのプラグインをインストールして終わりましょう。

AFFINGERブロックプラグインとはAFFINGER専用の"記事パーツ拡張"プラグインです。これをインストールするとAFFINGER専用のパーツや装飾が使えるようになります。逆に言うとこれをインストールしない限りAFFINGER専用のパーツや装飾は使えません。

これがなくても一応動くことは動きますがこれがないとAFFINGERの力を半分も引き出すことができません。なので必ずインストールしてください。

Gutenberg用プラグイン2(アフィンガー6の記事作成拡張プラグイン)

このプラグインをインストールし忘れている人をよく見かけます。

ファイル"AFFINGERブロックプラグイン"の中身を確認

それでは作業に移ります。最初にzipを解凍した時、いろんなファイルの中にAFFINGERブロックというファイルがあったと思います。この中身を確認してください。st-blocks.zipというzipがあると思います。これを使います。

アフィンガー6(AFFINGER6)のインストール手順4:ファイル"Gutenberg用プラグイン"の中身を確認

"st-blocks.zip"をインストール

WordPressにログインしてプラグインの追加画面に行きましょう。

ダッシュボード】プラグイン】【新規追加】

アフィンガー6(AFFINGER6)のインストール手順4:"Gutenbergプラグイン2"のアップロード

そこにあるプラグインのアップロードボタンを押してください【1】。ボタンを押すとファイルを選択する画面が出てきます【2】。そこで先ほど確認したst-blocks.zipを選択してください(AFFINGERブロックプラグインst-blocks.zip)。選択したら今すぐインストールボタンを押します【3】。

アフィンガー6(AFFINGER6)のインストール手順4:"Gutenbergプラグイン2"の有効化

すると画面が切り替わり「プラグインのインストールが完了しました。」とメッセージが出ます。プラグインを有効化ボタンを押してください。

アフィンガー6(AFFINGER6)のインストール手順4:"Gutenbergプラグイン2"のアップロード完了

また画面が切り替わり「プラグインを有効化しました。」とメッセージが出ます。

以上でプラグインのインストールは完了です。


お疲れ様です。これでAFFINGERのインストールは全て完了しました。

-アフィンガー6(AFFINGER6)